@atlaskit/smart-card 34.10.1 → 34.10.3

package/dist/esm/extractors/common/icon/extractIconFromDocument.js

@@ -1,14 +1,69 @@
 import React from 'react';
-import DocumentIcon from '@atlaskit/icon-file-type/glyph/document/16';
-import FileIcon from '@atlaskit/icon-file-type/glyph/generic/16';
-import PresentationIcon from '@atlaskit/icon-file-type/glyph/presentation/16';
-import SpreadsheetIcon from '@atlaskit/icon-file-type/glyph/spreadsheet/16';
+import DocumentIconOld from '@atlaskit/icon-file-type/glyph/document/16';
+import FileIconOld from '@atlaskit/icon-file-type/glyph/generic/16';
+import PresentationIconOld from '@atlaskit/icon-file-type/glyph/presentation/16';
+import SpreadsheetIconOld from '@atlaskit/icon-file-type/glyph/spreadsheet/16';
 import LiveDocumentIcon from '@atlaskit/icon-lab/core/page-live-doc';
-import BlogIcon from '@atlaskit/icon-object/glyph/blog/16';
-import DocumentFilledIcon from '@atlaskit/icon/core/migration/page--document-filled';
+import BlogIconOld from '@atlaskit/icon-object/glyph/blog/16';
+import DocumentFilledIconNew from '@atlaskit/icon/core/migration/file--document-filled';
+import DocumentFilledIconOld from '@atlaskit/icon/core/migration/page--document-filled';
 import { isConfluenceGenerator } from '@atlaskit/link-extractors';
+import { fg } from '@atlaskit/platform-feature-flags';
+import BlogIconNew from '../../../common/ui/icons/blog-icon';
+import PresentationIconNew from '../../../common/ui/icons/chart-bar-icon';
+import FileIconNew from '../../../common/ui/icons/file-icon';
+import SpreadsheetIconNew from '../../../common/ui/icons/list-bullet-icon';
+import DocumentIconNew from '../../../common/ui/icons/page-icon';
 import { getIconForFileType } from '../../../utils';
 import { prioritiseIcon } from './prioritiseIcon';
