@atlaskit/smart-card 27.5.4 → 27.6.0

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

@@ -76,12 +76,12 @@ function visible(_ref7) {
   return frameStyle === 'show' ? visibleStyles : '';
 }
 
-// eslint-disable-next-line @atlaskit/design-system/no-styled-tagged-template-expression, @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/design-system/no-styled-tagged-template-expression, @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var LinkWrapper = exports.LinkWrapper = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t", " &:hover {\n\t\ttext-decoration: none;\n\t}\n"])), function (props) {
   return wrapperStyles(props);
 });
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
 var Wrapper = exports.Wrapper = _styled.default.div(function (props) {
   return wrapperStyles(props);
 }, {
@@ -91,7 +91,7 @@ var Wrapper = exports.Wrapper = _styled.default.div(function (props) {
   marginTop: '10px'
 });
 var embedHeaderHeight = exports.embedHeaderHeight = 32;
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var Header = exports.Header = _styled.default.div({
   height: "".concat(embedHeaderHeight, "px"),
   position: 'absolute',
@@ -99,18 +99,27 @@ var Header = exports.Header = _styled.default.div({
   width: '100%',
   display: 'flex',
   alignItems: 'center',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
   color: "var(--ds-icon, ".concat(colors.N300, ")"),
   opacity: 0,
   transition: '300ms opacity cubic-bezier(0.15, 1, 0.3, 1)'
-}, function (_ref8) {
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
+function (_ref8) {
   var frameStyle = _ref8.frameStyle;
   return frameStyle === 'show' ? "\n        box-sizing: border-box;\n        padding: 0 ".concat("var(--ds-space-100, 8px)", ";\n      ") : '';
 });
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
-var IconWrapper = exports.IconWrapper = _styled.default.div(borderRadius, csssize(16), function (_ref9) {
+// 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.div(
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+borderRadius,
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+csssize(16),
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
+function (_ref9) {
   var isPlaceholder = _ref9.isPlaceholder;
   if (isPlaceholder) {
-    return "\n      background-color: ".concat("var(--ds-skeleton, ".concat(colors.N30, ")"), ";\n    ");
+    return "\n// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766\n      background-color: ".concat("var(--ds-skeleton, ".concat(colors.N30, ")"), ";\n    ");
   } else {
     return '';
   }
@@ -118,28 +127,33 @@ var IconWrapper = exports.IconWrapper = _styled.default.div(borderRadius, csssiz
   marginRight: "var(--ds-space-050, 4px)"
 });
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
-var TextWrapper = exports.TextWrapper = _styled.default.div(function (_ref10) {
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var TextWrapper = exports.TextWrapper = _styled.default.div(
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
+function (_ref10) {
   var isPlaceholder = _ref10.isPlaceholder;
   if (isPlaceholder) {
-    return "\n        ".concat(borderRadius, "\n        width: 125px;\n        height: 12px;\n        background-color: ", "var(--ds-skeleton, ".concat(colors.N30, ")"), ";\n      ");
+    return "\n        ".concat(borderRadius, "\n        width: 125px;\n        height: 12px;\n// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766\n        background-color: ", "var(--ds-skeleton, ".concat(colors.N30, ")"), ";\n      ");
   } else {
     return '';
   }
 }, {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
   color: "var(--ds-text-subtlest, ".concat(colors.N300, ")"),
   fontSize: '12px',
   lineHeight: '16px'
-}, ellipsis('none'));
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+ellipsis('none'));
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var TooltipWrapper = exports.TooltipWrapper = _styled.default.div({
   overflow: 'hidden'
 });
 // NB: `overflow` is kept as `hidden` since
 // the internal contents of the `iframe` should
 // manage scrolling behaviour.
-// eslint-disable-next-line @atlaskit/design-system/no-styled-tagged-template-expression, @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/design-system/no-styled-tagged-template-expression, @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var Content = exports.Content = _styled.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\t", ";\n\tborder: 1px solid ", ";\n\tbackground-color: ", ";\n\tposition: absolute;\n\tz-index: 1;\n\twidth: 100%;\n\ttransition: box-shadow 0.3s;\n\n\t> .calc-height > div > div {\n\t\tleft: unset !important;\n\t\twidth: unset !important;\n\t\theight: unset !important;\n\t\tposition: initial !important;\n\t\tpadding-bottom: unset !important;\n\t}\n\t> .embed-preview > div {\n\t\tmargin: 0 auto;\n\t}\n\n\t", "\n\n\t", "\n\n  ", "\n"])), contentBorderRadius, "var(--ds-border, ".concat(_colors.N40, ")"), "var(--ds-surface-raised, white)", function (_ref11) {
   var allowScrollBar = _ref11.allowScrollBar,
     removeOverflow = _ref11.removeOverflow;
@@ -154,7 +168,7 @@ var Content = exports.Content = _styled.default.div(_templateObject2 || (_templa
   var frameStyle = _ref13.frameStyle;
   return frameStyle === 'hide' ? 'height: 100%;' : "\n        height: calc(100% - ".concat("var(--ds-space-400, 32px)", ");\n        top: ", "var(--ds-space-400, 32px)", ";\n      ");
 });
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 var Image = exports.Image = _styled.default.img(function (_ref14) {
   var size = _ref14.size;
   return csssize(size);
@@ -163,7 +177,7 @@ var Image = exports.Image = _styled.default.img(function (_ref14) {
 });
 var maxAvatarCount = exports.maxAvatarCount = 6;
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var ContentWrapper = exports.ContentWrapper = _styled.default.div({
   display: 'flex',
   flexDirection: 'row',
@@ -171,8 +185,9 @@ var ContentWrapper = exports.ContentWrapper = _styled.default.div({
   padding: "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-150, 12px)", " ", "var(--ds-space-150, 12px)", " ", "var(--ds-space-150, 12px)")
 });
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var Title = exports.Title = _styled.default.div({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
   color: "var(--ds-text, ".concat(colors.N900, ")"),
   fontSize: '16px',
   fontWeight: 500,
@@ -181,18 +196,22 @@ var Title = exports.Title = _styled.default.div({
   overflow: 'hidden'
 });
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var Byline = exports.Byline = _styled.default.div({
   marginTop: "var(--ds-space-050, 4px)",
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
   color: "var(--ds-text-subtlest, ".concat(colors.N300, ")"),
   fontSize: '12px',
   fontWeight: 'normal',
   lineHeight: 16 / 12
-}, ellipsis('100%'));
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+ellipsis('100%'));
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var Description = exports.Description = _styled.default.div({
   marginTop: "calc(".concat("var(--ds-space-100, 8px)", " - 1px)"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
   color: "var(--ds-text, ".concat(colors.N800, ")"),
   fontSize: '12px',
   fontWeight: 'normal',
@@ -201,39 +220,43 @@ var Description = exports.Description = _styled.default.div({
   overflow: 'hidden'
 });
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var ResolvedViewIconWrapper = exports.ResolvedViewIconWrapper = _styled.default.div({
   marginTop: "var(--ds-space-050, 4px)"
 });
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
 var Thumbnail = exports.Thumbnail = _styled.default.div(borderRadius, csssize(48), function (props) {
   return {
     float: 'right',
     margin: "var(--ds-space-050, 4px)".concat(" 0 ", "var(--ds-space-150, 12px)", " ", "var(--ds-space-150, 12px)"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     backgroundColor: "var(--ds-skeleton, ".concat(colors.N30, ")"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     backgroundImage: "url(".concat(props.src, ")"),
     backgroundSize: 'cover'
   };
 });
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var UsersWrapper = exports.UsersWrapper = _styled.default.div({
   marginTop: "var(--ds-space-100, 8px)"
 });
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var ActionsWrapper = exports.ActionsWrapper = _styled.default.div({
   marginTop: "var(--ds-space-100, 8px)",
   textAlign: 'right',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '> *': {
     marginTop: "var(--ds-space-050, 4px)"
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '> * + *': {
     marginLeft: "var(--ds-space-050, 4px)"
   }
 });
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var AlertWrapper = exports.AlertWrapper = _styled.default.div({
   position: 'absolute',
   top: 0,

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

@@ -16,6 +16,21 @@ var _messages = require("../../../messages");
 var _utils = require("../../common/utils");
 /** @jsx jsx */
 
+var messageStyles = (0, _react.css)({
+  fontSize: "".concat((0, _constants.fontSize)(), "px"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  marginLeft: (0, _utils.gs)(0.5),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  marginRight: (0, _utils.gs)(0.5),
+  display: '-webkit-box',
+  overflow: 'hidden',
+  textOverflow: 'ellipsis',
+  WebkitLineClamp: 1,
+  WebkitBoxOrient: 'vertical',
+  // Fallback options.
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  maxHeight: (0, _utils.gs)(3)
+});
 var EmbedCardErroredView = exports.EmbedCardErroredView = function EmbedCardErroredView(_ref) {
   var onRetry = _ref.onRetry,
     _ref$isSelected = _ref.isSelected,
@@ -33,20 +48,7 @@ var EmbedCardErroredView = exports.EmbedCardErroredView = function EmbedCardErro
     primaryColor: "var(--ds-icon-danger, ".concat(_colors.R300, ")"),
     label: "error-icon"
   }), (0, _react.jsx)("span", {
-    css: {
-      fontSize: "".concat((0, _constants.fontSize)(), "px"),
-      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-      marginLeft: (0, _utils.gs)(0.5),
-      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-      marginRight: (0, _utils.gs)(0.5),
-      display: '-webkit-box',
-      overflow: 'hidden',
-      textOverflow: 'ellipsis',
-      WebkitLineClamp: 1,
-      WebkitBoxOrient: 'vertical',
-      // Fallback options.
-      maxHeight: (0, _utils.gs)(3)
-    }
+    css: messageStyles
   }, (0, _react.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.could_not_load_link)), (0, _react.jsx)(_customThemeButton.default, {
     testId: "err-view-retry",
     appearance: "link",

package/dist/cjs/view/EmbedCard/views/unresolved-view/styled.js

@@ -6,10 +6,13 @@ Object.defineProperty(exports, "__esModule", {
 exports.titleStyles = exports.imageStyles = exports.descriptionStyles = exports.contentStyles = exports.containerStyles = void 0;
 var _react = require("@emotion/react");
 var _utils = require("../../../common/utils");
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var containerStyles = exports.containerStyles = (0, _react.css)({
   display: 'grid',
   height: 'inherit'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var contentStyles = exports.contentStyles = (0, _react.css)({
   display: 'flex',
   flexDirection: 'column',
@@ -18,19 +21,26 @@ var contentStyles = exports.contentStyles = (0, _react.css)({
   margin: 'auto',
   padding: "var(--ds-space-200, 16px)",
   gap: "var(--ds-space-250, 20px)",
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   maxWidth: (0, _utils.gs)(50)
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var imageStyles = exports.imageStyles = (0, _react.css)({
   height: '120px',
   width: '180px',
   objectFit: 'contain',
   objectPosition: 'center center'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var titleStyles = exports.titleStyles = (0, _react.css)({
   textAlign: 'center',
   margin: 0,
   padding: 0
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var descriptionStyles = exports.descriptionStyles = (0, _react.css)({
   fontSize: '1em',
   textAlign: 'center'

package/dist/cjs/view/EmbedModal/components/link-info/index.js

@@ -80,26 +80,31 @@ var LinkInfo = function LinkInfo(_ref) {
       }))
     );
   }, [onResizeButtonClick, size, testId]);
-  return (0, _react.jsx)("div", {
-    css: _styled.containerStyles
-  }, icon && (0, _react.jsx)("div", {
-    css: _styled.iconCss,
-    "data-testid": "".concat(testId, "-icon")
-  }, (0, _react.jsx)(_Icon.Icon, icon)), (0, _react.jsx)("div", {
-    css: _styled.titleCss
-  }, (0, _react.jsx)("h3", {
-    "data-testid": "".concat(testId, "-title")
-  }, title), (0, _react.jsx)("span", {
-    tabIndex: 0
-  })), (0, _react.jsx)("div", {
-    css: _styled.actionCss
-  }, downloadButton, urlButton, sizeButton, (0, _react.jsx)(_linkInfoButton.default, {
-    content: (0, _react.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.preview_close),
-    icon: (0, _react.jsx)(_cross.default, {
-      label: _messages.messages.preview_close.defaultMessage
-    }),
-    onClick: onClose,
-    testId: "".concat(testId, "-close")
-  })));
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    (0, _react.jsx)("div", {
+      css: _styled.containerStyles
+    }, icon &&
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    (0, _react.jsx)("div", {
+      css: _styled.iconCss,
+      "data-testid": "".concat(testId, "-icon")
+    }, (0, _react.jsx)(_Icon.Icon, icon)), (0, _react.jsx)("div", {
+      css: _styled.titleCss
+    }, (0, _react.jsx)("h3", {
+      "data-testid": "".concat(testId, "-title")
+    }, title), (0, _react.jsx)("span", {
+      tabIndex: 0
+    })), (0, _react.jsx)("div", {
+      css: _styled.actionCss
+    }, downloadButton, urlButton, sizeButton, (0, _react.jsx)(_linkInfoButton.default, {
+      content: (0, _react.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.preview_close),
+      icon: (0, _react.jsx)(_cross.default, {
+        label: _messages.messages.preview_close.defaultMessage
+      }),
+      onClick: onClose,
+      testId: "".concat(testId, "-close")
+    })))
+  );
 };
 var _default = exports.default = LinkInfo;

package/dist/cjs/view/EmbedModal/components/link-info/styled.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.titleCss = exports.iconCss = exports.containerStyles = exports.actionCss = void 0;
 var _react = require("@emotion/react");
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var containerStyles = exports.containerStyles = (0, _react.css)({
   alignItems: 'center',
   display: 'flex',
@@ -19,7 +20,9 @@ var iconSize = '24px';
 // EDM-7328: CSS Specificity
 // An embed modal icon css for img, span, svg has specificity weight of 0-1-1.
 // Specify flex ui icon selector to increase specificity weight to 0-2-1.
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var iconCss = exports.iconCss = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '&, [data-smart-element-icon] img, [data-smart-element-icon] span, [data-smart-element-icon] svg, img, span, svg': {
     height: iconSize,
     minHeight: iconSize,
@@ -30,8 +33,10 @@ var iconCss = exports.iconCss = (0, _react.css)({
   }
 });
 var height = '20px';
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var titleCss = exports.titleCss = (0, _react.css)({
   flex: '1 1 auto',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   h3: {
     flex: '1 1 auto',
     fontSize: '16px',
@@ -49,17 +54,21 @@ var titleCss = exports.titleCss = (0, _react.css)({
     }
   }
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var actionCss = exports.actionCss = (0, _react.css)({
   display: 'flex',
   flex: '0 0 auto',
   gap: "var(--ds-space-050, 4px)",
   lineHeight: height,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   span: {
     lineHeight: height
   },
   '@media only screen and (max-width: 980px)': {
     // Hide resize button if the screen is smaller than the min width
     // or too small to have enough impact to matter.
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '.smart-link-resize-button': {
       display: 'none'
     }

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

@@ -20,8 +20,10 @@ var getButtonStyle = function getButtonStyle(size, iconOnly) {
   switch (size) {
     case _constants.SmartLinkSize.Large:
       return iconOnly ? (0, _react2.css)({
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
         'button, button:hover, button:focus, button:active': {
           padding: 0,
+          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
           '> span': {
             margin: 0
           }
@@ -32,6 +34,7 @@ var getButtonStyle = function getButtonStyle(size, iconOnly) {
         fontSize: '0.75rem',
         fontWeight: 500,
         lineHeight: '1rem',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
         'button, button:hover, button:focus, button:active': [{
           lineHeight: '1rem'
         }, iconOnly ? "\n            padding: 0.125rem;\n          " : "\n            padding-left: 0.25rem;\n            padding-right: 0.25rem;\n          "]
@@ -64,6 +67,7 @@ var ActionButton = function ActionButton(_ref) {
     };
   }, []);
   return (0, _react2.jsx)("div", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: [getButtonStyle(size, iconOnly), overrideCss],
     "data-testid": "".concat(testId, "-button-wrapper")
   }, (0, _react2.jsx)(_tooltip.default, {

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

@@ -24,14 +24,17 @@ var getIconWidth = function getIconWidth(size) {
 };
 var getIconStyles = function getIconStyles(isDisabled) {
   return (0, _react2.css)({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     color: isDisabled ? "var(--ds-text-disabled, #6B778C)" : "var(--ds-icon, #44546F)"
   });
 };
 var stackItemIconSizeStyles = (0, _utils.getIconSizeStyles)('20px');
+// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
 var stackItemIconStyles = (0, _react2.css)(stackItemIconSizeStyles, {
   display: 'inline-block',
   lineHeight: 0,
   padding: "var(--ds-space-025, 2px)",
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   'span,svg,img': {
     lineHeight: 0
   }
@@ -43,7 +46,11 @@ var ActionIcon = function ActionIcon(_ref) {
     isDisabled = _ref.isDisabled,
     asStackItemIcon = _ref.asStackItemIcon;
   return (0, _react2.jsx)("span", {
-    css: [getIconStyles(isDisabled), asStackItemIcon ? stackItemIconStyles : (0, _utils.getIconSizeStyles)(getIconWidth(size))],
+    css: [
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
+    getIconStyles(isDisabled),
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    asStackItemIcon ? stackItemIconStyles : (0, _utils.getIconSizeStyles)(getIconWidth(size))],
     "data-testid": "".concat(testId, "-icon")
   }, icon);
 };

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

@@ -19,6 +19,7 @@ var buttonStyles = (0, _primitives.xcss)({
   cursor: 'pointer',
   padding: 'space.050',
   width: '100%',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   ':focus:not(:focus-visible)': {
     outline: 'none'
   },

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

@@ -5,22 +5,49 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = require("@emotion/react");
 var _action = _interopRequireDefault(require("../action"));
 var _reactIntlNext = require("react-intl-next");
 var _messages = require("../../../../../messages");
 var _flexibleUiContext = require("../../../../../state/flexible-ui-context");
 var _relatedLinksActionIcon = _interopRequireDefault(require("./related-links-action-icon"));
-/** @jsx jsx */
-
-var ViewRelatedLinksAction = function ViewRelatedLinksAction(props) {
+var _react2 = require("react");
+var _modal = require("../../../../../state/modal");
+var _excluded = ["onClick"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != (0, _typeof2.default)(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } /** @jsx jsx */
+var RelatedLinksModal = /*#__PURE__*/(0, _react2.lazy)(function () {
+  return Promise.resolve().then(function () {
+    return _interopRequireWildcard(require( /* webpackChunkName: "@atlaskit-internal_smartcard-RelatedLinksModal" */'../../../../RelatedLinksModal'));
+  });
+});
+var ViewRelatedLinksAction = function ViewRelatedLinksAction(_ref) {
   var _context$actions;
+  var onClickCallback = _ref.onClick,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var modal = (0, _modal.useSmartLinkModal)();
   var context = (0, _flexibleUiContext.useFlexibleUiContext)();
   var actionData = context === null || context === void 0 || (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions.ViewRelatedLinksAction;
+  var onClick = (0, _react2.useCallback)(function () {
+    var url = actionData === null || actionData === void 0 ? void 0 : actionData.url;
+    if (url) {
+      modal.open((0, _react.jsx)(RelatedLinksModal, {
+        url: url,
+        showModal: true,
+        onClose: function onClose() {
+          return modal.close();
+        }
+      }));
+    }
+    onClickCallback === null || onClickCallback === void 0 || onClickCallback();
+  }, [actionData === null || actionData === void 0 ? void 0 : actionData.url, modal, onClickCallback]);
   return actionData ? (0, _react.jsx)(_action.default, (0, _extends2.default)({
     content: (0, _react.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.related_links_view_related_urls),
     icon: (0, _react.jsx)(_relatedLinksActionIcon.default, null),
+    onClick: onClick,
     testId: "smart-action-view-related-links-action",
     ariaLabel: "View most recent pages or content types coming from or found on this link"
   }, props)) : null;

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

@@ -88,7 +88,9 @@ var ActionBlock = function ActionBlock(_ref) {
         },
         onError: onError,
         onLoadingChange: onLoadingChange,
-        size: size,
+        size: size
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+        ,
         xcss: (0, _primitives.xcss)({
           paddingInline: padding
         }),

package/dist/cjs/view/FlexibleCard/components/blocks/action-group/index.js

@@ -28,8 +28,10 @@ var _excluded = ["triggerRef"];
 var styles = (0, _react2.css)({
   display: 'inline-flex',
   lineHeight: '1rem',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '> div': {
     alignItems: 'center',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     'button:focus-visible': {
       outlineOffset: "var(--ds-space-negative-025, -2px)"
     }

package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/ai-state-done.js

@@ -28,6 +28,7 @@ var tooltipMsgStyles = (0, _primitives.xcss)({
 });
 var iconTooltipLinkStyles = (0, _react2.css)({
   color: "var(--ds-text-subtlest, #626F86)",
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   '&:link, :visited': {
     color: "var(--ds-text-subtlest, #626F86)"
   },

package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/feature-discovery/index.js

@@ -43,10 +43,13 @@ var FeatureDiscovery = function FeatureDiscovery(_ref) {
   }, [storageClient, discovered]);
   var component = (0, _react2.useMemo)(function () {
     if (!discovered) {
-      return (0, _react.jsx)("span", {
-        css: (0, _styled.getPulseStyles)(),
-        "data-testid": "".concat(testId, "-discovery")
-      }, children);
+      return (
+        // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+        (0, _react.jsx)("span", {
+          css: (0, _styled.getPulseStyles)(),
+          "data-testid": "".concat(testId, "-discovery")
+        }, children)
+      );
     }
   }, [children, discovered, testId]);
   return component !== null && component !== void 0 ? component : children;

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

@@ -155,7 +155,9 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
      */,
     overrideCss: (0, _react2.css)({
       overflow: 'visible'
-    }, props.overrideCss)
+    },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+    props.overrideCss)
   }), status === 'done' && /*#__PURE__*/_react.default.createElement(_aiEventSummaryViewed.default, {
     fromCache: isSummarisedOnMountRef.current
   }), /*#__PURE__*/_react.default.createElement(_motionWrapper.default, {

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

@@ -41,6 +41,7 @@ var Block = function Block(_ref) {
     onRender && onRender();
   }, [onRender]);
   return (0, _react2.jsx)("div", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: [getBlockStyles(direction, size), overrideCss],
     "data-smart-block": true,
     "data-testid": testId,