@atlaskit/smart-card 36.10.1 → 36.11.1

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @atlaskit/smart-card
 
+## 36.11.1
+
+### Patch Changes
+
+- [#146358](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/146358)
+  [`cb49f60f88979`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cb49f60f88979) -
+  [ux] Update profile icons to be rounded
+- Updated dependencies
+
+## 36.11.0
+
+### Minor Changes
+
+- [#147390](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/147390)
+  [`936db03f49922`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/936db03f49922) -
+  [ux] EDM-12440 fixing regression with position styles introduced with SL icon migration
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 36.10.1
 
 ### Patch Changes

package/dist/cjs/extractors/embed/index.js

@@ -26,21 +26,25 @@ var extractEmbedProps = exports.extractEmbedProps = function extractEmbedProps(r
   var meta = response === null || response === void 0 ? void 0 : response.meta;
   var jsonLd = (response === null || response === void 0 ? void 0 : response.data) || (0, _jsonld.getEmptyJsonLd)();
   if ((0, _platformFeatureFlags.fg)('smart_links_noun_support')) {
-    return {
+    return _objectSpread({
       link: (0, _linkExtractors.extractSmartLinkUrl)(response) || '',
       title: (0, _linkExtractors.extractSmartLinkTitle)(response),
       context: (0, _context.extractSmartLinkContext)(response),
       preview: (0, _linkExtractors.extractSmartLinkEmbed)(response, iframeUrlType),
       isTrusted: (0, _extractIsTrusted.extractIsTrusted)(meta),
       isSupportTheming: (0, _extractIsSupportTheming.extractIsSupportTheming)(meta)
-    };
+    }, (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') && {
+      type: (0, _linkExtractors.extractType)(jsonLd)
+    });
   }
-  return {
+  return _objectSpread({
     link: (0, _linkExtractors.extractLink)(jsonLd) || '',
     title: (0, _linkExtractors.extractTitle)(jsonLd),
     context: (0, _context.generateContext)(jsonLd),
     preview: extractEmbedPreview(jsonLd, platform, iframeUrlType),
     isTrusted: (0, _extractIsTrusted.extractIsTrusted)(meta),
     isSupportTheming: (0, _extractIsSupportTheming.extractIsSupportTheming)(meta)
-  };
+  }, (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') && {
+    type: (0, _linkExtractors.extractType)(jsonLd)
+  });
 };

package/dist/cjs/extractors/flexible/index.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _linkExtractors = require("@atlaskit/link-extractors");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
@@ -22,6 +23,8 @@ var _utils = require("./utils");
 var _excluded = ["appearance", "fireEvent", "id", "origin", "renderers", "resolve", "actionOptions", "response", "aiSummaryConfig"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var extractFlexibleUiContextFromJsonLd = function extractFlexibleUiContextFromJsonLd() {
   var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var appearance = _ref.appearance,
@@ -39,7 +42,7 @@ var extractFlexibleUiContextFromJsonLd = function extractFlexibleUiContextFromJs
   }
   var data = response.data;
   var url = (0, _linkExtractors.extractLink)(data);
-  return {
+  return _objectSpread({
     actions: (0, _actions.extractFlexibleCardActions)({
       actionOptions: actionOptions,
       aiSummaryConfig: aiSummaryConfig,
@@ -88,7 +91,9 @@ var extractFlexibleUiContextFromJsonLd = function extractFlexibleUiContextFromJs
     title: (0, _linkExtractors.extractTitle)(data) || url,
     url: url,
     ari: (0, _linkExtractors.extractAri)(data)
-  };
+  }, (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') && {
+    type: (0, _linkExtractors.extractType)(data)
+  });
 };
 var extractFlexibleUiContextFromEntity = function extractFlexibleUiContextFromEntity() {
   var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
@@ -104,7 +109,7 @@ var extractFlexibleUiContextFromEntity = function extractFlexibleUiContextFromEn
   }
   var data = response.data;
   var url = (0, _linkExtractors.extractSmartLinkUrl)(response);
-  return {
+  return _objectSpread({
     actions: (0, _actions.extractFlexibleCardActions)({
       response: response,
       actionOptions: actionOptions,
@@ -151,7 +156,9 @@ var extractFlexibleUiContextFromEntity = function extractFlexibleUiContextFromEn
     subTasksProgress: (0, _utils.extractSubTasksProgress)(data),
     storyPoints: (0, _utils.extractStoryPoints)(data),
     targetBranch: (0, _utils.extractTargetBranch)(data)
-  };
+  }, (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') && {
+    type: (0, _linkExtractors.extractType)(data)
+  });
 };
 var extractFlexibleUiContext = function extractFlexibleUiContext() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

package/dist/cjs/extractors/inline/index.js

@@ -1,9 +1,11 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.extractInlineProps = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _linkExtractors = require("@atlaskit/link-extractors");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _icon = require("../common/icon");
@@ -11,6 +13,8 @@ var _lozenge = require("../common/lozenge");
 var _primitives = require("../common/primitives");
 var _titlePrefix = require("../common/title-prefix");
 var _constants = require("../constants");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var extractInlineIcon = function extractInlineIcon(jsonLd) {
   var showIconLabel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
   var provider = (0, _linkExtractors.extractProvider)(jsonLd);
@@ -44,7 +48,7 @@ var extractInlineProps = exports.extractInlineProps = function extractInlineProp
   var showLabel = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
   var jsonLd = response === null || response === void 0 ? void 0 : response.data;
   if ((0, _platformFeatureFlags.fg)('smart_links_noun_support')) {
-    return {
+    return _objectSpread({
       link: (0, _linkExtractors.extractSmartLinkUrl)(response),
       title: (0, _linkExtractors.extractSmartLinkTitle)(response, removeTextHighlightingFromTitle),
       icon: extractSmartLinkInlineIcon(response, showLabel),
@@ -52,14 +56,18 @@ var extractInlineProps = exports.extractInlineProps = function extractInlineProp
       lozenge: (0, _lozenge.extractLozenge)(jsonLd),
       titleTextColor: (0, _primitives.extractTitleTextColor)(jsonLd),
       titlePrefix: (0, _titlePrefix.extractTitlePrefix)(jsonLd, renderers, 'inline')
-    };
+    }, (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') && {
+      type: (0, _linkExtractors.extractType)(jsonLd)
+    });
   }
-  return {
+  return _objectSpread({
     link: (0, _linkExtractors.extractLink)(jsonLd),
     title: (0, _linkExtractors.extractTitle)(jsonLd, removeTextHighlightingFromTitle),
     lozenge: (0, _lozenge.extractLozenge)(jsonLd),
     icon: extractInlineIcon(jsonLd, showLabel),
     titleTextColor: (0, _primitives.extractTitleTextColor)(jsonLd),
     titlePrefix: (0, _titlePrefix.extractTitlePrefix)(jsonLd, renderers, 'inline')
-  };
+  }, (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') && {
+    type: (0, _linkExtractors.extractType)(jsonLd)
+  });
 };

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

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

package/dist/cjs/utils/index.js

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.sleep = exports.openUrl = exports.isSpecialKey = exports.isSpecialEvent = exports.isSpecialClick = exports.isIntersectionObserverSupported = exports.isIframe = exports.isIconSizeLarge = exports.importWithRetry = exports.handleOnClick = exports.getPreviewUrlWithTheme = exports.getLazyIcons = exports.getLabelForFileType = exports.getIframeSandboxAttribute = exports.getIconForFileType = exports.downloadUrl = void 0;
+exports.sleep = exports.openUrl = exports.isSpecialKey = exports.isSpecialEvent = exports.isSpecialClick = exports.isProfileType = exports.isIntersectionObserverSupported = exports.isIframe = exports.isIconSizeLarge = exports.importWithRetry = exports.handleOnClick = exports.getPreviewUrlWithTheme = exports.getLazyIcons = exports.getLabelForFileType = exports.getIframeSandboxAttribute = exports.getIconForFileType = exports.downloadUrl = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
@@ -758,4 +758,7 @@ var getPreviewUrlWithTheme = exports.getPreviewUrlWithTheme = function getPrevie
 };
 var isIconSizeLarge = exports.isIconSizeLarge = function isIconSizeLarge(size) {
   return size && [_constants.SmartLinkSize.Large, _constants.SmartLinkSize.XLarge].includes(size);
+};
+var isProfileType = exports.isProfileType = function isProfileType(type) {
+  return !!(type && type.includes('Profile'));
 };

package/dist/cjs/view/EmbedCard/components/ImageIcon.compiled.css

@@ -0,0 +1 @@
+._2rko14q2{border-radius:var(--ds-border-radius-circle,2002pc)}

package/dist/cjs/view/EmbedCard/components/ImageIcon.js

@@ -1,3 +1,4 @@
+/* ImageIcon.tsx generated by @compiled/babel-plugin v0.36.1 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -5,9 +6,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ImageIcon = void 0;
+require("./ImageIcon.compiled.css");
+var _runtime = require("@compiled/react/runtime");
 var _react = _interopRequireDefault(require("react"));
 var _reactRenderImage = _interopRequireDefault(require("react-render-image"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _styled = require("./styled");
+var styles = {
+  roundedImage: "_2rko14q2"
+};
 var ImageIcon = exports.ImageIcon = function ImageIcon(_ref) {
   var _ref$alt = _ref.alt,
     alt = _ref$alt === void 0 ? '' : _ref$alt,
@@ -15,7 +22,9 @@ var ImageIcon = exports.ImageIcon = function ImageIcon(_ref) {
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 16 : _ref$size,
     title = _ref.title,
-    defaultIcon = _ref.default;
+    defaultIcon = _ref.default,
+    _ref$appearance = _ref.appearance,
+    appearance = _ref$appearance === void 0 ? 'square' : _ref$appearance;
   // TODO: do we need this?
   if (!src) {
     return defaultIcon || null;
@@ -23,7 +32,7 @@ var ImageIcon = exports.ImageIcon = function ImageIcon(_ref) {
   var LoadedImageComponent = /*#__PURE__*/_react.default.createElement(_styled.Image
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
   , {
-    className: "smart-link-icon",
+    className: (0, _runtime.ax)([appearance === 'round' && (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') && styles.roundedImage, "smart-link-icon"]),
     src: src,
     alt: alt,
     size: size,

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

@@ -5,8 +5,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.EmbedCardResolvedView = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _link = _interopRequireDefault(require("@atlaskit/icon/core/migration/link"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _tokens = require("@atlaskit/tokens");
 var _utils = require("../../../utils");
 var _ExpandedFrame = require("../components/ExpandedFrame");
@@ -26,7 +28,8 @@ var EmbedCardResolvedView = exports.EmbedCardResolvedView = /*#__PURE__*/_react.
     inheritDimensions = _ref.inheritDimensions,
     onIframeDwell = _ref.onIframeDwell,
     onIframeFocus = _ref.onIframeFocus,
-    isSupportTheming = _ref.isSupportTheming;
+    isSupportTheming = _ref.isSupportTheming,
+    type = _ref.type;
   var iconFromContext = context === null || context === void 0 ? void 0 : context.icon;
   var src = typeof iconFromContext === 'string' ? iconFromContext : undefined;
   var text = title || (context === null || context === void 0 ? void 0 : context.text);
@@ -38,15 +41,18 @@ var EmbedCardResolvedView = exports.EmbedCardResolvedView = /*#__PURE__*/_react.
       color: "currentColor"
     });
   }, []);
+  var profileType = (0, _utils.isProfileType)(type) && (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2');
   var icon = _react.default.useMemo(function () {
     if ( /*#__PURE__*/_react.default.isValidElement(iconFromContext)) {
       return iconFromContext;
     }
-    return /*#__PURE__*/_react.default.createElement(_ImageIcon.ImageIcon, {
+    return /*#__PURE__*/_react.default.createElement(_ImageIcon.ImageIcon, (0, _extends2.default)({
       src: src,
       default: linkGlyph
-    });
-  }, [src, linkGlyph, iconFromContext]);
+    }, (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') && {
+      appearance: profileType ? 'round' : 'square'
+    }));
+  }, [iconFromContext, src, linkGlyph, profileType]);
   var themeState = (0, _tokens.useThemeObserver)();
   var previewUrl = preview === null || preview === void 0 ? void 0 : preview.src;
   if (previewUrl && isSupportTheming) {

package/dist/cjs/view/FlexibleCard/components/common/image-icon/index.compiled.css

@@ -0,0 +1 @@
+._2rko14q2{border-radius:var(--ds-border-radius-circle,2002pc)}

package/dist/cjs/view/FlexibleCard/components/common/image-icon/index.js

@@ -1,36 +1,49 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.1 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
+require("./index.compiled.css");
+var React = _interopRequireWildcard(require("react"));
+var _runtime = require("@compiled/react/runtime");
 var _reactRenderImage = _interopRequireDefault(require("react-render-image"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _loadingSkeleton = require("../loading-skeleton");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var styles = {
+  roundImg: "_2rko14q2"
+};
 var ImageIcon = function ImageIcon(_ref) {
   var defaultIcon = _ref.defaultIcon,
     testId = _ref.testId,
     url = _ref.url,
     width = _ref.width,
     height = _ref.height,
+    _ref$appearance = _ref.appearance,
+    appearance = _ref$appearance === void 0 ? 'square' : _ref$appearance,
     onError = _ref.onError,
     onLoad = _ref.onLoad;
-  return /*#__PURE__*/_react.default.createElement(_reactRenderImage.default, {
+  return /*#__PURE__*/React.createElement(_reactRenderImage.default, {
     src: url,
-    loading: /*#__PURE__*/_react.default.createElement(_loadingSkeleton.LoadingSkeleton, {
+    loading: /*#__PURE__*/React.createElement(_loadingSkeleton.LoadingSkeleton, {
       testId: "".concat(testId, "-loading"),
       width: width,
       height: height
     }),
-    loaded: /*#__PURE__*/_react.default.createElement("img", {
+    loaded: /*#__PURE__*/React.createElement("img", {
       src: url,
       "data-testid": "".concat(testId, "-image"),
       alt: "",
       style: {
         width: width,
         height: height
-      }
+      },
+      className: (0, _runtime.ax)([appearance === 'round' && (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') && styles.roundImg])
     }),
     errored: defaultIcon,
     onError: onError,

package/dist/cjs/view/FlexibleCard/components/elements/icon/index.js

@@ -73,6 +73,7 @@ var renderDefaultIcon = function renderDefaultIcon(label, testId) {
 };
 var renderImageIcon = function renderImageIcon(defaultIcon, url, testId) {
   var size = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : _constants.SmartLinkSize.Medium;
+  var appearance = arguments.length > 4 ? arguments[4] : undefined;
   var width = size === _constants.SmartLinkSize.Large ? "var(--ds-space-300, 24px)" : "var(--ds-space-200, 16px)";
   if (url) {
     return /*#__PURE__*/React.createElement(_imageIcon.default, (0, _extends2.default)({
@@ -82,6 +83,8 @@ var renderImageIcon = function renderImageIcon(defaultIcon, url, testId) {
     }, (0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') && {
       width: width,
       height: width
+    }, (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') && {
+      appearance: appearance
     }));
   }
 };
@@ -106,11 +109,13 @@ var Icon = function Icon(_ref) {
     size = _ref$size === void 0 ? _constants.SmartLinkSize.Medium : _ref$size,
     _ref$testId = _ref.testId,
     testId = _ref$testId === void 0 ? 'smart-element-icon' : _ref$testId,
-    url = _ref.url;
+    url = _ref.url,
+    _ref$appearance = _ref.appearance,
+    appearance = _ref$appearance === void 0 ? 'square' : _ref$appearance;
   var element = (0, _react.useMemo)(function () {
     var defaultIcon = renderDefaultIcon(label, testId);
-    return overrideIcon || (render === null || render === void 0 ? void 0 : render()) || renderImageIcon(defaultIcon, url, testId, (0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') ? size : undefined) || renderAtlaskitIcon(icon, testId, (0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') ? size : undefined) || defaultIcon;
-  }, [overrideIcon, icon, label, render, testId, url, size]);
+    return overrideIcon || (render === null || render === void 0 ? void 0 : render()) || renderImageIcon(defaultIcon, url, testId, (0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') ? size : undefined, (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') ? appearance : undefined) || renderAtlaskitIcon(icon, testId, (0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') ? size : undefined) || defaultIcon;
+  }, [label, testId, overrideIcon, render, url, size, appearance, icon]);
   var width = (0, _utils.getIconWidth)(size);
   return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({}, (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') ? {} : (0, _defineProperty2.default)({}, 'data-fit-to-content', true), {
     "data-smart-element": name,
@@ -118,7 +123,7 @@ var Icon = function Icon(_ref) {
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
     ,
-    className: (0, _runtime.ax)([(0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && styles.container, !(0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') && iconStylesMapOld[size], !(0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') && positionStyleMap[position], render && !(0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') && customRenderStyleMapOld[size], render && (0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') && customRenderStyleMapNew[size], className])
+    className: (0, _runtime.ax)([(0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1') && styles.container, !(0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') && iconStylesMapOld[size], positionStyleMap[position], render && !(0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') && customRenderStyleMapOld[size], render && (0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') && customRenderStyleMapNew[size], className])
   }), (0, _platformFeatureFlags.fg)('platform-smart-card-icon-migration') ? /*#__PURE__*/React.createElement(_compiled.Box, {
     xcss: styles.iconWrapperStyle,
     style: {

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

@@ -11,9 +11,11 @@ var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _constants = require("../../../../constants");
 var _messages = require("../../../../messages");
 var _flexibleUiContext = require("../../../../state/flexible-ui-context");
+var _utils = require("../../../../utils");
 var _appliedToComponentsCount = _interopRequireDefault(require("./applied-to-components-count"));
 var _atlaskitBadge = _interopRequireDefault(require("./atlaskit-badge"));
 var _avatarGroup = _interopRequireDefault(require("./avatar-group"));
@@ -27,6 +29,8 @@ var _text = _interopRequireDefault(require("./text"));
 var _elementMappings;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var elementMappings = (_elementMappings = {}, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_elementMappings, _constants.ElementName.AppliedToComponentsCount, {
   component: _appliedToComponentsCount.default,
   props: {
@@ -187,6 +191,11 @@ var getData = function getData(elementName, contextKey, context) {
       return toTextProps(data);
     case _constants.ElementName.Title:
       return toLinkProps(context.title, context.url);
+    case _constants.ElementName.LinkIcon:
+      if ((0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2')) {
+        return toLinkIconProps(data, context.type);
+      }
+      return (0, _typeof2.default)(data) === 'object' ? data : undefined;
     default:
       return (0, _typeof2.default)(data) === 'object' ? data : undefined;
   }
@@ -249,6 +258,18 @@ var toTextProps = function toTextProps(content) {
     content: content
   } : undefined;
 };
+var toLinkIconProps = function toLinkIconProps(data, type) {
+  var isDataLinkIcon = function isDataLinkIcon(_data) {
+    return (0, _typeof2.default)(_data) === 'object' && _data !== null && ('icon' in _data || 'url' in _data);
+  };
+  if (!isDataLinkIcon(data)) {
+    return (0, _typeof2.default)(data) === 'object' ? data : undefined;
+  }
+  var isImageRound = (0, _utils.isProfileType)(type);
+  return _objectSpread(_objectSpread({}, data), {}, {
+    appearance: isImageRound ? 'round' : 'square'
+  });
+};
 var createElement = exports.createElement = function createElement(name) {
   var _ref = elementMappings[name] || {},
     BaseElement = _ref.component,

package/dist/cjs/view/InlineCard/IconAndTitleLayout/index.compiled.css

@@ -1,4 +1,5 @@
 ._11c81o8v{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._2rko14q2{border-radius:var(--ds-border-radius-circle,2002pc)}
 ._2rkogqwt{border-radius:var(--ds-border-radius-050,2px)}
 ._2rkoyh40{border-radius:2px}
 ._154i1ssb{top:50%}

package/dist/cjs/view/InlineCard/IconAndTitleLayout/index.js

@@ -18,6 +18,7 @@ var _link = _interopRequireDefault(require("@atlaskit/icon/core/migration/link")
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _colors = require("@atlaskit/theme/colors");
+var _utils = require("../../../utils");
 var _Icon = require("../Icon");
 var _styled = require("./styled");
 var _excluded = ["as", "style"],
@@ -33,7 +34,8 @@ var styles = {
   iconOuterWrapperStyle: "_1e0c1o8l _2hwx1b66 _kqswh2mm",
   iconTitleWrapperStyle: "_o5721jtm _1nmz9jpi _16d9qvcn _ca0qv77o _u5f31b66 _n3tdv77o _19bv1b66",
   linkStyle: "_2rkogqwt",
-  noLinkAppearanceStyle: "_syaz131l _18u01b66"
+  noLinkAppearanceStyle: "_syaz131l _18u01b66",
+  roundImageStyle: "_2rko14q2"
 };
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- Ignored via go/DSP-18766
 var NoLinkAppearanceOldVisualRefresh = (0, _react.forwardRef)(function (_ref, __cmplr) {
@@ -78,7 +80,8 @@ var IconAndTitleLayout = exports.IconAndTitleLayout = function IconAndTitleLayou
     link = _ref3.link,
     rightSide = _ref3.rightSide,
     _ref3$testId = _ref3.testId,
-    testId = _ref3$testId === void 0 ? 'inline-card-icon-and-title' : _ref3$testId;
+    testId = _ref3$testId === void 0 ? 'inline-card-icon-and-title' : _ref3$testId,
+    type = _ref3.type;
   var renderAtlaskitIcon = _react.default.useCallback(function () {
     if (emoji) {
       if ((0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1')) {
@@ -94,6 +97,7 @@ var IconAndTitleLayout = exports.IconAndTitleLayout = function IconAndTitleLayou
     }
     return /*#__PURE__*/_react.default.createElement(_styled.IconWrapperOldVisualRefresh, null, icon);
   }, [emoji, icon]);
+  var profileType = (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') ? (0, _utils.isProfileType)(type) : false;
   var renderImageIcon = _react.default.useCallback(function (errored, testId) {
     if (!icon || typeof icon !== 'string') {
       return null;
@@ -105,7 +109,7 @@ var IconAndTitleLayout = exports.IconAndTitleLayout = function IconAndTitleLayou
           src: icon,
           "data-testid": "".concat(testId, "-image"),
           alt: "",
-          className: (0, _runtime.ax)(["_c71l7vkz _p12f7vkz _1bsb1osq"])
+          className: (0, _runtime.ax)(["_c71l7vkz _p12f7vkz _1bsb1osq", profileType && styles.roundImageStyle])
         }),
         errored: errored,
         loading: /*#__PURE__*/_react.default.createElement(_Icon.Shimmer, {
@@ -113,23 +117,23 @@ var IconAndTitleLayout = exports.IconAndTitleLayout = function IconAndTitleLayou
         })
       });
     }
+    var removedProps = !(0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') ? {
+      className: "smart-link-icon"
+    } : {};
     return /*#__PURE__*/_react.default.createElement(_reactRenderImage.default, {
       src: icon,
-      loaded:
-      /*#__PURE__*/
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
-      _react.default.createElement(_Icon.Icon, {
-        className: "smart-link-icon",
+      loaded: /*#__PURE__*/_react.default.createElement(_Icon.Icon, (0, _extends2.default)({}, removedProps, {
         src: icon,
         "data-testid": "".concat(testId, "-image"),
-        alt: ""
-      }),
+        alt: "",
+        className: (0, _runtime.ax)([profileType && styles.roundImageStyle])
+      })),
       errored: errored,
       loading: /*#__PURE__*/_react.default.createElement(_Icon.Shimmer, {
         testId: "".concat(testId, "-loading")
       })
     });
-  }, [icon]);
+  }, [icon, profileType]);
   var renderIconPlaceholder = _react.default.useCallback(function (testId) {
     if ((0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v1')) {
       return defaultIcon || /*#__PURE__*/_react.default.createElement(_link.default, {

package/dist/cjs/view/InlineCard/ResolvedView/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.InlineCardResolvedView = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
@@ -61,7 +62,8 @@ var InlineCardResolvedView = exports.InlineCardResolvedView = /*#__PURE__*/funct
         showHoverPreview = _this$props$showHover === void 0 ? false : _this$props$showHover,
         hoverPreviewOptions = _this$props.hoverPreviewOptions,
         actionOptions = _this$props.actionOptions,
-        truncateInline = _this$props.truncateInline;
+        truncateInline = _this$props.truncateInline,
+        type = _this$props.type;
       var inlineCardResolvedView = /*#__PURE__*/_react.default.createElement(_Frame.Frame, {
         testId: testId,
         link: link,
@@ -69,12 +71,14 @@ var InlineCardResolvedView = exports.InlineCardResolvedView = /*#__PURE__*/funct
         isHovered: isHovered,
         onClick: onClick,
         truncateInline: truncateInline
-      }, /*#__PURE__*/_react.default.createElement(_IconAndTitleLayout.IconAndTitleLayout, {
+      }, /*#__PURE__*/_react.default.createElement(_IconAndTitleLayout.IconAndTitleLayout, (0, _extends2.default)({
         emoji: titlePrefix,
         icon: icon,
         title: title,
         titleTextColor: titleTextColor
-      }), this.renderLozenge());
+      }, (0, _platformFeatureFlags.fg)('platform-linking-visual-refresh-v2') && {
+        type: type
+      })), this.renderLozenge());
       if (showHoverPreview && link) {
         return /*#__PURE__*/_react.default.createElement(_HoverCard.HoverCard, {
           id: id,

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

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

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

@@ -1,4 +1,4 @@
-import { extractLink, extractPreview, extractSmartLinkEmbed, extractSmartLinkTitle, extractSmartLinkUrl, extractTitle } from '@atlaskit/link-extractors';
+import { extractLink, extractPreview, extractSmartLinkEmbed, extractSmartLinkTitle, extractSmartLinkUrl, extractTitle, extractType } from '@atlaskit/link-extractors';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { getEmptyJsonLd } from '../../utils/jsonld';
 import { extractSmartLinkContext, generateContext } from '../common/context';
@@ -23,7 +23,10 @@ export const extractEmbedProps = (response, platform, iframeUrlType) => {
       context: extractSmartLinkContext(response),
       preview: extractSmartLinkEmbed(response, iframeUrlType),
       isTrusted: extractIsTrusted(meta),
-      isSupportTheming: extractIsSupportTheming(meta)
+      isSupportTheming: extractIsSupportTheming(meta),
+      ...(fg('platform-linking-visual-refresh-v2') && {
+        type: extractType(jsonLd)
+      })
     };
   }
   return {
@@ -32,6 +35,9 @@ export const extractEmbedProps = (response, platform, iframeUrlType) => {
     context: generateContext(jsonLd),
     preview: extractEmbedPreview(jsonLd, platform, iframeUrlType),
     isTrusted: extractIsTrusted(meta),
-    isSupportTheming: extractIsSupportTheming(meta)
+    isSupportTheming: extractIsSupportTheming(meta),
+    ...(fg('platform-linking-visual-refresh-v2') && {
+      type: extractType(jsonLd)
+    })
   };
 };

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

@@ -1,4 +1,4 @@
-import { extractAri, extractDateCreated, extractDateUpdated, extractLink, extractPersonCreatedBy, extractPersonOwnedBy, extractSmartLinkAri, extractSmartLinkCreatedBy, extractSmartLinkCreatedOn, extractSmartLinkModifiedBy, extractSmartLinkModifiedOn, extractSmartLinkTitle, extractSmartLinkUrl, extractTitle } from '@atlaskit/link-extractors';
+import { extractAri, extractDateCreated, extractDateUpdated, extractLink, extractPersonCreatedBy, extractPersonOwnedBy, extractSmartLinkAri, extractSmartLinkCreatedBy, extractSmartLinkCreatedOn, extractSmartLinkModifiedBy, extractSmartLinkModifiedOn, extractSmartLinkTitle, extractSmartLinkUrl, extractTitle, extractType } from '@atlaskit/link-extractors';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { extractSummary } from '../common/primitives';
 import { extractFlexibleCardActions } from './actions';
@@ -75,7 +75,10 @@ const extractFlexibleUiContextFromJsonLd = ({
     targetBranch: extractTargetBranch(data),
     title: extractTitle(data) || url,
     url,
-    ari: extractAri(data)
+    ari: extractAri(data),
+    ...(fg('platform-linking-visual-refresh-v2') && {
+      type: extractType(data)
+    })
   };
 };
 const extractFlexibleUiContextFromEntity = ({
@@ -138,7 +141,10 @@ const extractFlexibleUiContextFromEntity = ({
     subscriberCount: extractSubscriberCount(data),
     subTasksProgress: extractSubTasksProgress(data),
     storyPoints: extractStoryPoints(data),
-    targetBranch: extractTargetBranch(data)
+    targetBranch: extractTargetBranch(data),
+    ...(fg('platform-linking-visual-refresh-v2') && {
+      type: extractType(data)
+    })
   };
 };
 const extractFlexibleUiContext = (props = {}) => {