+
+// TODO Delete this and rename BlogIconNew to BlogIcon when cleaning platform-smart-card-icon-migration
+var BlogIcon = function BlogIcon(props) {
+  if (fg('platform-smart-card-icon-migration')) {
+    return /*#__PURE__*/React.createElement(BlogIconNew, props);
+  }
+  return /*#__PURE__*/React.createElement(BlogIconOld, props);
+};
+
+// TODO Delete this and rename FileIconNew to FileIcon when cleaning platform-smart-card-icon-migration
+var FileIcon = function FileIcon(props) {
+  if (fg('platform-smart-card-icon-migration')) {
+    return /*#__PURE__*/React.createElement(FileIconNew, props);
+  }
+  return /*#__PURE__*/React.createElement(FileIconOld, props);
+};
+
+// TODO Delete this and rename DocumentIconNew to DocumentIcon when cleaning platform-smart-card-icon-migration
+var DocumentIcon = function DocumentIcon(props) {
+  if (fg('platform-smart-card-icon-migration')) {
+    return /*#__PURE__*/React.createElement(DocumentIconNew, props);
+  }
+  return /*#__PURE__*/React.createElement(DocumentIconOld, props);
+};
+
+// TODO Delete this and rename PresentationIconNew to PresentationIcon when cleaning platform-smart-card-icon-migration
+var PresentationIcon = function PresentationIcon(props) {
+  if (fg('platform-smart-card-icon-migration')) {
+    return /*#__PURE__*/React.createElement(PresentationIconNew, props);
+  }
+  return /*#__PURE__*/React.createElement(PresentationIconOld, props);
+};
+
+// TODO Delete this and rename SpreadsheetIconNew to SpreadsheetIcon when cleaning platform-smart-card-icon-migration
+var SpreadsheetIcon = function SpreadsheetIcon(props) {
+  if (fg('platform-smart-card-icon-migration')) {
+    return /*#__PURE__*/React.createElement(SpreadsheetIconNew, props);
+  }
+  return /*#__PURE__*/React.createElement(SpreadsheetIconOld, props);
+};
+
+// TODO Delete this and rename DocumentFilledIconNew to DocumentFilledIcon when cleaning platform-smart-card-icon-migration
+var DocumentFilledIcon = function DocumentFilledIcon(props) {
+  if (fg('platform-smart-card-icon-migration')) {
+    return /*#__PURE__*/React.createElement(DocumentFilledIconNew, props);
+  }
+  return /*#__PURE__*/React.createElement(DocumentFilledIconOld, props);
+};
 /**
  * Extracts an icon for a document pbject
  *

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

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

package/dist/esm/view/FlexibleCard/components/actions/action/action-icon/index.compiled.css

@@ -6,6 +6,7 @@
 ._1bsb1j6v{width:1rem}
 ._1bsb1k8s{width:1.5rem}
 ._1bsbgktf{width:20px}
+._1e0c116y{display:inline-flex}
 ._1e0c1o8l{display:inline-block}
 ._1o9zidpf{flex-shrink:0}
 ._1rg21j6v img, ._q7cv1j6v span, ._xwbj1j6v svg{min-width:1rem}

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

@@ -21,8 +21,11 @@ var iconSizeStyleMap = {
   '1rem': "_16jlidpf _1o9zidpf _i0dl1wug _4t3i1j6v _1tke1j6v _c71l1j6v _1bsb1j6v _1ul91j6v _p12f1j6v _i2i3idpf _uhasidpf _5jw9idpf _7wy9idpf _bna71j6v _1xjx1j6v _17521j6v _qci81j6v _15iz1j6v _erub1j6v _19l31j6v _1pr21j6v _1u5t1j6v _mezj1j6v _e2oo1j6v _w8l51j6v _1rg21j6v _q7cv1j6v _xwbj1j6v _rtys1j6v _b8nk1j6v _4x201j6v",
   '20px': "_16jlidpf _1o9zidpf _i0dl1wug _4t3igktf _1tkegktf _c71lgktf _1bsbgktf _1ul9gktf _p12fgktf _i2i3idpf _uhasidpf _5jw9idpf _7wy9idpf _bna7gktf _1xjxgktf _1752gktf _qci8gktf _15izgktf _erubgktf _19l3gktf _1pr2gktf _1u5tgktf _mezjgktf _e2oogktf _w8l5gktf _1rg2gktf _q7cvgktf _xwbjgktf _rtysgktf _b8nkgktf _4x20gktf"
 };
+
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var stackItemIconStylesOld = null;
+var stackItemIconStylesCompiled = null;
 var stackItemIconStyles = null;
-var newStackItemIconStyles = null;
 var iconStyleMap = {
   true: "_syaz2oi6",
   false: "_syazwdcn"
@@ -41,7 +44,7 @@ var ActionIconNew = function ActionIconNew(_ref) {
   }
   return /*#__PURE__*/React.createElement("span", {
     "data-testid": "".concat(testId, "-icon"),
-    className: ax([iconStyleMap[isDisabled ? 'true' : 'false'], "_1e0c1o8l"])
+    className: ax([iconStyleMap[isDisabled ? 'true' : 'false'], fg('platform-linking-visual-refresh-v1') ? "_1e0c116y" : "_1e0c1o8l"])
   }, icon);
 };
 var ActionIcon = function ActionIcon(props) {

package/dist/esm/view/FlexibleCard/components/actions/action/action-stack-item/action-button.compiled.css

@@ -1,5 +1,6 @@
 
-._kkk2n7od{all:unset}._11c8qk37{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
+._kkk2n7od{all:unset}._11c81vlj{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
+._11c8qk37{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
 ._19bv1b66{padding-left:var(--ds-space-050,4px)}
 ._1bsb1osq{width:100%}
 ._ca0q1b66{padding-top:var(--ds-space-050,4px)}

package/dist/esm/view/FlexibleCard/components/actions/action/action-stack-item/action-button.js

@@ -14,6 +14,9 @@ var styles = {
   button: "_kkk2n7od _ca0q1b66 _u5f31b66 _n3td1b66 _19bv1b66 _1bsb1osq _irr3166n _1di61dty",
   content: "_11c8qk37 _syaz1fxt"
 };
+var contentStyles = {
+  content: "_11c81vlj _syaz1fxt"
+};
 var ActionButtonNew = function ActionButtonNew(_ref) {
   var content = _ref.content,
     iconOption = _ref.icon,
@@ -51,7 +54,7 @@ var ActionButtonNew = function ActionButtonNew(_ref) {
     grow: "fill",
     space: space
   }, icon, /*#__PURE__*/React.createElement(Box, {
-    xcss: styles.content
+    xcss: fg('platform-linking-visual-refresh-v1') ? contentStyles.content : styles.content
   }, content)));
 };
 var ActionButton = function ActionButton(props) {

package/dist/esm/view/FlexibleCard/components/blocks/action-block/index.compiled.css

@@ -1,5 +1,6 @@
 ._16jlkb7n{flex-grow:1}
 ._18u01ivi{margin-left:calc(var(--container-gap-left)*-1)}
+._1bsb129b{width:calc(100% + var(--container-gap-left) + var(--container-gap-right))}
 ._1bsb1osq{width:100%}
 ._1e0c1txw{display:flex}
 ._2hwxc10g{margin-right:calc(var(--container-gap-right)*-1)}

package/dist/esm/view/FlexibleCard/components/blocks/action-block/index.js

@@ -11,6 +11,8 @@ import { useFlexibleUiContext, useFlexibleUiOptionContext } from '../../../../..
 import * as Actions from '../../actions';
 import { ActionFooter } from './action-footer';
 import ActionBlockOld from './ActionBlockOld';
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var ignoreContainerPaddingStylesOld = null;
 var ignoreContainerPaddingStyles = null;
 var DEFAULT_SORT_ORDER = ['PreviewAction', 'CopyLinkAction', 'AISummaryAction'];
 var sort = function sort(a, b) {
@@ -100,7 +102,7 @@ var ActionBlockNew = function ActionBlockNew(_ref) {
   return actions ? /*#__PURE__*/React.createElement("div", {
     ref: blockRef,
     "data-testid": testId,
-    className: ax(["_1e0c1txw _2lx21bp4 _vchhusvi _16jlkb7n _1bsb1osq _18u01ivi _2hwxc10g"])
+    className: ax([fg('platform-linking-visual-refresh-v1') ? "_1e0c1txw _2lx21bp4 _vchhusvi _16jlkb7n _1bsb129b _18u01ivi _2hwxc10g" : "_1e0c1txw _2lx21bp4 _vchhusvi _16jlkb7n _1bsb1osq _18u01ivi _2hwxc10g"])
   }, actions, /*#__PURE__*/React.createElement(ActionFooter, {
     message: message,
     testId: testId

package/dist/esm/view/FlexibleCard/components/blocks/element-group/index.compiled.css

@@ -1,8 +1,12 @@
 
 ._zulp147b{gap:var(--ds-space-250,1.25rem)}
+._zulp1b66{gap:var(--ds-space-050,4px)}
 ._zulp1e9d{gap:var(--ds-space-200,1rem)}
 ._zulpcxkx{gap:var(--ds-space-100,.5rem)}
-._zulppdf9{gap:var(--ds-space-050,.25rem)}._16jlkb7n{flex-grow:1}
+._zulppdf9{gap:var(--ds-space-050,.25rem)}
+._zulppxbi{gap:var(--ds-space-200,1pc)}
+._zulpu2gc{gap:var(--ds-space-100,8px)}
+._zulpv47k{gap:var(--ds-space-250,20px)}._16jlkb7n{flex-grow:1}
 ._18m915vq{overflow-y:hidden}
 ._1aaynkob >div, ._15tynkob >span{vertical-align:middle}
 ._1bah1y6m{justify-content:flex-start}
@@ -44,6 +48,7 @@
 ._s7n4nkob{vertical-align:middle}
 ._sudp1e54{-webkit-box-orient:vertical}
 ._vwz41j6v{line-height:1rem}
+._vwz47vkz{line-height:1pc}
 ._y3gn1e5h{text-align:left}
 ._y3gnusic{text-align:right}
 @supports not (-webkit-line-clamp:1){._102k1k8s{max-height:1.5rem}._102k1m1q{max-height:1.75rem}}

package/dist/esm/view/FlexibleCard/components/blocks/element-group/index.js

@@ -11,12 +11,20 @@ var alignmentStyleMap = {
   right: "_1dthh9n0 _r291h9n0 _1bahesu3 _y3gnusic",
   left: "_1dthv2br _r291v2br _1bah1y6m _y3gn1e5h"
 };
-var baseStyleBySize = {
+
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var baseStyleBySizeOld = {
   xlarge: "_zulp147b _1reo15vq _18m915vq _4cvr1h6o _1e0c1txw _1ul9idpf _vwz41j6v",
   large: "_zulp1e9d _1reo15vq _18m915vq _4cvr1h6o _1e0c1txw _1ul9idpf _vwz41j6v",
   medium: "_zulpcxkx _1reo15vq _18m915vq _4cvr1h6o _1e0c1txw _1ul9idpf _vwz41j6v",
   small: "_zulppdf9 _1reo15vq _18m915vq _4cvr1h6o _1e0c1txw _1ul9idpf _vwz41j6v"
 };
+var baseStyleBySize = {
+  xlarge: "_zulpv47k _1reo15vq _18m915vq _4cvr1h6o _1e0c1txw _1ul9idpf _vwz47vkz",
+  large: "_zulppxbi _1reo15vq _18m915vq _4cvr1h6o _1e0c1txw _1ul9idpf _vwz47vkz",
+  medium: "_zulpu2gc _1reo15vq _18m915vq _4cvr1h6o _1e0c1txw _1ul9idpf _vwz47vkz",
+  small: "_zulp1b66 _1reo15vq _18m915vq _4cvr1h6o _1e0c1txw _1ul9idpf _vwz47vkz"
+};
 var baseStyleByDirection = {
   horizontal: "_2lx2vrvc _4cvr1h6o",
   vertical: "_2lx21bp4 _4cvr1y6m"
@@ -73,12 +81,13 @@ var ElementGroupNew = function ElementGroupNew(_ref) {
     _ref$position = _ref.position,
     position = _ref$position === void 0 ? SmartLinkPosition.Center : _ref$position,
     className = _ref.className;
+  var isHorizontal = direction === SmartLinkDirection.Horizontal;
   return /*#__PURE__*/React.createElement("div", {
     "data-smart-element-group": true,
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
     ,
-    className: ax([baseStyleBySize[size], baseStyleByDirection[direction], "_fiawglyw _1ouwidpf _f6ju1ns9", alignmentStyleMap[align], "_1ul99by0", widthStyle[width], direction === SmartLinkDirection.Horizontal && "_1reo15vq _18m915vq _1e0c1ule _s7n4nkob _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _1aaynkob _15tynkob _1iu61nu9 _166k1nu9 _1div1nu9 _bmfb1nu9", direction === SmartLinkDirection.Horizontal && horizontalStyleByHeight[size], direction === SmartLinkDirection.Horizontal && align === SmartLinkAlignment.Left && gapStylesLeft[size], direction === SmartLinkDirection.Horizontal && align === SmartLinkAlignment.Right && gapStylesRight[size], positionStyle[position], className])
+    className: ax([fg('platform-linking-visual-refresh-v1') ? baseStyleBySize[size] : baseStyleBySizeOld[size], baseStyleByDirection[direction], "_fiawglyw _1ouwidpf _f6ju1ns9", alignmentStyleMap[align], "_1ul99by0", widthStyle[width], isHorizontal && "_1reo15vq _18m915vq _1e0c1ule _s7n4nkob _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _1aaynkob _15tynkob _1iu61nu9 _166k1nu9 _1div1nu9 _bmfb1nu9", isHorizontal && horizontalStyleByHeight[size], isHorizontal && align === SmartLinkAlignment.Left && gapStylesLeft[size], isHorizontal && align === SmartLinkAlignment.Right && gapStylesRight[size], positionStyle[position], className])
   }, renderChildren(children, size));
 };
 var ElementGroup = function ElementGroup(props) {

package/dist/esm/view/FlexibleCard/components/container/index.compiled.css

@@ -1,14 +1,24 @@
 
 ._19itn8v0{border:var(--_vzvmm2)}
+._19itpp12{border:var(--_18x9sjc)}
 ._1yt418y6{padding:var(--_1xumd0e)}
+._2rkob7nn{border-radius:var(--ds-border-radius-300,9pt)}
 ._2rkopd34{border-radius:var(--ds-border-radius-200,8px)}
+._zulp1bpf{gap:var(--ds-space-100,8px) 0}
 ._zulp1jvo{gap:1.25rem 0}
 ._zulp1qos{gap:.5rem 0}
 ._zulpfzsm{gap:.25rem 0}
-._zulph3jc{gap:1rem 0}._18u0v77o{margin-left:var(--ds-space-025,2px)}
+._zulph3jc{gap:1rem 0}
+._zulpr2fv{gap:var(--ds-space-250,20px) 0}
+._zulpswc3{gap:var(--ds-space-050,4px) 0}
+._zulpzu5n{gap:var(--ds-space-200,1pc) 0}._18u0v77o{margin-left:var(--ds-space-025,2px)}
 ._19bv15sf{padding-left:calc(var(--preview-block-width) + 1.25rem)}
+._19bv16ru{padding-left:calc(var(--preview-block-width) + var(--ds-space-250, 20px))}
+._19bv1g7w{padding-left:calc(var(--preview-block-width) + var(--ds-space-200, 1pc))}
 ._19bv1ltm{padding-left:calc(var(--preview-block-width) + .25rem)}
+._19bv1ugb{padding-left:calc(var(--preview-block-width) + var(--ds-space-050, 4px))}
 ._19bvf557{padding-left:calc(var(--preview-block-width) + 1rem)}
+._19bvlbes{padding-left:calc(var(--preview-block-width) + var(--ds-space-100, 8px))}
 ._19bvqox2{padding-left:calc(var(--preview-block-width) + .5rem)}
 ._19pkv77o{margin-top:var(--ds-space-025,2px)}
 ._1e0c1txw{display:flex}
@@ -16,11 +26,15 @@
 ._1reo15vq{overflow-x:hidden}
 ._1t4ckb7n .has-action, ._1nxdkb7n a, ._xnbykb7n button{z-index:1}
 ._1ul9idpf{min-width:0}
+._1yob1b66{--container-gap-right:var(--ds-space-050,4px)}
+._1yob1eak{--container-gap-right:var(--ds-space-200,16px)}
 ._1yob1j6v{--container-gap-right:1rem}
 ._1yob1k92{--container-gap-right:1.25rem}
 ._1yob1kwk{--container-gap-right:.5rem}
 ._1yob1wow{--container-gap-right:var(--_12k13bg)}
 ._1yob6mu8{--container-gap-right:.25rem}
+._1yobu2gc{--container-gap-right:var(--ds-space-100,8px)}
+._1yobv47k{--container-gap-right:var(--ds-space-250,20px)}
 ._2hwxv77o{margin-right:var(--ds-space-025,2px)}
 ._2lx21bp4{flex-direction:column}
 ._bfhkhp5a{background-color:var(--ds-surface-raised,#fff)}
@@ -30,12 +44,20 @@
 ._otyrv77o{margin-bottom:var(--ds-space-025,2px)}
 ._r37x1r5k{--preview-block-width:30%}
 ._u5f315sf{padding-right:calc(var(--preview-block-width) + 1.25rem)}
+._u5f316ru{padding-right:calc(var(--preview-block-width) + var(--ds-space-250, 20px))}
+._u5f31g7w{padding-right:calc(var(--preview-block-width) + var(--ds-space-200, 1pc))}
 ._u5f31ltm{padding-right:calc(var(--preview-block-width) + .25rem)}
+._u5f31ugb{padding-right:calc(var(--preview-block-width) + var(--ds-space-050, 4px))}
 ._u5f3f557{padding-right:calc(var(--preview-block-width) + 1rem)}
+._u5f3lbes{padding-right:calc(var(--preview-block-width) + var(--ds-space-100, 8px))}
 ._u5f3qox2{padding-right:calc(var(--preview-block-width) + .5rem)}
 ._y5vk167t{--container-gap-left:var(--_73mooq)}
+._y5vk1b66{--container-gap-left:var(--ds-space-050,4px)}
+._y5vk1eak{--container-gap-left:var(--ds-space-200,16px)}
 ._y5vk1j6v{--container-gap-left:1rem}
 ._y5vk1k92{--container-gap-left:1.25rem}
 ._y5vk1kwk{--container-gap-left:.5rem}
 ._y5vk6mu8{--container-gap-left:.25rem}
+._y5vku2gc{--container-gap-left:var(--ds-space-100,8px)}
+._y5vkv47k{--container-gap-left:var(--ds-space-250,20px)}
 ._1v7y1i6y .has-action:focus, ._ufn21i6y a:focus{outline-offset:var(--ds-space-negative-025,-2px)}

package/dist/esm/view/FlexibleCard/components/container/index.js

@@ -85,15 +85,29 @@ var getLayeredLink = function getLayeredLink(testId, context, children, onClick)
   });
 };
 var baseStyleCommon = null;
-var backgroundStyle = null;
+
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var backgroundStyleOld = null;
+var backgroundStyles = null;
+
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var elevationStylesOld = null;
 var elevationStyles = null;
 var clickableContainerStyles = null;
-var gapStyleMap = {
+
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var gapStyleMapOld = {
   xlarge: "_zulp1jvo",
   large: "_zulph3jc",
   medium: "_zulp1qos",
   small: "_zulpfzsm"
 };
+var gapStyleMap = {
+  xlarge: "_zulpr2fv",
+  large: "_zulpzu5n",
+  medium: "_zulp1bpf",
+  small: "_zulpswc3"
+};
 
 /**
  * Get container padding based on smart link size
@@ -101,6 +115,19 @@ var gapStyleMap = {
  * at view/FlexibleCard/components/utils.tsx
  */
 var getPadding = function getPadding(size) {
+  if (fg('platform-linking-visual-refresh-v1')) {
+    switch (size) {
+      case SmartLinkSize.XLarge:
+        return "var(--ds-space-300, 24px)";
+      case SmartLinkSize.Large:
+        return "var(--ds-space-250, 20px)";
+      case SmartLinkSize.Medium:
+        return "var(--ds-space-200, 16px)";
+      case SmartLinkSize.Small:
+      default:
+        return "var(--ds-space-100, 8px)";
+    }
+  }
   switch (size) {
     case SmartLinkSize.XLarge:
       return '1.5rem';
@@ -114,6 +141,19 @@ var getPadding = function getPadding(size) {
   }
 };
 var getGap = function getGap(size) {
+  if (fg('platform-linking-visual-refresh-v1')) {
+    switch (size) {
+      case SmartLinkSize.XLarge:
+        return "var(--ds-space-250, 1.25rem)";
+      case SmartLinkSize.Large:
+        return "var(--ds-space-200, 1rem)";
+      case SmartLinkSize.Medium:
+        return "var(--ds-space-100, .5rem)";
+      case SmartLinkSize.Small:
+      default:
+        return "var(--ds-space-050, .25rem)";
+    }
+  }
   switch (size) {
     case SmartLinkSize.XLarge:
       return '1.25rem';
@@ -126,18 +166,34 @@ var getGap = function getGap(size) {
       return '.25rem';
   }
 };
-var previewOnLeftStyleMap = {
+
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var previewOnLeftStyleMapOld = {
   xlarge: "_19bv15sf _y5vk1k92",
   large: "_19bvf557 _y5vk1j6v",
   medium: "_19bvqox2 _y5vk1kwk",
   small: "_19bv1ltm _y5vk6mu8"
 };
-var previewOnRightStyleMap = {
+var previewOnLeftStyleMap = {
+  xlarge: "_19bv16ru _y5vkv47k",
+  large: "_19bv1g7w _y5vk1eak",
+  medium: "_19bvlbes _y5vku2gc",
+  small: "_19bv1ugb _y5vk1b66"
+};
+
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var previewOnRightStyleMapOld = {
   xlarge: "_u5f315sf _1yob1k92",
   large: "_u5f3f557 _1yob1j6v",
   medium: "_u5f3qox2 _1yob1kwk",
   small: "_u5f31ltm _1yob6mu8"
 };
+var previewOnRightStyleMap = {
+  xlarge: "_u5f316ru _1yobv47k",
+  large: "_u5f31g7w _1yob1eak",
+  medium: "_u5f3lbes _1yobu2gc",
+  small: "_u5f31ugb _1yob1b66"
+};
 
 /**
  * A container is a hidden component that build the Flexible Smart Link.
@@ -181,10 +237,20 @@ var ContainerNew = function ContainerNew(_ref3) {
   // unresolved link (unauthorized, forbidden, not found, etc.)
   var canShowAuthTooltip = showHoverPreview && status === 'unauthorized' && retry !== undefined;
   var containerPaddingStyles = null;
-  var container = /*#__PURE__*/React.createElement("div", {
+  var container = fg('platform-linking-visual-refresh-v1') ? /*#__PURE__*/React.createElement("div", {
+    "data-smart-link-container": true,
+    "data-testid": testId,
+    className: ax(["_1e0c1txw _2lx21bp4 _1ul9idpf _1reo15vq _kqswh2mm _1pcmkb7n _1v7y1i6y _ufn21i6y", gapStyleMap[size], !hideBackground && "_bfhkhp5a", "_1yt418y6 _jb7v18y6 _y5vk167t _1yob1wow _r37x1r5k", previewOnLeft && previewOnLeftStyleMap[size], previewOnRight && previewOnRightStyleMap[size], !hideElevation && "_19itpp12 _2rkob7nn _19pkv77o _2hwxv77o _otyrv77o _18u0v77o", clickableContainer && "_nqwih2mm _18ywh2mm _1nq3h2mm _1t4ckb7n _1nxdkb7n _xnbykb7n"]),
+    style: {
+      "--_1xumd0e": ix(padding),
+      "--_73mooq": ix(previewOnLeft ? gap : padding),
+      "--_12k13bg": ix(previewOnRight ? gap : padding),
+      "--_18x9sjc": ix("1px solid ".concat("var(--ds-border, #091E4224)"))
+    }
+  }, clickableContainer ? getLayeredLink(testId, context, children, onClick) : null, renderChildren(children, size, theme, status, retry, onClick)) : /*#__PURE__*/React.createElement("div", {
     "data-smart-link-container": true,
     "data-testid": testId,
-    className: ax(["_1e0c1txw _2lx21bp4 _1ul9idpf _1reo15vq _kqswh2mm _1pcmkb7n _1v7y1i6y _ufn21i6y", gapStyleMap[size], !hideBackground && "_bfhkhp5a", "_1yt418y6 _jb7v18y6 _y5vk167t _1yob1wow _r37x1r5k", previewOnLeft && previewOnLeftStyleMap[size], previewOnRight && previewOnRightStyleMap[size], !hideElevation && "_19itn8v0 _2rkopd34 _19pkv77o _2hwxv77o _otyrv77o _18u0v77o", clickableContainer && "_nqwih2mm _18ywh2mm _1nq3h2mm _1t4ckb7n _1nxdkb7n _xnbykb7n"]),
+    className: ax(["_1e0c1txw _2lx21bp4 _1ul9idpf _1reo15vq _kqswh2mm _1pcmkb7n _1v7y1i6y _ufn21i6y", gapStyleMapOld[size], !hideBackground && "_bfhkhp5a", "_1yt418y6 _jb7v18y6 _y5vk167t _1yob1wow _r37x1r5k", previewOnLeft && previewOnLeftStyleMapOld[size], previewOnRight && previewOnRightStyleMapOld[size], !hideElevation && "_19itn8v0 _2rkopd34 _19pkv77o _2hwxv77o _otyrv77o _18u0v77o", clickableContainer && "_nqwih2mm _18ywh2mm _1nq3h2mm _1t4ckb7n _1nxdkb7n _xnbykb7n"]),
     style: {
       "--_1xumd0e": ix(padding),
       "--_73mooq": ix(previewOnLeft ? gap : padding),

package/dist/esm/view/FlexibleCard/components/elements/badge/index.compiled.css

@@ -1,3 +1,4 @@
+._11c81vlj{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
 ._11c8qk37{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
 ._16jlidpf{flex-grow:0}
 ._19bv1xvx{padding-left:var(--ds-space-025,.125rem)}
@@ -25,6 +26,7 @@
 ._rtys1j6v img, ._b8nk1j6v span, ._4x201j6v svg{max-width:1rem}
 ._s7n4nkob{vertical-align:middle}
 ._syaz131l{color:var(--ds-text-subtlest,#626f86)}
+._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
 ._syaz1oju{color:var(--ds-icon-subtle,#626f86)}
 ._uhasidpf svg{padding-right:0}
 ._vwz4idpf{line-height:0}

package/dist/esm/view/FlexibleCard/components/elements/badge/index.js

@@ -15,8 +15,9 @@ import { getFormattedMessage } from '../../utils';
 import BadgeOld from './BadgeOld';
 var badgeStyles = null;
 var iconStyles = null;
-// ${getIconSizeStyles('1rem')}
 
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var labelStylesOld = null;
 var labelStyles = null;
 var messageMapper = (_messageMapper = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_messageMapper, IconType.PriorityBlocker, messages.priority_blocker), IconType.PriorityCritical, messages.priority_critical), IconType.PriorityHigh, messages.priority_high), IconType.PriorityHighest, messages.priority_highest), IconType.PriorityLow, messages.priority_low), IconType.PriorityLowest, messages.priority_lowest), IconType.PriorityMajor, messages.priority_major), IconType.PriorityMedium, messages.priority_medium), IconType.PriorityMinor, messages.priority_minor), IconType.PriorityTrivial, messages.priority_trivial), _defineProperty(_messageMapper, IconType.PriorityUndefined, messages.priority_undefined));
 var getFormattedMessageFromIcon = function getFormattedMessageFromIcon(icon) {
@@ -87,7 +88,7 @@ var BadgeNew = function BadgeNew(_ref) {
     className: ax(["_16jlidpf _1o9zidpf _i0dl1wug _syaz1oju _vwz4idpf _s7n4nkob _4t3i1j6v _1tke1j6v _c71l1j6v _1bsb1j6v _1ul91j6v _p12f1j6v _i2i3idpf _uhasidpf _5jw9idpf _7wy9idpf _bna71j6v _1xjx1j6v _17521j6v _qci81j6v _15iz1j6v _erub1j6v _19l31j6v _1pr21j6v _1u5t1j6v _mezj1j6v _e2oo1j6v _w8l51j6v _1rg21j6v _q7cv1j6v _xwbj1j6v _rtys1j6v _b8nk1j6v _4x201j6v _1jtnidpf _13t3idpf _rm9uidpf _rtqbnkob _e4kmnkob _z239nkob"])
   }, badgeIcon), /*#__PURE__*/React.createElement("span", {
     "data-testid": "".concat(testId, "-label"),
-    className: ax(["_11c8qk37 _syaz131l _19bv1xvx _s7n4nkob"])
+    className: ax([fg('platform-linking-visual-refresh-v1') ? "_11c81vlj _syaz1gjq _19bv1xvx _s7n4nkob" : "_11c8qk37 _syaz131l _19bv1xvx _s7n4nkob"])
   }, formattedMessageOrLabel));
 };
 var Badge = function Badge(props) {

package/dist/esm/view/FlexibleCard/components/elements/date-time/index.compiled.css

@@ -1,3 +1,4 @@
+._11c81vlj{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
 ._11c8qk37{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
 ._18m915vq{overflow-y:hidden}
 ._1bto1l2s{text-overflow:ellipsis}
@@ -7,4 +8,5 @@
 ._1yyjkb7n{-webkit-line-clamp:1}
 ._sudp1e54{-webkit-box-orient:vertical}
 ._syaz131l{color:var(--ds-text-subtlest,#626f86)}
+._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
 @supports not (-webkit-line-clamp:1){._102k1j6v{max-height:1rem}}

package/dist/esm/view/FlexibleCard/components/elements/date-time/index.js

@@ -8,6 +8,8 @@ import { FormattedMessage, useIntl } from 'react-intl-next';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { messages } from '../../../../../messages';
 import DateTimeOld from './DateTimeOld';
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var stylesOld = null;
 var styles = null;
 var typeToDescriptorMap = {
   created: {
@@ -72,7 +74,7 @@ var DateTimeNew = function DateTimeNew(_ref) {
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
     ,
-    className: ax(["_11c8qk37 _1reo15vq _18m915vq _syaz131l _1e0ccj1k _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _102k1j6v", className])
+    className: ax([fg('platform-linking-visual-refresh-v1') ? "_11c81vlj _1reo15vq _18m915vq _syaz1gjq _1e0ccj1k _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _102k1j6v" : "_11c8qk37 _1reo15vq _18m915vq _syaz131l _1e0ccj1k _1bto1l2s _1nmz1hna _1yyjkb7n _sudp1e54 _102k1j6v", className])
   }, text ? "".concat(text, " ").concat(context) : /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, typeToDescriptorMap[type][typeVariant], {
     values: {
       context: context

package/dist/esm/view/FlexibleCard/components/elements/snippet-element/index.js

@@ -11,6 +11,9 @@ import { FlexibleUiContext } from '../../../../../state/flexible-ui-context';
 import Text from '../text';
 import SnippetElementOld from './SnippetElementOld';
 var SNIPPET_DEFAULT_MAX_LINES = 3;
+
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var snippetBaseStyleOld = null;
 var snippetBaseStyle = null;
 var SnippetElementNew = function SnippetElementNew() {
   var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -24,7 +27,7 @@ var SnippetElementNew = function SnippetElementNew() {
     content: overrideContent !== null && overrideContent !== void 0 ? overrideContent : context === null || context === void 0 ? void 0 : context.snippet,
     maxLines: maxLines,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
-    className: ax(["_syaz1fxt _181u1kdv _1rkw1kdv _te171kdv _uizt1kdv", className])
+    className: ax([fg('platform-linking-visual-refresh-v1') ? "_syaz1fxt _181u1kdv _1rkw1kdv _te171kdv _uizt1kdv" : "_syaz1fxt _181u1kdv _1rkw1kdv _te171kdv _uizt1kdv", className])
   }, props));
 };
 var SnippetElement = function SnippetElement() {

package/dist/esm/view/FlexibleCard/components/elements/text/index.compiled.css

@@ -1,3 +1,4 @@
+._11c81vlj{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
 ._11c8qk37{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
 ._18m915vq{overflow-y:hidden}
 ._1bto1l2s{text-overflow:ellipsis}
@@ -8,4 +9,5 @@
 ._o5724jg8{white-space:normal}
 ._sudp1e54{-webkit-box-orient:vertical}
 ._syaz131l{color:var(--ds-text-subtlest,#626f86)}
+._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
 @supports not (-webkit-line-clamp:1){._102klxil{max-height:var(--_ohw86c)}}

package/dist/esm/view/FlexibleCard/components/elements/text/index.js

@@ -5,6 +5,8 @@ import { ax, ix } from "@compiled/react/runtime";
 import { fg } from '@atlaskit/platform-feature-flags';
 import { getFormattedMessage } from '../../utils';
 import TextOld from './TextOld';
+// TODO: Remove on fg cleanup: platform-linking-visual-refresh-v1
+var baseStyleOld = null;
 var baseStyle = null;
 
 /**
@@ -33,7 +35,7 @@ var TextNew = function TextNew(_ref) {
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
     ,
-    className: ax(["_11c8qk37 _1reo15vq _18m915vq _syaz131l _o5724jg8 _1e0ccj1k _1bto1l2s _1nmz1hna _sudp1e54", "_1yyjr31u _102klxil", className]),
+    className: ax([fg('platform-linking-visual-refresh-v1') ? "_11c81vlj _1reo15vq _18m915vq _syaz1gjq _o5724jg8 _1e0ccj1k _1bto1l2s _1nmz1hna _sudp1e54" : "_11c8qk37 _1reo15vq _18m915vq _syaz131l _o5724jg8 _1e0ccj1k _1bto1l2s _1nmz1hna _sudp1e54", "_1yyjr31u _102klxil", className]),
     style: {
       "--_1erfju8": ix(maxLines),
       "--_ohw86c": ix("calc(".concat(maxLines, " * 1rem)"))

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

@@ -13,7 +13,7 @@ import LinkWarningModal from './LinkWarningModal';
 import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "34.10.1",
+  packageVersion: "34.10.3",
   componentName: 'linkUrl'
 };
 var Anchor = withLinkClickedEvent('a');

package/dist/esm/view/common/ai-summary/index.compiled.css

@@ -1,8 +1,10 @@
+._11c81vlj{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
 ._11c8qk37{font:var(--ds-font-body-UNSAFE_small,normal 400 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
 ._181u1kdv{-webkit-user-select:text}
 ._1nmz1hna{word-break:break-word}
 ._1rkw1kdv{-moz-user-select:text}
 ._o5724jg8{white-space:normal}
 ._slp31hna{word-wrap:break-word}
+._syaz1gjq{color:var(--ds-text-subtle,#44546f)}
 ._te171kdv{-ms-user-select:text}
 ._uizt1kdv{-webkit-user-select:text;-ms-user-select:text;user-select:text}

package/dist/esm/view/common/ai-summary/index.js

@@ -11,6 +11,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import AISummaryOld from './AISummaryOld';
 import UList from './ulist';
 var AISummaryCSSStyles = null;
+var baseStyle = null;
 
 /**
  * A component to render a response from AI in markdown text.
@@ -32,7 +33,7 @@ var AISummaryNew = function AISummaryNew(_ref) {
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
     ,
-    className: ax(["_11c8qk37 _slp31hna _1nmz1hna _o5724jg8 _181u1kdv _1rkw1kdv _te171kdv _uizt1kdv", className]),
+    className: ax([fg('platform-linking-visual-refresh-v1') ? "_11c81vlj _syaz1gjq _slp31hna _1nmz1hna _o5724jg8 _181u1kdv _1rkw1kdv _te171kdv _uizt1kdv" : "_11c8qk37 _slp31hna _1nmz1hna _o5724jg8 _181u1kdv _1rkw1kdv _te171kdv _uizt1kdv", className]),
     children: content,
     options: {
       forceWrapper: true,

package/dist/types/extractors/common/__mocks__/withIntl.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const withIntl: (child: React.ReactNode) => JSX.Element;
+export declare const withIntl: (child: React.ReactNode) => React.JSX.Element;

package/dist/types/ssr.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import React from 'react';
 import type { CardProps } from './types';
 export type CardSSRProps = CardProps & {
     url: string;
 };
-export declare const CardSSR: (props: CardSSRProps) => JSX.Element;
+export declare const CardSSR: (props: CardSSRProps) => React.JSX.Element;

package/dist/types/state/hooks-external/useSmartLinkActions.d.ts

@@ -47,6 +47,6 @@ export interface UseSmartLinkActionsOpts {
 }
 export declare function useSmartLinkActions({ url, appearance, origin, actionOptions, }: UseSmartLinkActionsOpts): {
     id: string;
-    text: JSX.Element;
+    text: import("react").JSX.Element;
     invoke: () => Promise<void>;
 }[];

package/dist/types/state/modal/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { type SmartLinkModalAPI, type SmartLinkModalProviderProps } from './types';
 export declare const SmartLinkModalContext: React.Context<SmartLinkModalAPI>;
-export declare const SmartLinkModalProvider: ({ children }: SmartLinkModalProviderProps) => JSX.Element;
+export declare const SmartLinkModalProvider: ({ children }: SmartLinkModalProviderProps) => React.JSX.Element;
 /**
  * Open (lazy load) modal
  *

package/dist/types/utils/actions/to-action.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="react" />
+import React from 'react';
 import { type MessageDescriptor } from 'react-intl-next';
 import { type InvokeClientActionHandler, type InvokeClientActionProps } from '../../state/hooks/use-invoke-client-action/types';
 export declare const toAction: (action: InvokeClientActionProps, invokeClientAction: InvokeClientActionHandler, message: MessageDescriptor, id: string) => {
     id: string;
-    text: JSX.Element;
+    text: React.JSX.Element;
     invoke: () => Promise<void>;
 };