@atlaskit/smart-card 27.12.3 → 27.13.1

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @atlaskit/smart-card
 
+## 27.13.1
+
+### Patch Changes
+
+- [#127454](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/127454)
+  [`e869f31dbe200`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e869f31dbe200) -
+  [ux] Migrates away from legacy icons behind a feature flag.
+- Updated dependencies
+
+## 27.13.0
+
+### Minor Changes
+
+- [#127156](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/127156)
+  [`4795e7d3ea7c1`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/4795e7d3ea7c1) -
+  [ux] Increase inline smart-card icon size
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 27.12.3
 
 ### Patch 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: "27.12.3"
+  packageVersion: "27.13.1"
 };
 var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

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

@@ -30,9 +30,11 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 var getIconFF = function getIconFF() {
   if ((0, _platformFeatureFlags.fg)('platform.linking-platform.smart-card.hover-card-action-redesign')) {
     if ((0, _platformFeatureFlags.fg)('platform.linking-platform.smart-card.action-icon-redesign')) {
+      // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20003
       return _actualSize.default;
     }
   }
+  // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20003
   return _vidFullScreenOn.default;
 };
 var PreviewAction = function PreviewAction(_ref) {
@@ -81,6 +83,7 @@ var PreviewAction = function PreviewAction(_ref) {
     }
   }, [analytics, data, invoke, onClickCallback]);
   var isStackItem = props.as === 'stack-item';
