@atlaskit/smart-card 27.5.3 → 27.6.0

package/dist/esm/view/BlockCard/components/Thumbnail.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /** @jsx jsx */
-import { jsx } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { gs, mq } from '../../common/utils';
 export var Thumbnail = function Thumbnail(props) {
   return props.color ? jsx(ThumbnailWithBackground, props) : jsx(ThumbnailDefault, props);
@@ -17,6 +17,7 @@ export var ThumbnailDefault = function ThumbnailDefault(_ref) {
   var src = _ref.src,
     testId = _ref.testId;
   return jsx("div", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     css: mq(_objectSpread(_objectSpread({}, sharedStyles), {}, {
       backgroundSize: 'cover',
       backgroundRepeat: 'no-repeat',
@@ -27,11 +28,16 @@ export var ThumbnailDefault = function ThumbnailDefault(_ref) {
     "data-trello-do-not-use-override": testId
   });
 };
+var thumbnailImgStyles = css({
+  height: '90px',
+  width: '90px'
+});
 export var ThumbnailWithBackground = function ThumbnailWithBackground(_ref2) {
   var src = _ref2.src,
     color = _ref2.color,
     testId = _ref2.testId;
   return jsx("div", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     css: mq(_objectSpread(_objectSpread({}, sharedStyles), {}, {
       backgroundColor: color,
       display: 'flex',
@@ -42,9 +48,6 @@ export var ThumbnailWithBackground = function ThumbnailWithBackground(_ref2) {
     "data-trello-do-not-use-override": testId
   }, jsx("img", {
     src: src,
-    css: {
-      height: '90px',
-      width: '90px'
-    }
+    css: thumbnailImgStyles
   }));
 };

package/dist/esm/view/BlockCard/components/UnresolvedText.js

@@ -1,12 +1,13 @@
 /** @jsx jsx */
-import { jsx } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
+var styles = css({
+  display: 'flex',
+  alignItems: 'center'
+});
 export var UnresolvedText = function UnresolvedText(_ref) {
   var icon = _ref.icon,
     text = _ref.text;
   return jsx("span", {
-    css: {
-      display: 'flex',
-      alignItems: 'center'
-    }
+    css: styles
   }, icon, text);
 };

package/dist/esm/view/BlockCard/views/ResolvedView.js

@@ -102,6 +102,7 @@ export var ResolvedView = function ResolvedView(_ref) {
     textColor: titleTextColor
   }), lozenge && jsx(LozengeBlockWrapper, {
     css: {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
       height: gs(2.5),
       display: 'flex',
       alignItems: 'center',

package/dist/esm/view/BlockCard/views/ResolvingView.js

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { jsx } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import DocumentFilledIcon from '@atlaskit/icon/glyph/document-filled';
 import { N50, N90 } from '@atlaskit/theme/colors';
 import { fontSize } from '@atlaskit/theme/constants';
@@ -14,6 +14,12 @@ import { gs } from '../../common/utils';
  * Using this selctor is deprecated as once the flexible block card feature flag is removed, this class will no longer be used.
  */
 export var blockCardResolvingViewClassName = 'block-card-resolving-view';
+var messageStyles = css({
+  fontSize: "".concat(fontSize(), "px"),
+  color: "var(--ds-text-subtlest, ".concat(N90, ")"),
+  // 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: gs(0.5)
+});
 export var ResolvingView = function ResolvingView(_ref) {
   var _ref$isSelected = _ref.isSelected,
     isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
@@ -33,11 +39,6 @@ export var ResolvingView = function ResolvingView(_ref) {
     primaryColor: "var(--ds-icon-subtle, ".concat(N50, ")"),
     label: "document-icon"
   }), jsx("span", {
-    css: {
-      fontSize: "".concat(fontSize(), "px"),
-      color: "var(--ds-text-subtlest, ".concat(N90, ")"),
-      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-      marginLeft: gs(0.5)
-    }
+    css: messageStyles
   }, jsx(FormattedMessage, messages.loading)));
 };

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

@@ -3,32 +3,45 @@ import { N40 } from '@atlaskit/theme/colors';
 
 // in editor prosemirror adds padding-left so we need to overwrite it
 // renderer overwrites the margin-right so we need to add it here
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var metadataBlockCss = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   'span[data-smart-element-avatar-group]': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '> ul': {
       paddingLeft: '0px',
       marginRight: "var(--ds-space-100, 0.5rem)"
     }
   },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '[data-smart-element-group]': {
     lineHeight: '1rem'
   }
 });
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var titleBlockCss = css({
   gap: "var(--ds-space-100, 0.5em)",
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   "[data-smart-element='Title']": {
     fontWeight: 600
   }
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var footerBlockCss = css({
   height: '1.5rem',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '.actions-button-group': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     'button, button:hover, button:focus, button:active': {
       fontSize: '0.875rem'
     }
   }
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var flexibleBlockCardStyle = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > div': {
     borderRadius: "var(--ds-border-radius-200, 8px)",
     border: "1px solid ".concat("var(--ds-border, ".concat(N40, ")"))

package/dist/esm/view/BlockCard/views/flexible/utils/withFlexibleUIBlockCardStyle.js

@@ -3,8 +3,11 @@ import { jsx } from '@emotion/react';
 import { flexibleBlockCardStyle } from '../styled';
 export var withFlexibleUIBlockCardStyle = function withFlexibleUIBlockCardStyle(FlexibleBlockCardView) {
   return function (props) {
-    return jsx("div", {
-      css: flexibleBlockCardStyle
-    }, jsx(FlexibleBlockCardView, props));
+    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
+      jsx("div", {
+        css: flexibleBlockCardStyle
+      }, jsx(FlexibleBlockCardView, props))
+    );
   };
 };

package/dist/esm/view/BlockCard/views/styled.js

@@ -1,7 +1,8 @@
 import styled from '@emotion/styled';
 // TODO: Replace overrides with proper AtlasKit solution.
-// 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
 export var LozengeBlockWrapper = styled.span({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > span': {
     marginLeft: "var(--ds-space-050, 4px)"
   }

package/dist/esm/view/EmbedCard/components/Frame.js

@@ -1,6 +1,6 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 /** @jsx jsx */
-import { jsx } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import React, { useEffect, useState, useRef } from 'react';
 import { di } from 'react-magnetic-di';
 import { getIframeSandboxAttribute } from '../../../utils';
@@ -17,6 +17,16 @@ function mergeRefs(refs) {
     });
   };
 }
+var iframeStyles = css({
+  border: 0,
+  top: 0,
+  left: 0,
+  width: '100%',
+  height: '100%',
+  position: 'relative',
+  overflow: 'hidden',
+  borderRadius: '3px'
+});
 export var Frame = /*#__PURE__*/React.forwardRef(function (_ref, iframeRef) {
   var url = _ref.url,
     _ref$isTrusted = _ref.isTrusted,
@@ -98,16 +108,7 @@ export var Frame = /*#__PURE__*/React.forwardRef(function (_ref, iframeRef) {
     src: url,
     "data-testid": "".concat(testId, "-frame"),
     "data-iframe-loaded": isIframeLoaded,
-    css: {
-      border: 0,
-      top: 0,
-      left: 0,
-      width: '100%',
-      height: '100%',
-      position: 'relative',
-      overflow: 'hidden',
-      borderRadius: '3px'
-    },
+    css: iframeStyles,
     onMouseEnter: function onMouseEnter() {
       return setMouseOver(true);
     },

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

@@ -66,12 +66,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
 export var LinkWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\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
 export var Wrapper = styled.div(function (props) {
   return wrapperStyles(props);
 }, {
@@ -81,7 +81,7 @@ export var Wrapper = styled.div(function (props) {
   marginTop: '10px'
 });
 export var 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
 export var Header = styled.div({
   height: "".concat(embedHeaderHeight, "px"),
   position: 'absolute',
@@ -89,18 +89,27 @@ export var Header = styled.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
-export var IconWrapper = styled.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
+export var IconWrapper = styled.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 '';
   }
@@ -108,28 +117,33 @@ export var IconWrapper = styled.div(borderRadius, csssize(16), function (_ref9)
   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
-export var TextWrapper = styled.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
+export var TextWrapper = styled.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
 export var TooltipWrapper = styled.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
 export var Content = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\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(N40, ")"), "var(--ds-surface-raised, white)", function (_ref11) {
   var allowScrollBar = _ref11.allowScrollBar,
     removeOverflow = _ref11.removeOverflow;
@@ -144,7 +158,7 @@ export var Content = styled.div(_templateObject2 || (_templateObject2 = _taggedT
   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
 export var Image = styled.img(function (_ref14) {
   var size = _ref14.size;
   return csssize(size);
@@ -153,7 +167,7 @@ export var Image = styled.img(function (_ref14) {
 });
 export var 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
 export var ContentWrapper = styled.div({
   display: 'flex',
   flexDirection: 'row',
@@ -161,8 +175,9 @@ export var ContentWrapper = styled.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
 export var Title = styled.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,
@@ -171,18 +186,22 @@ export var Title = styled.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
 export var Byline = styled.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
 export var Description = styled.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',
@@ -191,39 +210,43 @@ export var Description = styled.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
 export var ResolvedViewIconWrapper = styled.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
 export var Thumbnail = styled.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
 export var UsersWrapper = styled.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
 export var ActionsWrapper = styled.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
 export var AlertWrapper = styled.div({
   position: 'absolute',
   top: 0,

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

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { jsx } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import Button from '@atlaskit/button/custom-theme-button';
 import ErrorIcon from '@atlaskit/icon/glyph/error';
 import { fontSize } from '@atlaskit/theme/constants';
@@ -8,6 +8,21 @@ import { Frame } from '../../BlockCard/components/Frame';
 import { FormattedMessage } from 'react-intl-next';
 import { messages } from '../../../messages';
 import { gs } from '../../common/utils';
+var messageStyles = css({
+  fontSize: "".concat(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: 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: 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: gs(3)
+});
 export var EmbedCardErroredView = function EmbedCardErroredView(_ref) {
   var onRetry = _ref.onRetry,
     _ref$isSelected = _ref.isSelected,
@@ -25,20 +40,7 @@ export var EmbedCardErroredView = function EmbedCardErroredView(_ref) {
     primaryColor: "var(--ds-icon-danger, ".concat(R300, ")"),
     label: "error-icon"
   }), jsx("span", {
-    css: {
-      fontSize: "".concat(fontSize(), "px"),
-      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-      marginLeft: gs(0.5),
-      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
-      marginRight: gs(0.5),
-      display: '-webkit-box',
-      overflow: 'hidden',
-      textOverflow: 'ellipsis',
-      WebkitLineClamp: 1,
-      WebkitBoxOrient: 'vertical',
-      // Fallback options.
-      maxHeight: gs(3)
-    }
+    css: messageStyles
   }, jsx(FormattedMessage, messages.could_not_load_link)), jsx(Button, {
     testId: "err-view-retry",
     appearance: "link",

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

@@ -1,9 +1,13 @@
 import { css } from '@emotion/react';
 import { gs } from '../../../common/utils';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var containerStyles = 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
 export var contentStyles = css({
   display: 'flex',
   flexDirection: 'column',
@@ -12,19 +16,26 @@ export var contentStyles = 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: gs(50)
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var imageStyles = 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
 export var titleStyles = 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
 export var descriptionStyles = css({
   fontSize: '1em',
   textAlign: 'center'

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

@@ -69,26 +69,31 @@ var LinkInfo = function LinkInfo(_ref) {
       }))
     );
   }, [onResizeButtonClick, size, testId]);
-  return jsx("div", {
-    css: containerStyles
-  }, icon && jsx("div", {
-    css: iconCss,
-    "data-testid": "".concat(testId, "-icon")
-  }, jsx(Icon, icon)), jsx("div", {
-    css: titleCss
-  }, jsx("h3", {
-    "data-testid": "".concat(testId, "-title")
-  }, title), jsx("span", {
-    tabIndex: 0
-  })), jsx("div", {
-    css: actionCss
-  }, downloadButton, urlButton, sizeButton, jsx(LinkInfoButton, {
-    content: jsx(FormattedMessage, messages.preview_close),
-    icon: jsx(CrossIcon, {
-      label: 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
+    jsx("div", {
+      css: 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
+    jsx("div", {
+      css: iconCss,
+      "data-testid": "".concat(testId, "-icon")
+    }, jsx(Icon, icon)), jsx("div", {
+      css: titleCss
+    }, jsx("h3", {
+      "data-testid": "".concat(testId, "-title")
+    }, title), jsx("span", {
+      tabIndex: 0
+    })), jsx("div", {
+      css: actionCss
+    }, downloadButton, urlButton, sizeButton, jsx(LinkInfoButton, {
+      content: jsx(FormattedMessage, messages.preview_close),
+      icon: jsx(CrossIcon, {
+        label: messages.preview_close.defaultMessage
+      }),
+      onClick: onClose,
+      testId: "".concat(testId, "-close")
+    })))
+  );
 };
 export default LinkInfo;

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

@@ -1,4 +1,5 @@
 import { css } from '@emotion/react';
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var containerStyles = css({
   alignItems: 'center',
   display: 'flex',
@@ -13,7 +14,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
 export var iconCss = 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,
@@ -24,8 +27,10 @@ export var iconCss = 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
 export var titleCss = 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',
@@ -43,17 +48,21 @@ export var titleCss = css({
     }
   }
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var actionCss = 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'
     }