@atlaskit/smart-card 26.38.0 → 26.39.0

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

@@ -4,18 +4,18 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.titleBlockCss = exports.metadataBlockCss = exports.forbiddenViewTitleStyle = exports.footerBlockCss = exports.flexibleBlockCardStyle = void 0;
+exports.titleBlockCss = exports.metadataBlockCss = 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, _templateObject6;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 // 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"])));
+// renderer overwrites the margin-right so we need to add it here
+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      margin-right: 0.5rem;\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 forbiddenViewTitleStyle = exports.forbiddenViewTitleStyle = (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 600;\n"])));
+var flexibleBlockCardStyle = exports.flexibleBlockCardStyle = (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? refreshedFlexibleBlockCardStyle : flexibleBlockCardElevationStyle;

package/dist/cjs/view/BlockCard/views/flexible/unresolved-view/index.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _blocks = require("../../../../FlexibleCard/components/blocks");
+var _react = _interopRequireDefault(require("react"));
+var _FlexibleCard = _interopRequireDefault(require("../../../../FlexibleCard"));
+var _utils = require("../utils");
+var UnresolvedView = function UnresolvedView(_ref) {
+  var actions = _ref.actions,
+    cardState = _ref.cardState,
+    children = _ref.children,
+    onAuthorize = _ref.onAuthorize,
+    onClick = _ref.onClick,
+    onError = _ref.onError,
+    _ref$showPreview = _ref.showPreview,
+    showPreview = _ref$showPreview === void 0 ? false : _ref$showPreview,
+    testId = _ref.testId,
+    title = _ref.title,
+    url = _ref.url;
+  return /*#__PURE__*/_react.default.createElement(_FlexibleCard.default, {
+    appearance: "block",
+    cardState: cardState,
+    onAuthorize: onAuthorize,
+    onClick: onClick,
+    onError: onError,
+    testId: testId,
+    ui: _utils.FlexibleCardUiOptions,
+    url: url
+  }, /*#__PURE__*/_react.default.createElement(_blocks.TitleBlock, (0, _extends2.default)({}, (0, _utils.getTitleBlockOptions)(), {
+    text: title
+  })), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, children), showPreview && /*#__PURE__*/_react.default.createElement(_blocks.PreviewBlock, _utils.PreviewBlockOptions), /*#__PURE__*/_react.default.createElement(_blocks.InternalFooterBlock, (0, _extends2.default)({}, (0, _utils.getFooterBlockOptions)(), {
+    actions: actions,
+    testId: "smart-block-card-footer"
+  })));
+};
+var _default = exports.default = UnresolvedView;

package/dist/cjs/view/BlockCard/views/flexible/utils/index.js

@@ -3,10 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getSimulatedMetadata = exports.getSimulatedBetterMetadata = void 0;
+exports.getTitleBlockOptions = exports.getSimulatedMetadata = exports.getSimulatedBetterMetadata = exports.getFooterBlockOptions = exports.PreviewBlockOptions = exports.FlexibleCardUiOptions = void 0;
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _constants = require("../../../../../constants");
 var _utils = require("../../../../../extractors/flexible/utils");
 var _helpers = require("../../../../../state/helpers");
+var _styled = require("../styled");
 var baseTopMetadata = [{
   name: _constants.ElementName.ModifiedOn
 }, {
@@ -140,4 +142,31 @@ var getSimulatedMetadata = exports.getSimulatedMetadata = function getSimulatedM
     titleMetadata: titleMetadata,
     topMetadata: topMetadata
   };
+};
+var FlexibleCardUiOptions = exports.FlexibleCardUiOptions = {
+  hideElevation: true
+};
+
+// Due to the use of getBooleanFF(), this has to be a function.
+// Make this a const object after ff cleanup.
+var getTitleBlockOptions = exports.getTitleBlockOptions = function getTitleBlockOptions() {
+  return {
+    anchorTarget: (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-block-card-clicks-opening-in-same-tab') ? '_self' : undefined,
+    position: _constants.SmartLinkPosition.Center,
+    overrideCss: _styled.titleBlockCss,
+    hideRetry: true,
+    size: (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? _constants.SmartLinkSize.Large : undefined
+  };
+};
+var PreviewBlockOptions = exports.PreviewBlockOptions = {
+  placement: _constants.MediaPlacement.Right,
+  ignoreContainerPadding: true
+};
+
+// Due to the use of getBooleanFF(), this has to be a function.
+// Make this a const object after ff cleanup.
+var getFooterBlockOptions = exports.getFooterBlockOptions = function getFooterBlockOptions() {
+  return {
+    overrideCss: (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? _styled.footerBlockCss : undefined
+  };
 };

package/dist/cjs/view/FlexibleCard/components/blocks/footer-block/index.js

@@ -1,34 +1,16 @@
 "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 _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = _interopRequireWildcard(require("react"));
-var _react2 = require("@emotion/react");
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _resolved = _interopRequireDefault(require("./resolved"));
 var _constants = require("../../../../../constants");
-var _block = _interopRequireDefault(require("../block"));
-var _elementGroup = _interopRequireDefault(require("../element-group"));
-var _elements = require("../../elements");
-var _actionGroup = _interopRequireDefault(require("../action-group"));
-var _utils = require("../utils");
-var _flexibleUiContext = require("../../../../../state/flexible-ui-context");
-var _templateObject;
-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 getActionGroupStyles = function getActionGroupStyles(size) {
-  if (size === _constants.SmartLinkSize.XLarge) {
-    // The biggest height of the action button exceeds the max line-height
-    // of the elements causing the action on the block with x-large size to
-    // get cut at the bottom.
-    return (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n      max-height: 2rem;\n    "])));
-  }
-};
-
+var _excluded = ["status", "testId"];
 /**
  * Represents a FooterBlock, designed to contain elements and actions that should appear
  * at the bottom of a link card.
@@ -36,43 +18,16 @@ var getActionGroupStyles = function getActionGroupStyles(size) {
  * @param {FooterBlockProps} FooterBlockProps
  * @see Block
  */
-var FooterBlock = function FooterBlock(props) {
-  var status = props.status,
-    actions = props.actions,
-    _props$size = props.size,
-    size = _props$size === void 0 ? _constants.SmartLinkSize.Medium : _props$size,
-    _props$testId = props.testId,
-    testId = _props$testId === void 0 ? 'smart-footer-block' : _props$testId,
-    onActionMenuOpenChange = props.onActionMenuOpenChange;
-  var context = (0, _flexibleUiContext.useFlexibleUiContext)();
-  var hasActions = (0, _react.useMemo)(function () {
-    var _filterActionItems;
-    return ((_filterActionItems = (0, _utils.filterActionItems)(actions, context)) === null || _filterActionItems === void 0 ? void 0 : _filterActionItems.length) > 0;
-  }, [actions, context]);
-  var onDropdownOpenChange = (0, _react.useCallback)(function (isOpen) {
-    if (onActionMenuOpenChange) {
-      onActionMenuOpenChange({
-        isOpen: isOpen
-      });
-    }
-  }, [onActionMenuOpenChange]);
+var FooterBlock = function FooterBlock(_ref) {
+  var status = _ref.status,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'smart-footer-block' : _ref$testId,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   if (status !== _constants.SmartLinkStatus.Resolved) {
     return null;
   }
-  return /*#__PURE__*/_react.default.createElement(_block.default, (0, _extends2.default)({}, props, {
-    testId: "".concat(testId, "-resolved-view")
-  }), /*#__PURE__*/_react.default.createElement(_elements.Provider, {
-    testId: "".concat(testId, "-provider")
-  }), actions && hasActions ? /*#__PURE__*/_react.default.createElement(_elementGroup.default, {
-    testId: "smart-element-group-actions",
-    align: _constants.SmartLinkAlignment.Right,
-    direction: _constants.SmartLinkDirection.Horizontal,
-    overrideCss: getActionGroupStyles(size),
-    width: _constants.SmartLinkWidth.Flexible
-  }, /*#__PURE__*/_react.default.createElement(_actionGroup.default, {
-    onDropdownOpenChange: onDropdownOpenChange,
-    items: actions,
-    appearance: "default"
-  })) : null);
+  return /*#__PURE__*/_react.default.createElement(_resolved.default, (0, _extends2.default)({}, props, {
+    testId: testId
+  }));
 };
 var _default = exports.default = FooterBlock;

package/dist/cjs/view/FlexibleCard/components/blocks/footer-block/resolved/index.js

@@ -0,0 +1,65 @@
+"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 _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = require("@emotion/react");
+var _react2 = _interopRequireWildcard(require("react"));
+var _constants = require("../../../../../../constants");
+var _flexibleUiContext = require("../../../../../../state/flexible-ui-context");
+var _elements = require("../../../elements");
+var _actionGroup = _interopRequireDefault(require("../../action-group"));
+var _block = _interopRequireDefault(require("../../block"));
+var _elementGroup = _interopRequireDefault(require("../../element-group"));
+var _utils = require("../../utils");
+var _templateObject;
+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 getActionGroupStyles = function getActionGroupStyles(size) {
+  if (size === _constants.SmartLinkSize.XLarge) {
+    // The biggest height of the action button exceeds the max line-height
+    // of the elements causing the action on the block with x-large size to
+    // get cut at the bottom.
+    return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n      max-height: 2rem;\n    "])));
+  }
+};
+var FooterBlockResolvedView = function FooterBlockResolvedView(props) {
+  var actions = props.actions,
+    testId = props.testId,
+    onActionMenuOpenChange = props.onActionMenuOpenChange,
+    _props$size = props.size,
+    size = _props$size === void 0 ? _constants.SmartLinkSize.Medium : _props$size;
+  var context = (0, _flexibleUiContext.useFlexibleUiContext)();
+  var hasActions = (0, _react2.useMemo)(function () {
+    var _filterActionItems;
+    return ((_filterActionItems = (0, _utils.filterActionItems)(actions, context)) === null || _filterActionItems === void 0 ? void 0 : _filterActionItems.length) > 0;
+  }, [actions, context]);
+  var onDropdownOpenChange = (0, _react2.useCallback)(function (isOpen) {
+    if (onActionMenuOpenChange) {
+      onActionMenuOpenChange({
+        isOpen: isOpen
+      });
+    }
+  }, [onActionMenuOpenChange]);
+  return /*#__PURE__*/_react2.default.createElement(_block.default, (0, _extends2.default)({}, props, {
+    testId: "".concat(testId, "-resolved-view")
+  }), /*#__PURE__*/_react2.default.createElement(_elements.Provider, {
+    testId: "".concat(testId, "-provider")
+  }), actions && hasActions ? /*#__PURE__*/_react2.default.createElement(_elementGroup.default, {
+    testId: "smart-element-group-actions",
+    align: _constants.SmartLinkAlignment.Right,
+    direction: _constants.SmartLinkDirection.Horizontal,
+    overrideCss: getActionGroupStyles(size),
+    width: _constants.SmartLinkWidth.Flexible
+  }, /*#__PURE__*/_react2.default.createElement(_actionGroup.default, {
+    onDropdownOpenChange: onDropdownOpenChange,
+    items: actions,
+    appearance: "default"
+  })) : null);
+};
+var _default = exports.default = FooterBlockResolvedView;

package/dist/cjs/view/FlexibleCard/components/blocks/index.js

@@ -16,6 +16,12 @@ Object.defineProperty(exports, "FooterBlock", {
     return _footerBlock.default;
   }
 });
+Object.defineProperty(exports, "InternalFooterBlock", {
+  enumerable: true,
+  get: function get() {
+    return _resolved.default;
+  }
+});
 Object.defineProperty(exports, "MetadataBlock", {
   enumerable: true,
   get: function get() {
@@ -45,4 +51,5 @@ var _metadataBlock = _interopRequireDefault(require("./metadata-block"));
 var _previewBlock = _interopRequireDefault(require("./preview-block"));
 var _snippetBlock = _interopRequireDefault(require("./snippet-block"));
 var _titleBlock = _interopRequireDefault(require("./title-block"));
-var _block = _interopRequireDefault(require("./block"));
+var _block = _interopRequireDefault(require("./block"));
+var _resolved = _interopRequireDefault(require("./footer-block/resolved"));

package/dist/cjs/view/FlexibleCard/components/blocks/title-block/errored/index.js

@@ -17,7 +17,7 @@ var _constants = require("../../../../../../constants");
 var _utils = require("../../../utils");
 var _elementGroup = _interopRequireDefault(require("../../element-group"));
 var _token = require("../../../../../../utils/token");
-var _excluded = ["actionGroup", "retry", "position", "testId", "title"];
+var _excluded = ["actionGroup", "retry", "position", "testId", "title", "hideIcon"];
 var _templateObject, _templateObject2;
 /** @jsx jsx */
 var actionStyles = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  cursor: pointer;\n  :hover {\n    color: ", ";\n    text-decoration: underline;\n  }\n"])), _token.tokens.errorMessageHover);
@@ -39,6 +39,7 @@ var TitleBlockErroredView = function TitleBlockErroredView(_ref) {
     position = _ref.position,
     testId = _ref.testId,
     title = _ref.title,
+    hideIcon = _ref.hideIcon,
     blockProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var _ref2 = retry || {},
     descriptor = _ref2.descriptor,
@@ -49,7 +50,7 @@ var TitleBlockErroredView = function TitleBlockErroredView(_ref) {
   var hasAction = onClick !== undefined;
   return (0, _react2.jsx)(_block.default, (0, _extends2.default)({}, blockProps, {
     testId: "".concat(testId, "-errored-view")
-  }), (0, _react2.jsx)(_elements.LinkIcon, {
+  }), !hideIcon && (0, _react2.jsx)(_elements.LinkIcon, {
     position: position
   }), title, descriptor && (0, _react2.jsx)(_elementGroup.default, {
     direction: _constants.SmartLinkDirection.Horizontal,

package/dist/cjs/view/FlexibleCard/components/blocks/title-block/index.js

@@ -19,7 +19,7 @@ var _errored = _interopRequireDefault(require("./errored"));
 var _resolving = _interopRequireDefault(require("./resolving"));
 var _actionGroup = _interopRequireDefault(require("../action-group"));
 var _elements = require("../../elements");
-var _excluded = ["actions", "anchorTarget", "hideTitleTooltip", "maxLines", "onActionMenuOpenChange", "onClick", "overrideCss", "status", "showActionOnHover", "testId", "text", "theme", "hideRetry", "metadataPosition"];
+var _excluded = ["actions", "anchorTarget", "hideTitleTooltip", "maxLines", "onActionMenuOpenChange", "onClick", "overrideCss", "status", "showActionOnHover", "testId", "text", "theme", "hideRetry", "metadataPosition", "hideIcon"];
 var _templateObject, _templateObject2;
 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; }
@@ -75,6 +75,8 @@ var TitleBlock = function TitleBlock(_ref) {
     theme = _ref.theme,
     hideRetry = _ref.hideRetry,
     metadataPosition = _ref.metadataPosition,
+    _ref$hideIcon = _ref.hideIcon,
+    hideIcon = _ref$hideIcon === void 0 ? false : _ref$hideIcon,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   if (hideRetry && props.retry) {
     delete props.retry;
@@ -116,7 +118,8 @@ var TitleBlock = function TitleBlock(_ref) {
     overrideCss: combinedCss,
     testId: testId,
     title: title,
-    metadataPosition: metadataPosition
+    metadataPosition: metadataPosition,
+    hideIcon: hideIcon
   }));
 };
 var _default = exports.default = TitleBlock;

package/dist/cjs/view/FlexibleCard/components/blocks/title-block/resolved/index.js

@@ -33,8 +33,7 @@ var TitleBlockResolvedView = function TitleBlockResolvedView(_ref) {
     text = _ref.text,
     title = _ref.title,
     metadataPosition = _ref.metadataPosition,
-    _ref$hideIcon = _ref.hideIcon,
-    hideIcon = _ref$hideIcon === void 0 ? false : _ref$hideIcon,
+    hideIcon = _ref.hideIcon,
     blockProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var metadataElements = (0, _utils.renderElementItems)(metadata);
   var subtitleElements = (0, _utils.renderElementItems)(subtitle);

package/dist/cjs/view/FlexibleCard/components/blocks/title-block/resolving/index.js

@@ -13,7 +13,7 @@ var _block = _interopRequireDefault(require("../../block"));
 var _constants = require("../../../../../../constants");
 var _loadingSkeleton = _interopRequireDefault(require("../../../common/loading-skeleton"));
 var _utils = require("../../../utils");
-var _excluded = ["actionGroup", "testId", "title"];
+var _excluded = ["actionGroup", "testId", "title", "hideIcon"];
 /** @jsx jsx */
 /**
  * This represents a TitleBlock for a Smart Link that is currently waiting
@@ -25,6 +25,7 @@ var TitleBlockResolvingView = function TitleBlockResolvingView(_ref) {
   var actionGroup = _ref.actionGroup,
     testId = _ref.testId,
     title = _ref.title,
+    hideIcon = _ref.hideIcon,
     blockProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var _blockProps$size = blockProps.size,
     size = _blockProps$size === void 0 ? _constants.SmartLinkSize.Medium : _blockProps$size;
@@ -32,7 +33,7 @@ var TitleBlockResolvingView = function TitleBlockResolvingView(_ref) {
   var iconStyles = (0, _utils.getIconSizeStyles)(iconWidth);
   return (0, _react2.jsx)(_block.default, (0, _extends2.default)({}, blockProps, {
     testId: "".concat(testId, "-resolving-view")
-  }), (0, _react2.jsx)("span", {
+  }), !hideIcon && (0, _react2.jsx)("span", {
     css: iconStyles,
     "data-testid": "".concat(testId, "-icon")
   }, (0, _react2.jsx)(_loadingSkeleton.default, {

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.38.0",
+  packageVersion: "26.39.0",
   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.38.0"
+  packageVersion: "26.39.0"
 };
 export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

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

@@ -12,6 +12,7 @@ import { messages } from '../../../../messages';
  * @param providerName a string which is inserted into the message of the button
  */
 export const AuthorizeAction = (onAuthorize, providerName) => ({
+  appearance: 'primary',
   name: ActionName.CustomAction,
   content: providerName ? /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages.connect_unauthorised_account_action, {
     values: {

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

@@ -23,8 +23,6 @@ import FlexibleErroredView from './views/flexible/FlexibleErroredView';
 import { jsx } from '@emotion/react';
 import { handleClickCommon } from './utils/handlers';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
-import { titleBlockCss } from './views/flexible/styled';
-import { SmartLinkSize } from '../../constants';
 export { default as PreviewAction } from './actions/PreviewAction';
 export { ForbiddenAction, AuthorizeAction, BlockCardResolvedView, BlockCardResolvingView, BlockCardUnauthorisedView, BlockCardForbiddenView, BlockCardErroredView, BlockCardNotFoundView };
 export const BlockCard = ({
@@ -62,13 +60,6 @@ export const BlockCard = ({
     extensionKey
   };
   if (enableFlexibleBlockCard) {
-    const anchorTarget = getBooleanFF('platform.linking-platform.smart-card.enable-block-card-clicks-opening-in-same-tab') ? '_self' : undefined;
-    const titleBlockProps = {
-      overrideCss: titleBlockCss,
-      ...(getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
-        size: SmartLinkSize.Large
-      })
-    };
     const flexibleBlockCardProps = {
       id,
       cardState,
@@ -79,12 +70,7 @@ export const BlockCard = ({
       onResolve,
       renderers,
       showServerActions,
-      analytics,
-      extensionKey,
-      titleBlockProps: titleBlockProps,
-      ...(anchorTarget ? {
-        anchorTarget
-      } : {})
+      analytics
     };
     switch (status) {
       case 'pending':

package/dist/es2019/view/BlockCard/views/flexible/FlexibleErroredView.js

@@ -1,14 +1,11 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useMemo } from 'react';
-import FlexibleCard from '../../../FlexibleCard';
-import TitleBlock from '../../../FlexibleCard/components/blocks/title-block';
 import { messages } from '../../../../messages';
 import { R300 } from '@atlaskit/theme/colors';
 import WarningIcon from '@atlaskit/icon/glyph/warning';
-import BlockCardFooter from '../../components/flexible/footer';
 import { RetryAction } from '../../actions/flexible/RetryAction';
-import { CustomBlock } from '../../../FlexibleCard/components/blocks';
 import Text from '../../../FlexibleCard/components/elements/text';
+import UnresolvedView from './unresolved-view';
 import { withFlexibleUIBlockCardStyle } from './utils/withFlexibleUIBlockCardStyle';
 
 /**
@@ -18,32 +15,14 @@ import { withFlexibleUIBlockCardStyle } from './utils/withFlexibleUIBlockCardSty
  * @see FlexibleCardProps
  */
 const FlexibleErroredView = ({
-  anchorTarget,
-  cardState,
-  onAuthorize,
-  onError,
-  url,
-  onClick,
   testId = 'smart-block-errored-view',
-  titleBlockProps
+  ...props
 }) => {
-  const status = cardState.status;
-  const actions = useMemo(() => onAuthorize ? [RetryAction(onAuthorize)] : [], [onAuthorize]);
-  return /*#__PURE__*/React.createElement(FlexibleCard, {
-    appearance: "block",
-    cardState: cardState,
-    onAuthorize: onAuthorize,
-    onClick: onClick,
-    onError: onError,
-    testId: testId,
-    ui: {
-      hideElevation: true
-    },
-    url: url
-  }, /*#__PURE__*/React.createElement(TitleBlock, _extends({
-    hideRetry: true,
-    anchorTarget: anchorTarget
-  }, titleBlockProps)), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(WarningIcon, {
+  const actions = useMemo(() => props.onAuthorize ? [RetryAction(props.onAuthorize)] : [], [props.onAuthorize]);
+  return /*#__PURE__*/React.createElement(UnresolvedView, _extends({}, props, {
+    actions: actions,
+    testId: testId
+  }), /*#__PURE__*/React.createElement(WarningIcon, {
     label: "errored-warning-icon",
     size: "small",
     primaryColor: `var(--ds-icon-warning, ${R300})`,
@@ -52,9 +31,6 @@ const FlexibleErroredView = ({
     message: {
       descriptor: messages.could_not_load_link
     }
-  })), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(BlockCardFooter, {
-    actions: actions,
-    status: status
-  })));
+  }));
 };
 export default withFlexibleUIBlockCardStyle(FlexibleErroredView);