+  // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20003
   var Icon = isStackItem ? _actualSize.default : getIconFF();
   var tooltipMessage = isStackItem ? _messages.messages.preview_description : _messages.messages.preview_improved;
   return data ? /*#__PURE__*/_react.default.createElement(_action.default, (0, _extends2.default)({

package/dist/cjs/view/FlexibleCard/components/blocks/related-urls-block/resolved/related-url-list/index.js

@@ -9,8 +9,8 @@ exports.default = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
-var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-down"));
-var _chevronUp = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-up"));
+var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-down"));
+var _chevronUp = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-up"));
 var _primitives = require("@atlaskit/primitives");
 var _react2 = require("@emotion/react");
 var _messages = require("../../../../../../../messages");
@@ -49,9 +49,11 @@ var RelatedUrlList = function RelatedUrlList(_ref) {
     testId: "".concat(testId, "-expand-title"),
     backgroundColor: "color.background.neutral.subtle",
     "aria-expanded": !!isOpen,
-    padding: "space.0"
+    padding: "space.0",
+    paddingInlineEnd: "space.050"
   }, /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
     alignBlock: "center",
+    space: "space.050",
     spread: "space-between"
   }, /*#__PURE__*/_react.default.createElement(_text.default, {
     overrideCss: (0, _react2.css)({
@@ -61,8 +63,9 @@ var RelatedUrlList = function RelatedUrlList(_ref) {
       descriptor: title
     }
   }), /*#__PURE__*/_react.default.createElement(ChevronComponent, {
+    LEGACY_margin: "0 -4px",
     label: (0, _utils.getFormattedMessageAsString)(intl, title),
-    size: 'medium'
+    color: "currentColor"
   }))), isOpen && /*#__PURE__*/_react.default.createElement(_resolvedResultStack.default, {
     resolvedResults: resolvedResults,
     testId: testId,

package/dist/cjs/view/InlineCard/Icon.js

@@ -4,9 +4,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Shimmer = exports.Icon = exports.AKIconWrapper = void 0;
+exports.Shimmer = exports.IconResized = exports.Icon = exports.AKIconWrapper = void 0;
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _linkingCommon = require("@atlaskit/linking-common");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _react = _interopRequireDefault(require("react"));
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
@@ -28,6 +29,19 @@ var Icon = exports.Icon = _styled.default.img({
   transform: 'translate(-50%, -50%)'
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var IconResized = exports.IconResized = _styled.default.img({
+  height: '16px',
+  width: '16px',
+  marginRight: "var(--ds-space-050, 4px)",
+  borderRadius: '2px',
+  userSelect: 'none',
+  position: 'absolute',
+  top: '50%',
+  left: '50%',
+  transform: 'translate(-50%, -50%)'
+});
+
 // Used for 'untrue' icons which claim to be 16x16 but
 // are less than that in height/width.
 // TODO: Replace this override with proper AtlasKit solution.
@@ -47,8 +61,8 @@ var Shimmer = exports.Shimmer = function Shimmer(_ref) {
     marginRight: "var(--ds-space-050, 4px)"
   };
   return /*#__PURE__*/_react.default.createElement(_linkingCommon.Skeleton, {
-    width: 14,
-    height: 14,
+    width: (0, _platformFeatureFlags.fg)('linking-platform-increase-inline-card-icon-size') ? 16 : 14,
+    height: (0, _platformFeatureFlags.fg)('linking-platform-increase-inline-card-icon-size') ? 16 : 14,
     borderRadius: 2,
     testId: testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766

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

@@ -18,6 +18,7 @@ var _Icon = require("../Icon");
 var _styled = require("./styled");
 var _link = _interopRequireDefault(require("@atlaskit/icon/core/migration/link"));
 var _styled2 = require("../styled");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 var IconAndTitleLayout = exports.IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
@@ -58,12 +59,12 @@ var IconAndTitleLayout = exports.IconAndTitleLayout = /*#__PURE__*/function (_Re
         icon = _this$props.icon,
         emoji = _this$props.emoji;
       if (emoji) {
-        return /*#__PURE__*/_react.default.createElement(_styled.EmojiWrapper, null, emoji);
+        return (0, _platformFeatureFlags.fg)('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/_react.default.createElement(_styled.EmojiWrapperResized, null, emoji) : /*#__PURE__*/_react.default.createElement(_styled.EmojiWrapper, null, emoji);
       }
       if (!icon || typeof icon === 'string') {
         return null;
       }
-      return /*#__PURE__*/_react.default.createElement(_styled.IconWrapper, null, icon);
+      return (0, _platformFeatureFlags.fg)('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/_react.default.createElement(_styled.IconWrapperResized, null, icon) : /*#__PURE__*/_react.default.createElement(_styled.IconWrapper, null, icon);
     }
   }, {
     key: "renderImageIcon",
@@ -72,15 +73,22 @@ var IconAndTitleLayout = exports.IconAndTitleLayout = /*#__PURE__*/function (_Re
       if (!url || typeof url !== 'string') {
         return null;
       }
+      var icon = (0, _platformFeatureFlags.fg)('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/_react.default.createElement(_Icon.IconResized
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      , {
+        className: "smart-link-icon",
+        src: url,
+        "data-testid": "".concat(testId, "-image")
+      }) : /*#__PURE__*/_react.default.createElement(_Icon.Icon
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      , {
+        className: "smart-link-icon",
+        src: url,
+        "data-testid": "".concat(testId, "-image")
+      });
       return /*#__PURE__*/_react.default.createElement(_reactRenderImage.default, {
         src: url,
-        loaded: /*#__PURE__*/_react.default.createElement(_Icon.Icon
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-        , {
-          className: "smart-link-icon",
-          src: url,
-          "data-testid": "".concat(testId, "-image")
-        }),
+        loaded: icon,
         errored: errored,
         loading: /*#__PURE__*/_react.default.createElement(_Icon.Shimmer, {
           testId: "".concat(testId, "-loading")
@@ -94,7 +102,14 @@ var IconAndTitleLayout = exports.IconAndTitleLayout = /*#__PURE__*/function (_Re
       if (defaultIcon) {
         return /*#__PURE__*/_react.default.createElement(_styled.IconWrapper, null, defaultIcon);
       }
-      return /*#__PURE__*/_react.default.createElement(_styled.IconWrapper, null, /*#__PURE__*/_react.default.createElement(_link.default, {
+      return (0, _platformFeatureFlags.fg)('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/_react.default.createElement(_styled.IconWrapperResized, {
+        "data-testid": "".concat(testId, "-default")
+      }, /*#__PURE__*/_react.default.createElement(_link.default, {
+        label: "link",
+        LEGACY_size: "small",
+        testId: "".concat(testId, "-default"),
+        color: "currentColor"
+      })) : /*#__PURE__*/_react.default.createElement(_styled.IconWrapper, null, /*#__PURE__*/_react.default.createElement(_link.default, {
         label: "link",
         LEGACY_size: "small",
         testId: "".concat(testId, "-default"),
@@ -128,7 +143,12 @@ var IconAndTitleLayout = exports.IconAndTitleLayout = /*#__PURE__*/function (_Re
         rightSide = _this$props2.rightSide,
         _this$props2$testId = _this$props2.testId,
         testId = _this$props2$testId === void 0 ? 'inline-card-icon-and-title' : _this$props2$testId;
-      var titlePart = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styled.IconPositionWrapper, null, children || /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styled.IconEmptyWrapper, null), this.renderIcon(testId))), /*#__PURE__*/_react.default.createElement(_styled.TitleWrapper
+      var iconPart = (0, _platformFeatureFlags.fg)('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/_react.default.createElement(_styled.IconPositionWrapper, {
+        "data-testid": "icon-position-wrapper"
+      }, children || /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styled.IconEmptyWrapperResized, {
+        "data-testid": "icon-empty-wrapper"
+      }), this.renderIcon(testId))) : /*#__PURE__*/_react.default.createElement(_styled.IconPositionWrapper, null, children || /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styled.IconEmptyWrapper, null), this.renderIcon(testId)));
+      var titlePart = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, iconPart, /*#__PURE__*/_react.default.createElement(_styled.TitleWrapper
       // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       , {
         style: {

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

@@ -4,13 +4,16 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.TitleWrapperClassName = exports.TitleWrapper = exports.RightIconPositionWrapper = exports.LozengeWrapper = exports.IconWrapper = exports.IconTitleWrapper = exports.IconPositionWrapper = exports.IconOverrides = exports.IconObjectOverrides = exports.IconEmptyWrapper = exports.EmojiWrapper = void 0;
+exports.TitleWrapperClassName = exports.TitleWrapper = exports.RightIconPositionWrapper = exports.LozengeWrapper = exports.IconWrapperResized = exports.IconWrapper = exports.IconTitleWrapper = exports.IconPositionWrapper = exports.IconOverridesResized = exports.IconOverrides = exports.IconObjectOverridesResized = exports.IconObjectOverrides = exports.IconEmptyWrapperResized = exports.IconEmptyWrapper = exports.EmojiWrapperResized = exports.EmojiWrapper = void 0;
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
 // TODO: remove this override behaviour for @atlaskit/icon-object
+// Replace with IconObjectOverridesResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 var IconObjectOverrides = exports.IconObjectOverrides = "\n  & > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 3px;\n    left: 0;\n    line-height: 14px;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+
 // TODO: remove this override behaviour for @atlaskit/icon
+// Replace with IconOverridesResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 var IconOverrides = exports.IconOverrides = "\n\n  & > * > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
 
 // Wraps all icons represented in Inline Links. Icons have three sources/types:
@@ -19,6 +22,7 @@ var IconOverrides = exports.IconOverrides = "\n\n  & > * > span {\n    height: 1
 // - @atlaskit/icon-object: for object icons, e.g. repository, branch, etc.
 // NB: the first set of overrides style icons imported from @atlaskit/icon-object correctly.
 // NB: the second set of overrides style icons imported from @atlaskit/icon correctly.
+// Replace with IconWrapperResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var IconWrapper = exports.IconWrapper = _styled.default.span({
   userSelect: 'none'
@@ -28,7 +32,23 @@ IconOverrides,
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 IconObjectOverrides);
 
+// TODO: remove this override behaviour for @atlaskit/icon-object
+var IconObjectOverridesResized = exports.IconObjectOverridesResized = "\n  & > span {\n    height: 16px;\n    width: 16px;\n    position: absolute;\n    top: 3px;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+
+// TODO: remove this override behaviour for @atlaskit/icon
+var IconOverridesResized = exports.IconOverridesResized = "\n  & > * > span {\n    height: 16px;\n    width: 16px;\n    position: absolute;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var IconWrapperResized = exports.IconWrapperResized = _styled.default.span({
+  userSelect: 'none'
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconOverridesResized,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconObjectOverridesResized);
+
 // Wraps all emoji in Inline Links similar to icon
+// Replace with EmojiWrapperResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var EmojiWrapper = exports.EmojiWrapper = _styled.default.span({
   display: 'inline-block',
@@ -40,6 +60,17 @@ IconOverrides,
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 IconObjectOverrides);
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var EmojiWrapperResized = exports.EmojiWrapperResized = _styled.default.span({
+  display: 'inline-block',
+  marginRight: "var(--ds-space-025, 2px)",
+  userSelect: 'none'
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconOverridesResized,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconObjectOverridesResized);
+
 // The main 'wrapping' element, title of the content.
 // NB: `white-space` adds little whitespace before wrapping.
 // NB: `word-break` line breaks as soon as an overflow takes place.
@@ -76,6 +107,7 @@ var IconPositionWrapper = exports.IconPositionWrapper = _styled.default.span({
   display: 'inline-block'
 });
 
+// Replace with IconEmptyWrapperResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var IconEmptyWrapper = exports.IconEmptyWrapper = _styled.default.span({
   width: '14px',
@@ -84,6 +116,14 @@ var IconEmptyWrapper = exports.IconEmptyWrapper = _styled.default.span({
   opacity: 0
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var IconEmptyWrapperResized = exports.IconEmptyWrapperResized = _styled.default.span({
+  width: '16px',
+  height: '100%',
+  display: 'inline-block',
+  opacity: 0
+});
+
 // With emotion it's not possible to use reference to `TitleWrapper` as part of a selector,
 // To achieve same result we use classname instead.
 var TitleWrapperClassName = exports.TitleWrapperClassName = 'smart-link-title-wrapper';

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

@@ -17,7 +17,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId"],
   _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "27.12.3",
+  packageVersion: "27.13.1",
   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: "27.12.3"
+  packageVersion: "27.13.1"
 };
 export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

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

@@ -13,9 +13,11 @@ import Action from '../action';
 const getIconFF = () => {
   if (fg('platform.linking-platform.smart-card.hover-card-action-redesign')) {
     if (fg('platform.linking-platform.smart-card.action-icon-redesign')) {
+      // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20003
       return MediaServicesActualSizeIcon;
     }
   }
+  // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20003
   return VidFullScreenOnIcon;
 };
 const PreviewAction = ({
@@ -50,6 +52,7 @@ const PreviewAction = ({
     }
   }, [analytics, data, invoke, onClickCallback]);
   const isStackItem = props.as === 'stack-item';
+  // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20003
   const Icon = isStackItem ? MediaServicesActualSizeIcon : getIconFF();
   const tooltipMessage = isStackItem ? messages.preview_description : messages.preview_improved;
   return data ? /*#__PURE__*/React.createElement(Action, _extends({

package/dist/es2019/view/FlexibleCard/components/blocks/related-urls-block/resolved/related-url-list/index.js

@@ -1,7 +1,7 @@
 import React, { useCallback, useState } from 'react';
 import { useIntl } from 'react-intl-next';
-import ChevronDownIcon from '@atlaskit/icon/glyph/chevron-down';
-import ChevronUpIcon from '@atlaskit/icon/glyph/chevron-up';
+import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down';
+import ChevronUpIcon from '@atlaskit/icon/utility/migration/chevron-up';
 import { Inline, Pressable, Stack, xcss } from '@atlaskit/primitives';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
@@ -33,9 +33,11 @@ const RelatedUrlList = ({
     testId: `${testId}-expand-title`,
     backgroundColor: "color.background.neutral.subtle",
     "aria-expanded": !!isOpen,
-    padding: "space.0"
+    padding: "space.0",
+    paddingInlineEnd: "space.050"
   }, /*#__PURE__*/React.createElement(Inline, {
     alignBlock: "center",
+    space: "space.050",
     spread: "space-between"
   }, /*#__PURE__*/React.createElement(Text, {
     overrideCss: css({
@@ -45,8 +47,9 @@ const RelatedUrlList = ({
       descriptor: title
     }
   }), /*#__PURE__*/React.createElement(ChevronComponent, {
+    LEGACY_margin: "0 -4px",
     label: getFormattedMessageAsString(intl, title),
-    size: 'medium'
+    color: "currentColor"
   }))), isOpen && /*#__PURE__*/React.createElement(ResolvedResultsStack, {
     resolvedResults: resolvedResults,
     testId: testId,

package/dist/es2019/view/InlineCard/Icon.js

@@ -1,6 +1,7 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import styled from '@emotion/styled';
 import { Skeleton } from '@atlaskit/linking-common';
+import { fg } from '@atlaskit/platform-feature-flags';
 import React from 'react';
 
 // TODO: Figure out a more scalable/responsive solution
@@ -21,6 +22,19 @@ export const Icon = styled.img({
   transform: 'translate(-50%, -50%)'
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export const IconResized = styled.img({
+  height: '16px',
+  width: '16px',
+  marginRight: "var(--ds-space-050, 4px)",
+  borderRadius: '2px',
+  userSelect: 'none',
+  position: 'absolute',
+  top: '50%',
+  left: '50%',
+  transform: 'translate(-50%, -50%)'
+});
+
 // Used for 'untrue' icons which claim to be 16x16 but
 // are less than that in height/width.
 // TODO: Replace this override with proper AtlasKit solution.
@@ -41,8 +55,8 @@ export const Shimmer = ({
     marginRight: "var(--ds-space-050, 4px)"
   };
   return /*#__PURE__*/React.createElement(Skeleton, {
-    width: 14,
-    height: 14,
+    width: fg('linking-platform-increase-inline-card-icon-size') ? 16 : 14,
+    height: fg('linking-platform-increase-inline-card-icon-size') ? 16 : 14,
     borderRadius: 2,
     testId: testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766

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

@@ -1,10 +1,11 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import ImageLoader from 'react-render-image';
-import { Icon, Shimmer } from '../Icon';
-import { IconEmptyWrapper, IconPositionWrapper, IconTitleWrapper, IconWrapper, TitleWrapper, EmojiWrapper, TitleWrapperClassName } from './styled';
+import { Icon, IconResized, Shimmer } from '../Icon';
+import { IconEmptyWrapper, IconPositionWrapper, IconTitleWrapper, IconWrapper, TitleWrapper, EmojiWrapper, TitleWrapperClassName, IconEmptyWrapperResized, IconWrapperResized, EmojiWrapperResized } from './styled';
 import LinkIcon from '@atlaskit/icon/core/migration/link';
 import { LinkAppearance, NoLinkAppearance } from '../styled';
+import { fg } from '@atlaskit/platform-feature-flags';
 export class IconAndTitleLayout extends React.Component {
   constructor(...args) {
     super(...args);
@@ -38,12 +39,12 @@ export class IconAndTitleLayout extends React.Component {
       emoji
     } = this.props;
     if (emoji) {
-      return /*#__PURE__*/React.createElement(EmojiWrapper, null, emoji);
+      return fg('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/React.createElement(EmojiWrapperResized, null, emoji) : /*#__PURE__*/React.createElement(EmojiWrapper, null, emoji);
     }
     if (!icon || typeof icon === 'string') {
       return null;
     }
-    return /*#__PURE__*/React.createElement(IconWrapper, null, icon);
+    return fg('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/React.createElement(IconWrapperResized, null, icon) : /*#__PURE__*/React.createElement(IconWrapper, null, icon);
   }
   renderImageIcon(errored, testId) {
     const {
@@ -52,15 +53,22 @@ export class IconAndTitleLayout extends React.Component {
     if (!url || typeof url !== 'string') {
       return null;
     }
+    const icon = fg('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/React.createElement(IconResized
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+    , {
+      className: "smart-link-icon",
+      src: url,
+      "data-testid": `${testId}-image`
+    }) : /*#__PURE__*/React.createElement(Icon
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+    , {
+      className: "smart-link-icon",
+      src: url,
+      "data-testid": `${testId}-image`
+    });
     return /*#__PURE__*/React.createElement(ImageLoader, {
       src: url,
-      loaded: /*#__PURE__*/React.createElement(Icon
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-      , {
-        className: "smart-link-icon",
-        src: url,
-        "data-testid": `${testId}-image`
-      }),
+      loaded: icon,
       errored: errored,
       loading: /*#__PURE__*/React.createElement(Shimmer, {
         testId: `${testId}-loading`
@@ -74,7 +82,14 @@ export class IconAndTitleLayout extends React.Component {
     if (defaultIcon) {
       return /*#__PURE__*/React.createElement(IconWrapper, null, defaultIcon);
     }
-    return /*#__PURE__*/React.createElement(IconWrapper, null, /*#__PURE__*/React.createElement(LinkIcon, {
+    return fg('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/React.createElement(IconWrapperResized, {
+      "data-testid": `${testId}-default`
+    }, /*#__PURE__*/React.createElement(LinkIcon, {
+      label: "link",
+      LEGACY_size: "small",
+      testId: `${testId}-default`,
+      color: "currentColor"
+    })) : /*#__PURE__*/React.createElement(IconWrapper, null, /*#__PURE__*/React.createElement(LinkIcon, {
       label: "link",
       LEGACY_size: "small",
       testId: `${testId}-default`,
@@ -104,7 +119,12 @@ export class IconAndTitleLayout extends React.Component {
       rightSide,
       testId = 'inline-card-icon-and-title'
     } = this.props;
-    const titlePart = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconPositionWrapper, null, children || /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconEmptyWrapper, null), this.renderIcon(testId))), /*#__PURE__*/React.createElement(TitleWrapper
+    const iconPart = fg('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/React.createElement(IconPositionWrapper, {
+      "data-testid": "icon-position-wrapper"
+    }, children || /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconEmptyWrapperResized, {
+      "data-testid": "icon-empty-wrapper"
+    }), this.renderIcon(testId))) : /*#__PURE__*/React.createElement(IconPositionWrapper, null, children || /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconEmptyWrapper, null), this.renderIcon(testId)));
+    const titlePart = /*#__PURE__*/React.createElement(React.Fragment, null, iconPart, /*#__PURE__*/React.createElement(TitleWrapper
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
     , {
       style: {

package/dist/es2019/view/InlineCard/IconAndTitleLayout/styled.js

@@ -1,6 +1,7 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import styled from '@emotion/styled';
 // TODO: remove this override behaviour for @atlaskit/icon-object
+// Replace with IconObjectOverridesResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 export const IconObjectOverrides = `
   & > span {
     height: 16px;
@@ -17,7 +18,9 @@ export const IconObjectOverrides = `
     }
   }
 `;
+
 // TODO: remove this override behaviour for @atlaskit/icon
+// Replace with IconOverridesResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 export const IconOverrides = `
 
   & > * > span {
@@ -40,6 +43,7 @@ export const IconOverrides = `
 // - @atlaskit/icon-object: for object icons, e.g. repository, branch, etc.
 // NB: the first set of overrides style icons imported from @atlaskit/icon-object correctly.
 // NB: the second set of overrides style icons imported from @atlaskit/icon correctly.
+// Replace with IconWrapperResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export const IconWrapper = styled.span({
   userSelect: 'none'
@@ -49,7 +53,50 @@ IconOverrides,
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 IconObjectOverrides);
 
+// TODO: remove this override behaviour for @atlaskit/icon-object
+export const IconObjectOverridesResized = `
+  & > span {
+    height: 16px;
+    width: 16px;
+    position: absolute;
+    top: 3px;
+    left: 0;
+    & > svg {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+    }
+  }
+`;
+
+// TODO: remove this override behaviour for @atlaskit/icon
+export const IconOverridesResized = `
+  & > * > span {
+    height: 16px;
+    width: 16px;
+    position: absolute;
+    left: 0;
+    & > svg {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+    }
+  }
+`;
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export const IconWrapperResized = styled.span({
+  userSelect: 'none'
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconOverridesResized,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconObjectOverridesResized);
+
 // Wraps all emoji in Inline Links similar to icon
+// Replace with EmojiWrapperResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export const EmojiWrapper = styled.span({
   display: 'inline-block',
@@ -61,6 +108,17 @@ IconOverrides,
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 IconObjectOverrides);
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export const EmojiWrapperResized = styled.span({
+  display: 'inline-block',
+  marginRight: "var(--ds-space-025, 2px)",
+  userSelect: 'none'
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconOverridesResized,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconObjectOverridesResized);
+
 // The main 'wrapping' element, title of the content.
 // NB: `white-space` adds little whitespace before wrapping.
 // NB: `word-break` line breaks as soon as an overflow takes place.
@@ -97,6 +155,7 @@ export const IconPositionWrapper = styled.span({
   display: 'inline-block'
 });
 
+// Replace with IconEmptyWrapperResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export const IconEmptyWrapper = styled.span({
   width: '14px',
@@ -105,6 +164,14 @@ export const IconEmptyWrapper = styled.span({
   opacity: 0
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export const IconEmptyWrapperResized = styled.span({
+  width: '16px',
+  height: '100%',
+  display: 'inline-block',
+  opacity: 0
+});
+
 // With emotion it's not possible to use reference to `TitleWrapper` as part of a selector,
 // To achieve same result we use classname instead.
 export const TitleWrapperClassName = 'smart-link-title-wrapper';

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

@@ -7,7 +7,7 @@ import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-m
 import LinkWarningModal from './LinkWarningModal';
 const PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "27.12.3",
+  packageVersion: "27.13.1",
   componentName: 'linkUrl'
 };
 const Link = withLinkClickedEvent('a');

package/dist/esm/utils/analytics/analytics.js

@@ -15,7 +15,7 @@ export var ANALYTICS_CHANNEL = 'media';
 export var context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "27.12.3"
+  packageVersion: "27.13.1"
 };
 export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

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

@@ -20,9 +20,11 @@ import Action from '../action';
 var getIconFF = function getIconFF() {
   if (fg('platform.linking-platform.smart-card.hover-card-action-redesign')) {
     if (fg('platform.linking-platform.smart-card.action-icon-redesign')) {
+      // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20003
       return MediaServicesActualSizeIcon;
     }
   }
+  // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20003
   return VidFullScreenOnIcon;
 };
 var PreviewAction = function PreviewAction(_ref) {
@@ -71,6 +73,7 @@ var PreviewAction = function PreviewAction(_ref) {
     }
   }, [analytics, data, invoke, onClickCallback]);
   var isStackItem = props.as === 'stack-item';
+  // eslint-disable-next-line @atlaskit/design-system/no-legacy-icons -- TODO - https://product-fabric.atlassian.net/browse/DSP-20003
   var Icon = isStackItem ? MediaServicesActualSizeIcon : getIconFF();
   var tooltipMessage = isStackItem ? messages.preview_description : messages.preview_improved;
   return data ? /*#__PURE__*/React.createElement(Action, _extends({

package/dist/esm/view/FlexibleCard/components/blocks/related-urls-block/resolved/related-url-list/index.js

@@ -1,8 +1,8 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { useCallback, useState } from 'react';
 import { useIntl } from 'react-intl-next';
-import ChevronDownIcon from '@atlaskit/icon/glyph/chevron-down';
-import ChevronUpIcon from '@atlaskit/icon/glyph/chevron-up';
+import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down';
+import ChevronUpIcon from '@atlaskit/icon/utility/migration/chevron-up';
 import { Inline, Pressable, Stack, xcss } from '@atlaskit/primitives';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css } from '@emotion/react';
@@ -38,9 +38,11 @@ var RelatedUrlList = function RelatedUrlList(_ref) {
     testId: "".concat(testId, "-expand-title"),
     backgroundColor: "color.background.neutral.subtle",
     "aria-expanded": !!isOpen,
-    padding: "space.0"
+    padding: "space.0",
+    paddingInlineEnd: "space.050"
   }, /*#__PURE__*/React.createElement(Inline, {
     alignBlock: "center",
+    space: "space.050",
     spread: "space-between"
   }, /*#__PURE__*/React.createElement(Text, {
     overrideCss: css({
@@ -50,8 +52,9 @@ var RelatedUrlList = function RelatedUrlList(_ref) {
       descriptor: title
     }
   }), /*#__PURE__*/React.createElement(ChevronComponent, {
+    LEGACY_margin: "0 -4px",
     label: getFormattedMessageAsString(intl, title),
-    size: 'medium'
+    color: "currentColor"
   }))), isOpen && /*#__PURE__*/React.createElement(ResolvedResultsStack, {
     resolvedResults: resolvedResults,
     testId: testId,

package/dist/esm/view/InlineCard/Icon.js

@@ -1,6 +1,7 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import styled from '@emotion/styled';
 import { Skeleton } from '@atlaskit/linking-common';
+import { fg } from '@atlaskit/platform-feature-flags';
 import React from 'react';
 
 // TODO: Figure out a more scalable/responsive solution
@@ -21,6 +22,19 @@ export var Icon = styled.img({
   transform: 'translate(-50%, -50%)'
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export var IconResized = styled.img({
+  height: '16px',
+  width: '16px',
+  marginRight: "var(--ds-space-050, 4px)",
+  borderRadius: '2px',
+  userSelect: 'none',
+  position: 'absolute',
+  top: '50%',
+  left: '50%',
+  transform: 'translate(-50%, -50%)'
+});
+
 // Used for 'untrue' icons which claim to be 16x16 but
 // are less than that in height/width.
 // TODO: Replace this override with proper AtlasKit solution.
@@ -40,8 +54,8 @@ export var Shimmer = function Shimmer(_ref) {
     marginRight: "var(--ds-space-050, 4px)"
   };
   return /*#__PURE__*/React.createElement(Skeleton, {
-    width: 14,
-    height: 14,
+    width: fg('linking-platform-increase-inline-card-icon-size') ? 16 : 14,
+    height: fg('linking-platform-increase-inline-card-icon-size') ? 16 : 14,
     borderRadius: 2,
     testId: testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766

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

@@ -9,10 +9,11 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import React from 'react';
 import ImageLoader from 'react-render-image';
-import { Icon, Shimmer } from '../Icon';
-import { IconEmptyWrapper, IconPositionWrapper, IconTitleWrapper, IconWrapper, TitleWrapper, EmojiWrapper, TitleWrapperClassName } from './styled';
+import { Icon, IconResized, Shimmer } from '../Icon';
+import { IconEmptyWrapper, IconPositionWrapper, IconTitleWrapper, IconWrapper, TitleWrapper, EmojiWrapper, TitleWrapperClassName, IconEmptyWrapperResized, IconWrapperResized, EmojiWrapperResized } from './styled';
 import LinkIcon from '@atlaskit/icon/core/migration/link';
 import { LinkAppearance, NoLinkAppearance } from '../styled';
+import { fg } from '@atlaskit/platform-feature-flags';
 export var IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
   _inherits(IconAndTitleLayout, _React$Component);
   var _super = _createSuper(IconAndTitleLayout);
@@ -51,12 +52,12 @@ export var IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
         icon = _this$props.icon,
         emoji = _this$props.emoji;
       if (emoji) {
-        return /*#__PURE__*/React.createElement(EmojiWrapper, null, emoji);
+        return fg('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/React.createElement(EmojiWrapperResized, null, emoji) : /*#__PURE__*/React.createElement(EmojiWrapper, null, emoji);
       }
       if (!icon || typeof icon === 'string') {
         return null;
       }
-      return /*#__PURE__*/React.createElement(IconWrapper, null, icon);
+      return fg('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/React.createElement(IconWrapperResized, null, icon) : /*#__PURE__*/React.createElement(IconWrapper, null, icon);
     }
   }, {
     key: "renderImageIcon",
@@ -65,15 +66,22 @@ export var IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
       if (!url || typeof url !== 'string') {
         return null;
       }
+      var icon = fg('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/React.createElement(IconResized
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      , {
+        className: "smart-link-icon",
+        src: url,
+        "data-testid": "".concat(testId, "-image")
+      }) : /*#__PURE__*/React.createElement(Icon
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
+      , {
+        className: "smart-link-icon",
+        src: url,
+        "data-testid": "".concat(testId, "-image")
+      });
       return /*#__PURE__*/React.createElement(ImageLoader, {
         src: url,
-        loaded: /*#__PURE__*/React.createElement(Icon
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-        , {
-          className: "smart-link-icon",
-          src: url,
-          "data-testid": "".concat(testId, "-image")
-        }),
+        loaded: icon,
         errored: errored,
         loading: /*#__PURE__*/React.createElement(Shimmer, {
           testId: "".concat(testId, "-loading")
@@ -87,7 +95,14 @@ export var IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
       if (defaultIcon) {
         return /*#__PURE__*/React.createElement(IconWrapper, null, defaultIcon);
       }
-      return /*#__PURE__*/React.createElement(IconWrapper, null, /*#__PURE__*/React.createElement(LinkIcon, {
+      return fg('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/React.createElement(IconWrapperResized, {
+        "data-testid": "".concat(testId, "-default")
+      }, /*#__PURE__*/React.createElement(LinkIcon, {
+        label: "link",
+        LEGACY_size: "small",
+        testId: "".concat(testId, "-default"),
+        color: "currentColor"
+      })) : /*#__PURE__*/React.createElement(IconWrapper, null, /*#__PURE__*/React.createElement(LinkIcon, {
         label: "link",
         LEGACY_size: "small",
         testId: "".concat(testId, "-default"),
@@ -121,7 +136,12 @@ export var IconAndTitleLayout = /*#__PURE__*/function (_React$Component) {
         rightSide = _this$props2.rightSide,
         _this$props2$testId = _this$props2.testId,
         testId = _this$props2$testId === void 0 ? 'inline-card-icon-and-title' : _this$props2$testId;
-      var titlePart = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconPositionWrapper, null, children || /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconEmptyWrapper, null), this.renderIcon(testId))), /*#__PURE__*/React.createElement(TitleWrapper
+      var iconPart = fg('linking-platform-increase-inline-card-icon-size') ? /*#__PURE__*/React.createElement(IconPositionWrapper, {
+        "data-testid": "icon-position-wrapper"
+      }, children || /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconEmptyWrapperResized, {
+        "data-testid": "icon-empty-wrapper"
+      }), this.renderIcon(testId))) : /*#__PURE__*/React.createElement(IconPositionWrapper, null, children || /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconEmptyWrapper, null), this.renderIcon(testId)));
+      var titlePart = /*#__PURE__*/React.createElement(React.Fragment, null, iconPart, /*#__PURE__*/React.createElement(TitleWrapper
       // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       , {
         style: {

package/dist/esm/view/InlineCard/IconAndTitleLayout/styled.js

@@ -1,8 +1,11 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import styled from '@emotion/styled';
 // TODO: remove this override behaviour for @atlaskit/icon-object
+// Replace with IconObjectOverridesResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 export var IconObjectOverrides = "\n  & > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    top: 3px;\n    left: 0;\n    line-height: 14px;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+
 // TODO: remove this override behaviour for @atlaskit/icon
+// Replace with IconOverridesResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 export var IconOverrides = "\n\n  & > * > span {\n    height: 16px;\n    width: 14px;\n    position: absolute;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
 
 // Wraps all icons represented in Inline Links. Icons have three sources/types:
@@ -11,6 +14,7 @@ export var IconOverrides = "\n\n  & > * > span {\n    height: 16px;\n    width:
 // - @atlaskit/icon-object: for object icons, e.g. repository, branch, etc.
 // NB: the first set of overrides style icons imported from @atlaskit/icon-object correctly.
 // NB: the second set of overrides style icons imported from @atlaskit/icon correctly.
+// Replace with IconWrapperResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export var IconWrapper = styled.span({
   userSelect: 'none'
@@ -20,7 +24,23 @@ IconOverrides,
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 IconObjectOverrides);
 
+// TODO: remove this override behaviour for @atlaskit/icon-object
+export var IconObjectOverridesResized = "\n  & > span {\n    height: 16px;\n    width: 16px;\n    position: absolute;\n    top: 3px;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+
+// TODO: remove this override behaviour for @atlaskit/icon
+export var IconOverridesResized = "\n  & > * > span {\n    height: 16px;\n    width: 16px;\n    position: absolute;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export var IconWrapperResized = styled.span({
+  userSelect: 'none'
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconOverridesResized,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconObjectOverridesResized);
+
 // Wraps all emoji in Inline Links similar to icon
+// Replace with EmojiWrapperResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export var EmojiWrapper = styled.span({
   display: 'inline-block',
@@ -32,6 +52,17 @@ IconOverrides,
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 IconObjectOverrides);
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export var EmojiWrapperResized = styled.span({
+  display: 'inline-block',
+  marginRight: "var(--ds-space-025, 2px)",
+  userSelect: 'none'
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconOverridesResized,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+IconObjectOverridesResized);
+
 // The main 'wrapping' element, title of the content.
 // NB: `white-space` adds little whitespace before wrapping.
 // NB: `word-break` line breaks as soon as an overflow takes place.
@@ -68,6 +99,7 @@ export var IconPositionWrapper = styled.span({
   display: 'inline-block'
 });
 
+// Replace with IconEmptyWrapperResized during linking-platform-increase-inline-card-icon-size cleanup (EDM=10529)
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export var IconEmptyWrapper = styled.span({
   width: '14px',
@@ -76,6 +108,14 @@ export var IconEmptyWrapper = styled.span({
   opacity: 0
 });
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export var IconEmptyWrapperResized = styled.span({
+  width: '16px',
+  height: '100%',
+  display: 'inline-block',
+  opacity: 0
+});
+
 // With emotion it's not possible to use reference to `TitleWrapper` as part of a selector,
 // To achieve same result we use classname instead.
 export var TitleWrapperClassName = 'smart-link-title-wrapper';

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

@@ -10,7 +10,7 @@ import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-m
 import LinkWarningModal from './LinkWarningModal';
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "27.12.3",
+  packageVersion: "27.13.1",
   componentName: 'linkUrl'
 };
 var Link = withLinkClickedEvent('a');

package/dist/types/view/InlineCard/Icon.d.ts

@@ -3,6 +3,10 @@ export declare const Icon: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: React.ElementType<any> | undefined;
 }, React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+export declare const IconResized: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: React.ElementType<any> | undefined;
+}, React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
 export declare const AKIconWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: React.ElementType<any> | undefined;

package/dist/types/view/InlineCard/IconAndTitleLayout/styled.d.ts

@@ -5,10 +5,20 @@ export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const IconObjectOverridesResized = "\n  & > span {\n    height: 16px;\n    width: 16px;\n    position: absolute;\n    top: 3px;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+export declare const IconOverridesResized = "\n  & > * > span {\n    height: 16px;\n    width: 16px;\n    position: absolute;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+export declare const IconWrapperResized: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const EmojiWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const EmojiWrapperResized: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const IconTitleWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
@@ -29,6 +39,10 @@ export declare const IconEmptyWrapper: import("@emotion/styled").StyledComponent
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const IconEmptyWrapperResized: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const TitleWrapperClassName = "smart-link-title-wrapper";
 export declare const TitleWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;

package/dist/types-ts4.5/view/InlineCard/Icon.d.ts

@@ -3,6 +3,10 @@ export declare const Icon: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: React.ElementType<any> | undefined;
 }, React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+export declare const IconResized: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: React.ElementType<any> | undefined;
+}, React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
 export declare const AKIconWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: React.ElementType<any> | undefined;

package/dist/types-ts4.5/view/InlineCard/IconAndTitleLayout/styled.d.ts

@@ -5,10 +5,20 @@ export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const IconObjectOverridesResized = "\n  & > span {\n    height: 16px;\n    width: 16px;\n    position: absolute;\n    top: 3px;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+export declare const IconOverridesResized = "\n  & > * > span {\n    height: 16px;\n    width: 16px;\n    position: absolute;\n    left: 0;\n    & > svg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n    }\n  }\n";
+export declare const IconWrapperResized: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const EmojiWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const EmojiWrapperResized: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const IconTitleWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
@@ -29,6 +39,10 @@ export declare const IconEmptyWrapper: import("@emotion/styled").StyledComponent
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const IconEmptyWrapperResized: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const TitleWrapperClassName = "smart-link-title-wrapper";
 export declare const TitleWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "27.12.3",
+	"version": "27.13.1",
 	"description": "Smart card component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -30,12 +30,12 @@
 	},
 	"dependencies": {
 		"@atlaskit/analytics-gas-types": "^5.1.0",
-		"@atlaskit/analytics-next": "^9.3.0",
+		"@atlaskit/analytics-next": "^10.0.0",
 		"@atlaskit/avatar": "^21.12.0",
 		"@atlaskit/avatar-group": "^9.9.0",
 		"@atlaskit/badge": "^16.3.0",
 		"@atlaskit/button": "^19.1.0",
-		"@atlaskit/checkbox": "^13.5.0",
+		"@atlaskit/checkbox": "^13.6.0",
 		"@atlaskit/dropdown-menu": "^12.15.0",
 		"@atlaskit/form": "^10.4.0",
 		"@atlaskit/frontend-utilities": "^2.7.0",
@@ -44,11 +44,11 @@
 		"@atlaskit/icon-file-type": "^6.4.0",
 		"@atlaskit/icon-object": "^6.4.0",
 		"@atlaskit/icon-priority": "^6.3.0",
-		"@atlaskit/link-analytics": "^8.3.0",
-		"@atlaskit/link-client-extension": "^1.12.0",
-		"@atlaskit/link-extractors": "^1.5.0",
-		"@atlaskit/linking-common": "^5.8.0",
-		"@atlaskit/linking-types": "^8.12.0",
+		"@atlaskit/link-analytics": "^8.4.0",
+		"@atlaskit/link-client-extension": "^1.13.0",
+		"@atlaskit/link-extractors": "^1.6.0",
+		"@atlaskit/linking-common": "^5.9.0",
+		"@atlaskit/linking-types": "^8.13.0",
 		"@atlaskit/logo": "^14.1.0",
 		"@atlaskit/lozenge": "^11.9.0",
 		"@atlaskit/menu": "^2.9.0",
@@ -93,7 +93,7 @@
 		"@af/visual-regression": "*",
 		"@atlaskit/analytics-listeners": "^8.10.0",
 		"@atlaskit/css-reset": "^6.9.0",
-		"@atlaskit/link-test-helpers": "^7.1.0",
+		"@atlaskit/link-test-helpers": "^7.2.0",
 		"@atlaskit/media-test-helpers": "^34.0.0",
 		"@atlaskit/ssr": "*",
 		"@atlaskit/visual-regression": "*",
@@ -183,6 +183,9 @@
 		},
 		"platform.linking-platform.smart-card.enable-view-related-urls-action": {
 			"type": "boolean"
+		},
+		"linking-platform-increase-inline-card-icon-size": {
+			"type": "boolean"
 		}
 	}
 }