@atlaskit/smart-card 27.5.3 → 27.6.0

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

@@ -9,8 +9,10 @@ var getButtonStyle = function getButtonStyle(size, iconOnly) {
   switch (size) {
     case SmartLinkSize.Large:
       return iconOnly ? 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
           }
@@ -21,6 +23,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          "]
@@ -53,6 +56,7 @@ var ActionButton = function ActionButton(_ref) {
     };
   }, []);
   return 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")
   }, jsx(Tooltip, {

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

@@ -16,14 +16,17 @@ var getIconWidth = function getIconWidth(size) {
 };
 var getIconStyles = function getIconStyles(isDisabled) {
   return 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 = 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 = 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
   }
@@ -35,7 +38,11 @@ var ActionIcon = function ActionIcon(_ref) {
     isDisabled = _ref.isDisabled,
     asStackItemIcon = _ref.asStackItemIcon;
   return jsx("span", {
-    css: [getIconStyles(isDisabled), asStackItemIcon ? stackItemIconStyles : 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 : getIconSizeStyles(getIconWidth(size))],
     "data-testid": "".concat(testId, "-icon")
   }, icon);
 };

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

@@ -10,6 +10,7 @@ var buttonStyles = 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/esm/view/FlexibleCard/components/actions/view-related-links-action/index.js

@@ -1,4 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["onClick"];
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import Action from '../action';
@@ -6,13 +8,35 @@ import { FormattedMessage } from 'react-intl-next';
 import { messages } from '../../../../../messages';
 import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
 import RelatedLinksActionIcon from './related-links-action-icon';
-var ViewRelatedLinksAction = function ViewRelatedLinksAction(props) {
+import { lazy, useCallback } from 'react';
+import { useSmartLinkModal } from '../../../../../state/modal';
+var RelatedLinksModal = /*#__PURE__*/lazy(function () {
+  return import( /* webpackChunkName: "@atlaskit-internal_smartcard-RelatedLinksModal" */'../../../../RelatedLinksModal');
+});
+var ViewRelatedLinksAction = function ViewRelatedLinksAction(_ref) {
   var _context$actions;
+  var onClickCallback = _ref.onClick,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var modal = useSmartLinkModal();
   var context = useFlexibleUiContext();
   var actionData = context === null || context === void 0 || (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions.ViewRelatedLinksAction;
+  var onClick = useCallback(function () {
+    var url = actionData === null || actionData === void 0 ? void 0 : actionData.url;
+    if (url) {
+      modal.open(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 ? jsx(Action, _extends({
     content: jsx(FormattedMessage, messages.related_links_view_related_urls),
     icon: jsx(RelatedLinksActionIcon, 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/esm/view/FlexibleCard/components/blocks/action-block/index.js

@@ -77,7 +77,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: xcss({
           paddingInline: padding
         }),

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

@@ -22,8 +22,10 @@ import { di } from 'react-magnetic-di';
 var styles = 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/esm/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/ai-state-done.js

@@ -20,6 +20,7 @@ var tooltipMsgStyles = xcss({
 });
 var iconTooltipLinkStyles = 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/esm/view/FlexibleCard/components/blocks/ai-summary-block/feature-discovery/index.js

@@ -36,10 +36,13 @@ var FeatureDiscovery = function FeatureDiscovery(_ref) {
   }, [storageClient, discovered]);
   var component = useMemo(function () {
     if (!discovered) {
-      return jsx("span", {
-        css: 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
+        jsx("span", {
+          css: getPulseStyles(),
+          "data-testid": "".concat(testId, "-discovery")
+        }, children)
+      );
     }
   }, [children, discovered, testId]);
   return component !== null && component !== void 0 ? component : children;

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

@@ -145,7 +145,9 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
      */,
     overrideCss: 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.createElement(AIEventSummaryViewed, {
     fromCache: isSummarisedOnMountRef.current
   }), /*#__PURE__*/React.createElement(MotionWrapper, {

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

@@ -34,6 +34,7 @@ var Block = function Block(_ref) {
     onRender && onRender();
   }, [onRender]);
   return 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,

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

@@ -28,17 +28,23 @@ var getGapStyles = function getGapStyles(size, align) {
   var gap = getGapSize(size);
   if (align === SmartLinkAlignment.Right) {
     return css({
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
       '> span': {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
         marginLeft: "".concat(gap, "rem")
       },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
       '> span:first-child': {
         marginLeft: 'initial'
       }
     });
   }
   return css({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '> span': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
       marginRight: "".concat(gap, "rem"),
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
       '&:last-child': {
         marginRight: 'initial'
       }
@@ -51,9 +57,19 @@ var getHorizontalDirectionStyles = function getHorizontalDirectionStyles(size, a
   return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\t\tdisplay: block;\n\t\tvertical-align: middle;\n\t\t", "\n\n\t\t> span, > div {\n\t\t\tvertical-align: middle;\n\n\t\t\t&[data-smart-element-date-time],\n\t\t\t&[data-smart-element-text] {\n\t\t\t\t// Show all/wrapped/truncated\n\t\t\t\tdisplay: inline;\n\t\t\t}\n\t\t}\n\n\t\t", "\n\t"])), getTruncateStyles(1, lineHeight + 'rem'), getGapStyles(size, align));
 };
 export var getElementGroupStyles = function getElementGroupStyles(direction, size, align, width, position) {
-  return css(getBaseStyles(direction, size), getAlignmentStyles(align), {
+  return css(
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  getBaseStyles(direction, size),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  getAlignmentStyles(align), {
     minWidth: '10%'
-  }, width === SmartLinkWidth.Flexible ? "flex: 1 3;" : '', direction === SmartLinkDirection.Horizontal ? getHorizontalDirectionStyles(size, align) : '', position === SmartLinkPosition.Top ? 'align-self: flex-start;' : '');
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+  width === SmartLinkWidth.Flexible ? "flex: 1 3;" : '',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+  direction === SmartLinkDirection.Horizontal ? getHorizontalDirectionStyles(size, align) : '',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+  position === SmartLinkPosition.Top ? 'align-self: flex-start;' : '');
 };
 
 /**
@@ -79,6 +95,7 @@ var ElementGroup = function ElementGroup(_ref) {
     _ref$position = _ref.position,
     position = _ref$position === void 0 ? SmartLinkPosition.Center : _ref$position;
   return jsx("div", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: [getElementGroupStyles(direction, size, align, width, position), overrideCss],
     "data-smart-element-group": true,
     "data-testid": testId

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

@@ -18,8 +18,11 @@ var getElementGroupStyles = function getElementGroupStyles(size, maxLines) {
   // sides so they line up nicely.
   var lineHeight = getMaxLineHeight(size);
   return css({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     lineHeight: "".concat(lineHeight, "rem")
-  }, getTruncateStyles(maxLines, lineHeight + 'rem'));
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  getTruncateStyles(maxLines, lineHeight + 'rem'));
 };
 var getMaxLines = function getMaxLines(maxLines) {
   if (maxLines > MAXIMUM_MAX_LINES) {

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

@@ -36,9 +36,11 @@ var getPreviewBlockStyles = function getPreviewBlockStyles(placement, ignoreCont
     return css({
       marginLeft: 'calc(var(--container-gap-left) * -1)',
       marginRight: 'calc(var(--container-gap-right) * -1)',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
       '&:first-of-type': {
         marginTop: 'calc(var(--container-padding) * -1)'
       },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
       '&:last-of-type': {
         marginBottom: 'calc(var(--container-padding) * -1)'
       }
@@ -66,6 +68,7 @@ var PreviewBlockResolvedView = function PreviewBlockResolvedView(_ref) {
     styles = _useState2[0],
     setStyles = _useState2[1];
   var updateStyles = useCallback(function () {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     setStyles(css(getPreviewBlockStyles(placement, ignoreContainerPadding), overrideCss));
   }, [ignoreContainerPadding, overrideCss, placement]);
   useEffect(function () {

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

@@ -12,6 +12,7 @@ import { getLinkLineHeight, getLinkSizeStyles, getTruncateStyles } from '../../.
 import ElementGroup from '../../element-group';
 var actionStyles = css({
   cursor: 'pointer',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   ':hover': {
     color: "var(--ds-text-subtle, #8993A4)",
     textDecoration: 'underline'
@@ -22,8 +23,15 @@ var getMessageStyles = function getMessageStyles(size, hasAction) {
   return css({
     flex: '1 1 auto',
     justifyContent: 'flex-end'
-  }, hasAction ? actionStyles : '', sizeStyles, getTruncateStyles(1, getLinkLineHeight(size)), {
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  hasAction ? actionStyles : '',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  sizeStyles,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  getTruncateStyles(1, getLinkLineHeight(size)), {
     color: "var(--ds-text-disabled, #6B778C)",
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
     ':focus': {
       outline: "var(--ds-border-focused, #388BFF)".concat(" solid 2px")
     }
@@ -63,7 +71,9 @@ var TitleBlockErroredView = function TitleBlockErroredView(_ref) {
     align: SmartLinkAlignment.Right
   }, jsx("span", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: hasAction ? 'has-action' : '',
+    className: hasAction ? 'has-action' : ''
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
+    ,
     css: getMessageStyles(size, hasAction),
     onClick: onClick,
     "data-testid": "".concat(testId, "-errored-view-message"),

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

@@ -14,9 +14,11 @@ import { Title } from '../../elements';
 var getActionStyles = function getActionStyles(showOnHover, isOpen) {
   if (showOnHover && !isOpen) {
     return css({
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
       '.actions-button-group': {
         opacity: 0
       },
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
       '&:hover .actions-button-group, .actions-button-group:focus-within': {
         opacity: 1
       }
@@ -95,6 +97,7 @@ var TitleBlock = function TitleBlock(_ref) {
     onDropdownOpenChange: onDropdownOpenChange
   });
   var actionStyles = getActionStyles(showActionOnHover, actionDropdownOpen);
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   var combinedCss = css(actionStyles, overrideCss);
   var overrideText = !!text ? {
     text: text

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

@@ -27,7 +27,9 @@ var TitleBlockResolvingView = function TitleBlockResolvingView(_ref) {
   var iconStyles = getIconSizeStyles(iconWidth);
   return jsx(Block, _extends({}, blockProps, {
     testId: "".concat(testId, "-resolving-view")
-  }), !hideIcon && jsx("span", {
+  }), !hideIcon &&
+  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
+  jsx("span", {
     css: iconStyles,
     "data-testid": "".concat(testId, "-icon")
   }, jsx(LoadingSkeleton, {

package/dist/esm/view/FlexibleCard/components/blocks/utils.js

@@ -54,24 +54,29 @@ export var getBaseStyles = function getBaseStyles(direction, size) {
   return css({
     alignItems: 'center',
     display: 'flex',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     gap: "".concat(getGapSize(size), "rem"),
     lineHeight: '1rem',
     minWidth: 0,
     overflow: 'hidden'
-  }, getDirectionStyles(direction), {
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  getDirectionStyles(direction), {
     '&:empty': {
       display: 'none'
     },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '& > *': {
       minWidth: 0
     },
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '& > [data-fit-to-content]': {
       minWidth: 'fit-content'
     }
   });
 };
 
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 export var highlightRemoveStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\toutline: none !important;\n\toutline-color: inherit;\n\tcolor: inherit;\n\t-webkit-tap-highlight-color: transparent;\n\t-webkit-touch-callout: none;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tuser-select: none;\n"])));
 var isActionGroup = function isActionGroup(node) {
   return /*#__PURE__*/React.isValidElement(node) && node.type === ActionGroup;

package/dist/esm/view/FlexibleCard/components/common/loading-skeleton/index.js

@@ -14,7 +14,9 @@ var LoadingSkeleton = function LoadingSkeleton(_ref) {
     }
   });
   var styles = css({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     width: "".concat(width, "rem"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     height: "".concat(height, "rem"),
     borderRadius: '2px',
     userSelect: 'none',

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

@@ -49,6 +49,7 @@ var getPadding = function getPadding(size) {
   }
 };
 var clickableContainerStyles = css({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   'a, button, .has-action': {
     position: 'relative',
     zIndex: 1
@@ -60,12 +61,20 @@ var getContainerPaddingStyles = function getContainerPaddingStyles(size, hidePad
   var previewOnLeft = childrenOptions.previewOnLeft,
     previewOnRight = childrenOptions.previewOnRight;
   return css({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     '--container-padding': padding,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     '--container-gap-left': previewOnLeft ? gap : padding,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     '--container-gap-right': previewOnRight ? gap : padding,
     '--preview-block-width': '30%',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     padding: padding
-  }, previewOnLeft ? "padding-left: calc(var(--preview-block-width) + ".concat(gap, ");") : '', previewOnRight ? "padding-right: calc(var(--preview-block-width) + ".concat(gap, ");") : '');
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  previewOnLeft ? "padding-left: calc(var(--preview-block-width) + ".concat(gap, ");") : '',
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  previewOnRight ? "padding-right: calc(var(--preview-block-width) + ".concat(gap, ");") : '');
 };
 var getChildrenOptions = function getChildrenOptions(children, context) {
   var options = {};
@@ -182,6 +191,7 @@ var Container = function Container(_ref3) {
   // unresolved link (unauthorized, forbidden, not found, etc.)
   var canShowAuthTooltip = showAuthTooltip && status === 'unauthorized' && retry !== undefined;
   var container = jsx("div", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: getContainerStyles(size, hideBackground, hideElevation, hidePadding, clickableContainer, childrenOptions),
     "data-smart-link-container": true,
     "data-testid": testId

package/dist/esm/view/FlexibleCard/components/container/layered-link/index.js

@@ -14,6 +14,7 @@ var styles = css({
   whiteSpace: 'nowrap',
   // Needs a heightened specificity to trump other anchor.
   // Stack it under all other links in the post text.
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   'a&.layered-link': {
     position: 'absolute',
     zIndex: 0
@@ -28,7 +29,9 @@ var styles = css({
   // iterations of the second element, that are following the first element
   // (though not necessarily immediately), and are children of the same parent
   // element.
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&:hover ~ *': {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '.actions-button-group': {
       opacity: 1
     }

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

@@ -23,6 +23,7 @@ var AtlaskitBadge = function AtlaskitBadge(_ref) {
     return null;
   }
   return jsx("span", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: [badgeStyles, overrideCss],
     "data-fit-to-content": true,
     "data-smart-element": name,

package/dist/esm/view/FlexibleCard/components/elements/avatar-group/index.js

@@ -17,6 +17,7 @@ var MAX_COUNT = 4;
 var getStyles = function getStyles(size) {
   var styles = css({
     display: 'inline-flex',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     ul: {
       marginRight: "var(--ds-space-100, 0.5rem)",
       marginTop: 0
@@ -96,6 +97,7 @@ var AvatarGroup = function AvatarGroup(_ref) {
     return null;
   }
   return jsx("span", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: [getStyles(size), overrideCss],
     "data-fit-to-content": true,
     "data-smart-element": name,

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

@@ -15,7 +15,7 @@ var badgeStyles = css({
   minWidth: 'fit-content'
 });
 
-// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
+// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
 var iconStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\tcolor: ", ";\n\tline-height: 0;\n\tvertical-align: middle;\n\t", "\n\timg,\n  span,\n  svg {\n\t\tline-height: 0;\n\t\tvertical-align: middle;\n\t}\n"])), "var(--ds-icon-subtle, #626F86)", getIconSizeStyles('1rem'));
 var labelStyles = css({
   color: "var(--ds-text-subtlest, #626F86)",
@@ -82,6 +82,7 @@ var Badge = function Badge(_ref) {
     return null;
   }
   return jsx("span", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: [badgeStyles, overrideCss],
     "data-fit-to-content": true,
     "data-smart-element": name,

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

@@ -10,7 +10,9 @@ var styles = css({
   color: "var(--ds-text-subtlest, #626F86)",
   fontSize: '0.75rem',
   lineHeight: '1rem'
-}, getTruncateStyles(1));
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+getTruncateStyles(1));
 var typeToDescriptorMap = {
   created: {
     relative: messages.created_on_relative,
@@ -68,6 +70,7 @@ var DateTime = function DateTime(_ref) {
     });
   }
   return jsx("span", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: [styles, overrideCss],
     "data-separator": true,
     "data-smart-element": name,

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

@@ -21,21 +21,30 @@ var getPositionStyles = function getPositionStyles(position) {
   }
 };
 var getIconStyles = function getIconStyles(position, width) {
-  return css(getPositionStyles(position), getIconSizeStyles(width));
+  return (
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    css(getPositionStyles(position), getIconSizeStyles(width))
+  );
 };
 var getCustomRenderStyles = function getCustomRenderStyles(value) {
-  return css(getTruncateStyles(1, value), {
-    lineHeight: value,
-    fontSize: value,
-    textAlign: 'center',
-    textOverflow: 'clip',
-    WebkitBoxOrient: 'unset',
-    span: {
-      margin: 0,
-      padding: 0,
-      verticalAlign: 'baseline'
-    }
-  });
+  return (
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+    css(getTruncateStyles(1, value), {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      lineHeight: value,
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+      fontSize: value,
+      textAlign: 'center',
+      textOverflow: 'clip',
+      WebkitBoxOrient: 'unset',
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+      span: {
+        margin: 0,
+        padding: 0,
+        verticalAlign: 'baseline'
+      }
+    })
+  );
 };
 var renderAtlaskitIcon = function renderAtlaskitIcon(icon, label, testId) {
   if (icon) {

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

@@ -18,6 +18,7 @@ var getThemeStyles = function getThemeStyles(theme) {
       // We are being specifc with the CSS selectors to ensure that Confluence overrides
       // do not affect our internal Smart Card styles
       return css({
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
         'a&': {
           color: "var(--ds-text-subtlest, #626F86)",
           '&:active, &:visited, &:focus, &:hover': {
@@ -31,9 +32,11 @@ var getThemeStyles = function getThemeStyles(theme) {
     case SmartLinkTheme.Black:
       return css({
         color: "var(--ds-text-subtle, #44546F)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
         ':active': {
           color: "var(--ds-text, #172B4D)"
         },
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
         ':hover': {
           color: "var(--ds-text-subtle, #44546F)",
           textDecoration: 'underline'
@@ -43,9 +46,11 @@ var getThemeStyles = function getThemeStyles(theme) {
     default:
       return css({
         color: "var(--ds-link, #0C66E4)",
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
         ':active': {
           color: "var(--ds-link-pressed, #0055CC)"
         },
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
         ':hover': {
           color: "var(--ds-link, #0C66E4)",
           textDecoration: 'underline'
@@ -57,7 +62,13 @@ var getAnchorStyles = function getAnchorStyles(size, theme, maxLines, hasSpace)
   var sizeStyles = getLinkSizeStyles(size);
   return css({
     flex: '1 1 auto'
-  }, sizeStyles, getTruncateStyles(maxLines, getLinkLineHeight(size), hasSpace ? 'break-word' : 'break-all'), getThemeStyles(theme));
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  sizeStyles,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  getTruncateStyles(maxLines, getLinkLineHeight(size), hasSpace ? 'break-word' : 'break-all'),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  getThemeStyles(theme));
 };
 var getMaxLines = function getMaxLines(maxLines) {
   if (maxLines > MAXIMUM_MAX_LINES) {
@@ -104,6 +115,7 @@ var Link = function Link(_ref) {
     return text ? hasWhiteSpace(text) : false;
   }, [text]);
   var anchor = jsx("a", _extends({
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: [getAnchorStyles(size, theme, getMaxLines(maxLines), hasSpace), overrideCss],
     "data-smart-element": name,
     "data-smart-element-link": true,

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

@@ -43,6 +43,7 @@ var Lozenge = function Lozenge(_ref) {
     testId: "".concat(testId, "-lozenge")
   }, text);
   return jsx("span", {
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     css: [styles, overrideCss],
     "data-fit-to-content": true,
     "data-smart-element": name,