@atlaskit/smart-card 27.5.4 → 27.6.1

package/dist/cjs/view/FlexibleCard/components/utils.js

@@ -17,7 +17,7 @@ var _icon = _interopRequireDefault(require("./elements/icon"));
 var _utils = require("../../EmbedModal/utils");
 var _reactLoadable = _interopRequireDefault(require("react-loadable"));
 var _excluded = ["linkIcon"];
-var _sizeToButtonSpacing, _templateObject;
+var _sizeToButtonSpacing, _templateObject; // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 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) { (0, _defineProperty2.default)(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; }
 var sizeToButtonSpacing = exports.sizeToButtonSpacing = (_sizeToButtonSpacing = {}, (0, _defineProperty2.default)(_sizeToButtonSpacing, _constants.SmartLinkSize.Small, 'none'), (0, _defineProperty2.default)(_sizeToButtonSpacing, _constants.SmartLinkSize.Medium, 'compact'), (0, _defineProperty2.default)(_sizeToButtonSpacing, _constants.SmartLinkSize.Large, 'compact'), (0, _defineProperty2.default)(_sizeToButtonSpacing, _constants.SmartLinkSize.XLarge, 'default'), _sizeToButtonSpacing);
@@ -38,11 +38,17 @@ var getFormattedMessageAsString = exports.getFormattedMessageAsString = function
 };
 var getIconDimensionStyles = function getIconDimensionStyles(value) {
   return (0, _react2.css)({
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     height: value,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     minHeight: value,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     maxHeight: value,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     width: value,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     minWidth: value,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     maxWidth: value
   });
 };
@@ -94,6 +100,7 @@ var getLinkSizeStyles = exports.getLinkSizeStyles = function getLinkSizeStyles(s
         fontSize: '1.25rem',
         fontWeight: 400,
         letterSpacing: '-0.008em',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
         lineHeight: getLinkLineHeight(size)
       });
     case _constants.SmartLinkSize.Large:
@@ -102,6 +109,7 @@ var getLinkSizeStyles = exports.getLinkSizeStyles = function getLinkSizeStyles(s
         fontSize: '0.875rem',
         fontWeight: 400,
         letterSpacing: '-0.003em',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
         lineHeight: getLinkLineHeight(size)
       });
     case _constants.SmartLinkSize.Small:
@@ -110,6 +118,7 @@ var getLinkSizeStyles = exports.getLinkSizeStyles = function getLinkSizeStyles(s
         fontSize: '0.75rem',
         fontWeight: 400,
         letterSpacing: '0em',
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
         lineHeight: getLinkLineHeight(size)
       });
   }
@@ -179,10 +188,13 @@ var getTruncateStyles = exports.getTruncateStyles = function getTruncateStyles(m
     display: '-webkit-box',
     overflow: 'hidden',
     textOverflow: 'ellipsis',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     wordBreak: wordBreak,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     WebkitLineClamp: maxLines,
     WebkitBoxOrient: 'vertical',
     '@supports not (-webkit-line-clamp: 1)': {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
       maxHeight: "calc(".concat(maxLines, " * ").concat(lineHeight, ")")
     }
   });

package/dist/cjs/view/HoverCard/components/ContentContainer.js

@@ -14,39 +14,21 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _styled = require("../styled");
 var _aiPrism = _interopRequireDefault(require("../../common/ai-prism"));
 var _HoverCardContent = require("./HoverCardContent");
-var _useAiSummary = require("../../../state/hooks/use-ai-summary");
-var _store = require("../../../state/store");
-var _linkProvider = require("@atlaskit/link-provider");
-var _linkExtractors = require("@atlaskit/link-extractors");
+var _useAiSummaryAction = _interopRequireDefault(require("../../../state/hooks/use-ai-summary-action"));
 var _reactMagneticDi = require("react-magnetic-di");
 var _excluded = ["children", "isAIEnabled", "testId", "url"],
   _excluded2 = ["children", "isAIEnabled", "testId", "url"];
 /** @jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var ConnectedAIPrismContainer = function ConnectedAIPrismContainer(_ref) {
-  var _cardState$details;
   var children = _ref.children,
     _ref$isAIEnabled = _ref.isAIEnabled,
     isAIEnabled = _ref$isAIEnabled === void 0 ? false : _ref$isAIEnabled,
     testId = _ref.testId,
     url = _ref.url,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var cardState = (0, _store.useSmartCardState)(url);
-  var data = cardState === null || cardState === void 0 || (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
-
-  //The data is undefined while the link is resolving.
-  var dataUrl = data ? (0, _linkExtractors.extractLink)(data) : null;
-  var dataAri = data ? (0, _linkExtractors.extractAri)(data) : null;
-  var _useSmartLinkContext = (0, _linkProvider.useSmartLinkContext)(),
-    product = _useSmartLinkContext.product,
-    connections = _useSmartLinkContext.connections;
-  var _useAISummary = (0, _useAiSummary.useAISummary)({
-      url: dataUrl || '',
-      ari: dataAri || '',
-      product: product,
-      envKey: connections.client.envKey,
-      baseUrl: connections.client.baseUrlOverride
-    }),
-    status = _useAISummary.state.status;
+  var _useAISummaryAction = (0, _useAiSummaryAction.default)(url),
+    status = _useAISummaryAction.state.status;
   var _useState = (0, _react2.useState)(status === 'loading'),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     showPrism = _useState2[0],
@@ -56,7 +38,9 @@ var ConnectedAIPrismContainer = function ConnectedAIPrismContainer(_ref) {
   }, [status]);
   var container = (0, _react.jsx)("div", (0, _extends2.default)({
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: _HoverCardContent.hoverCardClassName,
+    className: _HoverCardContent.hoverCardClassName
+    // 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: [_styled.HoverCardContainer, !isAIEnabled ? _styled.popupContainerStyles : undefined],
     "data-testid": testId
   }, props), children);
@@ -81,7 +65,9 @@ var ContentContainer = function ContentContainer(_ref2) {
   }
   return (0, _react.jsx)("div", (0, _extends2.default)({
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: _HoverCardContent.hoverCardClassName,
+    className: _HoverCardContent.hoverCardClassName
+    // 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: _styled.HoverCardContainer,
     "data-testid": testId
   }, props), children);

package/dist/cjs/view/HoverCard/components/CustomPopupContainer.js

@@ -13,6 +13,7 @@ var _styled = require("../styled");
 var _react2 = require("@emotion/react");
 var _excluded = ["children"];
 /** @jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 /**
  * The purpose of this component is to hide the default Popup border.
  * HoverCard border implementation is in ContentContainer where it can
@@ -22,7 +23,11 @@ var CustomPopupContainer = /*#__PURE__*/_react.default.forwardRef(function (_ref
   var children = _ref.children,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return (0, _react2.jsx)("div", (0, _extends2.default)({
-    css: (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.hover-card-ai-summaries') ? undefined : _styled.popupContainerStyles
+    css:
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.hover-card-ai-summaries') ? undefined :
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    _styled.popupContainerStyles
   }, props, {
     ref: ref
   }), children);

package/dist/cjs/view/HoverCard/components/HoverCardComponent.js

@@ -26,6 +26,8 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(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 */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 var HOVER_CARD_SOURCE = 'smartLinkPreviewHoverCard';
 var FADE_IN_DELAY = 500;
 var FADE_OUT_DELAY = 300;

package/dist/cjs/view/HoverCard/components/HoverCardContent.js

@@ -35,6 +35,8 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(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 */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 var hoverCardClassName = exports.hoverCardClassName = 'smart-links-hover-preview';
 var getCopyAction = exports.getCopyAction = function getCopyAction(url) {
   return {

package/dist/cjs/view/HoverCard/components/ImagePreview.js

@@ -13,6 +13,8 @@ var _blocks = require("../../FlexibleCard/components/blocks");
 var _styled = require("../styled");
 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" != _typeof(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; }
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 var ImagePreview = function ImagePreview(_ref) {
   var data = _ref.data,
     fallbackElementHeight = _ref.fallbackElementHeight;

package/dist/cjs/view/HoverCard/components/views/forbidden/styled.js

@@ -5,12 +5,18 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.titleBlockStyles = exports.mainTextStyles = exports.connectButtonStyles = void 0;
 var _react = require("@emotion/react");
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 var titleFontWeight = '600';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var titleBlockStyles = exports.titleBlockStyles = (0, _react.css)({
   justifyContent: 'center',
   fontWeight: titleFontWeight,
   marginTop: "var(--ds-space-100, 8px)"
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var mainTextStyles = exports.mainTextStyles = (0, _react.css)({
   display: 'inline',
   justifyContent: 'center',
@@ -18,6 +24,8 @@ var mainTextStyles = exports.mainTextStyles = (0, _react.css)({
   fontSize: '0.75rem',
   textAlign: 'center'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var connectButtonStyles = exports.connectButtonStyles = (0, _react.css)({
   justifyContent: 'center',
   marginTop: "var(--ds-space-100, 8px)"

package/dist/cjs/view/HoverCard/components/views/resolved/index.js

@@ -19,9 +19,7 @@ var _messages = require("../../../../../messages");
 var _reactIntlNext = require("react-intl-next");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _helpers = require("../../../../../state/helpers");
-var _useAiSummary = require("../../../../../state/hooks/use-ai-summary");
-var _linkExtractors = require("@atlaskit/link-extractors");
-var _linkProvider = require("@atlaskit/link-provider");
+var _useAiSummaryAction = _interopRequireDefault(require("../../../../../state/hooks/use-ai-summary-action"));
 var _reactMagneticDi = require("react-magnetic-di");
 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" != _typeof(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; }
@@ -60,26 +58,15 @@ var toFooterActions = exports.toFooterActions = function toFooterActions(cardAct
   return [followAction].concat((0, _toConsumableArray2.default)(actions));
 };
 
-//This component encapsulates useAISummary hook under the AI Summary FF 'platform.linking-platform.smart-card.hover-card-ai-summaries'
+//This component encapsulates useAISummarySmartLink hook under the AI Summary FF 'platform.linking-platform.smart-card.hover-card-ai-summaries'
 var ConnectedAIBlock = function ConnectedAIBlock(_ref) {
   var bottomPrimary = _ref.bottomPrimary,
     imagePreview = _ref.imagePreview,
-    data = _ref.data;
-  var dataUrl = data ? (0, _linkExtractors.extractLink)(data) : null;
-  var dataAri = data ? (0, _linkExtractors.extractAri)(data) : null;
-  var _useSmartLinkContext = (0, _linkProvider.useSmartLinkContext)(),
-    product = _useSmartLinkContext.product,
-    connections = _useSmartLinkContext.connections;
-  var _useAISummary = (0, _useAiSummary.useAISummary)({
-      url: dataUrl || '',
-      ari: dataAri || '',
-      product: product,
-      envKey: connections.client.envKey,
-      baseUrl: connections.client.baseUrlOverride
-    }),
-    _useAISummary$state = _useAISummary.state,
-    status = _useAISummary$state.status,
-    content = _useAISummary$state.content;
+    url = _ref.url;
+  var _useAISummaryAction = (0, _useAiSummaryAction.default)(url),
+    _useAISummaryAction$s = _useAISummaryAction.state,
+    status = _useAISummaryAction$s.status,
+    content = _useAISummaryAction$s.content;
   var showData = status === 'ready' || status === 'error' ||
   // Description & bottom metadata should only disappear when we start getting summary content
   !content && status === 'loading';
@@ -164,7 +151,7 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref2) {
   }, /*#__PURE__*/_react.default.createElement(ConnectedAIBlock, {
     imagePreview: !!imagePreview,
     bottomPrimary: tertiary,
-    data: data
+    url: url
   })), !isAISummaryEnabled && !imagePreview && /*#__PURE__*/_react.default.createElement(_blocks.SnippetBlock, {
     status: _constants.SmartLinkStatus.Resolved
   }), /*#__PURE__*/_react.default.createElement(_blocks.SnippetBlock, {

package/dist/cjs/view/HoverCard/components/views/resolved/styled.js

@@ -8,14 +8,18 @@ exports.metadataBlockCss = exports.hiddenSnippetStyles = exports.footerBlockCss
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = require("@emotion/react");
 var _styled = require("../../../styled");
-var _templateObject;
+var _templateObject; // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var elementGap = '0.5rem';
 
-// 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
 var metadataBlockCss = exports.metadataBlockCss = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\tgap: 0px;\n\t/* primary element group */\n\t[data-smart-element-group]:nth-of-type(1) {\n\t\tflex-grow: 7;\n\n\t\t// a separator between text-based element\n\t\t", "\n\n\t\t/* horizontal spacing between elements in group */\n    > span {\n\t\t\tmargin-right: ", ";\n\t\t}\n\t}\n\t/* secondary element group */\n\t[data-smart-element-group]:nth-of-type(2) {\n\t\tflex-grow: 3;\n\t\t/* horizontal spacing between elements in group */\n\t\t> span {\n\t\t\tmargin-left: ", ";\n\t\t}\n\t}\n\n\t[data-smart-element-group] {\n\t\tline-height: 1rem;\n\t}\n"])), _styled.separatorCss, elementGap, elementGap);
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var footerBlockCss = exports.footerBlockCss = (0, _react.css)({
   height: '1.5rem'
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var hiddenSnippetStyles = exports.hiddenSnippetStyles = (0, _react.css)({
   visibility: 'hidden',
   position: 'absolute'

package/dist/cjs/view/HoverCard/components/views/resolving/index.js

@@ -15,6 +15,7 @@ var _actionGroup = _interopRequireDefault(require("../../../../FlexibleCard/comp
 var _blocks = require("../../../../FlexibleCard/components/blocks");
 var _icon = _interopRequireDefault(require("../../../../FlexibleCard/components/elements/icon"));
 /** @jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
 var HoverCardLoadingView = function HoverCardLoadingView(_ref) {
   var titleBlockProps = _ref.titleBlockProps;
@@ -27,33 +28,36 @@ var HoverCardLoadingView = function HoverCardLoadingView(_ref) {
     items: actions,
     visibleButtonsNum: 2
   });
-  return (0, _react.jsx)("div", {
-    css: _styled2.loadingViewContainer,
-    "data-testid": testId
-  }, (0, _react.jsx)("div", {
-    css: _styled2.skeletonContainer
-  }, (0, _react.jsx)(_blocks.CustomBlock, (0, _extends2.default)({}, titleBlockProps, {
-    overrideCss: _styled2.titleBlockStyles,
-    testId: "".concat(testId, "-title-block")
-  }), (0, _react.jsx)(_icon.default, {
-    render: function render() {
-      return (0, _react.jsx)(_loadingSkeleton.default, null);
-    },
-    size: size
-  }), (0, _react.jsx)("span", {
-    css: (0, _styled2.getTitleStyles)(lineHeightRem),
-    "data-testid": "".concat(testId, "-title")
-  }, (0, _react.jsx)(_loadingSkeleton.default, {
-    height: lineHeightRem
-  })), actionGroup), (0, _react.jsx)(_loadingSkeleton.default, {
-    width: skeletonWidth,
-    height: lineHeightRem
-  }), (0, _react.jsx)(_loadingSkeleton.default, {
-    width: skeletonWidth,
-    height: lineHeightRem * 3
-  }), (0, _react.jsx)(_loadingSkeleton.default, {
-    width: skeletonWidth,
-    height: lineHeightRem
-  })));
+  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: _styled2.loadingViewContainer,
+      "data-testid": testId
+    }, (0, _react.jsx)("div", {
+      css: _styled2.skeletonContainer
+    }, (0, _react.jsx)(_blocks.CustomBlock, (0, _extends2.default)({}, titleBlockProps, {
+      overrideCss: _styled2.titleBlockStyles,
+      testId: "".concat(testId, "-title-block")
+    }), (0, _react.jsx)(_icon.default, {
+      render: function render() {
+        return (0, _react.jsx)(_loadingSkeleton.default, null);
+      },
+      size: size
+    }), (0, _react.jsx)("span", {
+      css: (0, _styled2.getTitleStyles)(lineHeightRem),
+      "data-testid": "".concat(testId, "-title")
+    }, (0, _react.jsx)(_loadingSkeleton.default, {
+      height: lineHeightRem
+    })), actionGroup), (0, _react.jsx)(_loadingSkeleton.default, {
+      width: skeletonWidth,
+      height: lineHeightRem
+    }), (0, _react.jsx)(_loadingSkeleton.default, {
+      width: skeletonWidth,
+      height: lineHeightRem * 3
+    }), (0, _react.jsx)(_loadingSkeleton.default, {
+      width: skeletonWidth,
+      height: lineHeightRem
+    })))
+  );
 };
 var _default = exports.default = HoverCardLoadingView;

package/dist/cjs/view/HoverCard/components/views/resolving/styled.js

@@ -5,11 +5,16 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.titleBlockStyles = exports.skeletonContainer = exports.loadingViewContainer = exports.getTitleStyles = void 0;
 var _react = require("@emotion/react");
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var loadingViewContainer = exports.loadingViewContainer = (0, _react.css)({
   display: 'flex',
   flexDirection: 'column',
   padding: "var(--ds-space-200, 1rem)"
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var skeletonContainer = exports.skeletonContainer = (0, _react.css)({
   display: 'flex',
   flexDirection: 'column',
@@ -20,12 +25,16 @@ var skeletonContainer = exports.skeletonContainer = (0, _react.css)({
 var getTitleStyles = exports.getTitleStyles = function getTitleStyles(height) {
   return (0, _react.css)({
     flex: '1 0 auto',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     height: "".concat(height, "rem"),
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     span: {
       width: '100%'
     }
   });
 };
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var titleBlockStyles = exports.titleBlockStyles = (0, _react.css)({
   width: '100%',
   gap: "var(--ds-space-100, 0.5rem)"

package/dist/cjs/view/HoverCard/components/views/unauthorised/styled.js

@@ -5,19 +5,28 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.titleBlockStyles = exports.mainTextStyles = exports.connectButtonStyles = void 0;
 var _react = require("@emotion/react");
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 var blockGap = '0.5rem';
 var iconGap = '0.5rem';
 var titleFontWeight = '500';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var connectButtonStyles = exports.connectButtonStyles = (0, _react.css)({
   justifyContent: 'flex-end',
   marginTop: blockGap
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var titleBlockStyles = exports.titleBlockStyles = (0, _react.css)({
   gap: "".concat(blockGap, " ").concat(iconGap),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   a: {
     fontWeight: titleFontWeight
   }
 });
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var mainTextStyles = exports.mainTextStyles = (0, _react.css)({
   marginTop: blockGap,
   fontSize: '0.75rem'

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

@@ -15,6 +15,8 @@ var _constants = require("../../constants");
 var _reactMagneticDi = require("react-magnetic-di");
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 var HoverCardWithErrorBoundary = function HoverCardWithErrorBoundary(props) {
   var url = props.url,
     id = props.id,

package/dist/cjs/view/HoverCard/styled.js

@@ -11,7 +11,7 @@ var _index = require("../../index");
 var _constants = require("../../constants");
 var _constants2 = require("@atlaskit/theme/constants");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _templateObject, _templateObject2;
+var _templateObject, _templateObject2; // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 // Temporary fix for Confluence inline comment on editor mod has z-index of 500, Jira issue view has z-index of 510
 var HOVER_CARD_Z_INDEX = exports.HOVER_CARD_Z_INDEX = _constants2.layers.modal();
 var flexibleUiOptions = exports.flexibleUiOptions = {
@@ -27,32 +27,41 @@ var NEW_CARD_WIDTH_REM = exports.NEW_CARD_WIDTH_REM = 25;
 var CARD_GAP_PX = exports.CARD_GAP_PX = 10;
 var blockGap = '0.5rem';
 var elementGap = '0.5rem';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var separatorCss = exports.separatorCss = (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-separator] + [data-separator]:before': {
     marginRight: elementGap
   }
 });
 
-// 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
 var HoverCardContainer = exports.HoverCardContainer = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\tbackground: none;\n\tborder-width: 0;\n\tbox-sizing: border-box;\n\twidth: ", "rem;\n\n\t.", " {\n\t\tdisplay: none;\n\t}\n"])), (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.hover-card-ai-summaries') ? NEW_CARD_WIDTH_REM : CARD_WIDTH_REM, _index.loadingPlaceholderClassName);
 
-// 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
 var titleBlockCss = exports.titleBlockCss = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\tgap: ", ";\n\n\t", "\n\n\t// title and subtitle element group\n  [data-smart-element-group] {\n\t\t// gap between title and subtitle\n\t\tgap: 0.06rem;\n\t\tdisplay: flex;\n\t\t/* subtitle element group */\n\t\t> [data-smart-element-group] {\n\t\t\t> span {\n\t\t\t\tmargin-right: ", ";\n\t\t\t}\n\t\t}\n\t}\n\n\t[data-smart-element='Title'] {\n\t\tfont-weight: 600;\n\t}\n"])), blockGap, separatorCss, elementGap);
 var getTransitionStyles = exports.getTransitionStyles = function getTransitionStyles(snippetHeight) {
   return (0, _react.css)({
     transition: 'height 300ms ease-in-out',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     height: "".concat(snippetHeight, "px")
   });
 };
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
 var popupContainerStyles = exports.popupContainerStyles = (0, _react.css)({
   borderRadius: "var(--ds-border-radius-200, 8px)",
   backgroundColor: "var(--ds-surface-overlay, white)",
   boxShadow: "var(--ds-shadow-overlay, 0px 8px 12px rgba(9, 30, 66, 0.15),0px 0px 1px rgba(9, 30, 66, 0.31))"
 });
 var getPreviewBlockStyles = exports.getPreviewBlockStyles = function getPreviewBlockStyles(previewHeight) {
-  return (0, _react.css)(previewHeight ? "height: ".concat(previewHeight, "px;") : '', {
-    borderTopLeftRadius: "var(--ds-border-radius-200, 8px)",
-    borderTopRightRadius: "var(--ds-border-radius-200, 8px)",
-    marginBottom: blockGap
-  });
+  return (
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+    (0, _react.css)(previewHeight ? "height: ".concat(previewHeight, "px;") : '', {
+      borderTopLeftRadius: "var(--ds-border-radius-200, 8px)",
+      borderTopRightRadius: "var(--ds-border-radius-200, 8px)",
+      marginBottom: blockGap
+    })
+  );
 };

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

@@ -9,7 +9,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _colors = require("@atlaskit/theme/colors");
 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) { (0, _defineProperty2.default)(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; }
+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) { (0, _defineProperty2.default)(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; } // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var selectedStyles = {
   cursor: 'pointer',
   boxShadow: "0 0 0 2px ".concat("var(--ds-border-selected, ".concat(_colors.B100, ")")),
@@ -95,13 +95,13 @@ var baseWrapperStyles = function baseWrapperStyles(props) {
   }, props.isHovered ? hoveredWihBorderStyles(props) : undefined);
 };
 
-// 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 WrapperAnchor = exports.WrapperAnchor = _styled.default.a(function (props) {
   return _objectSpread(_objectSpread({}, baseWrapperStyles(props)), isInteractive(props));
 });
 WrapperAnchor.displayName = 'WrapperAnchor';
 
-// 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 WrapperSpan = exports.WrapperSpan = _styled.default.span(function (props) {
   return _objectSpread({}, baseWrapperStyles(props));
 });

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

@@ -8,12 +8,14 @@ exports.Shimmer = exports.Icon = exports.AKIconWrapper = void 0;
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _linkingCommon = require("@atlaskit/linking-common");
 var _react = _interopRequireDefault(require("react"));
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 // TODO: Figure out a more scalable/responsive solution
 // for vertical alignment.
 // Current rationale: vertically positioned at the top of
 // the smart card container (when set to 0). Offset this
 // to position it with appropriate whitespace from the top.
-// 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 Icon = exports.Icon = _styled.default.img({
   height: '14px',
   width: '14px',
@@ -29,7 +31,7 @@ var Icon = exports.Icon = _styled.default.img({
 // Used for 'untrue' icons which claim to be 16x16 but
 // are less than that in height/width.
 // TODO: Replace this override with proper AtlasKit solution.
-// 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 AKIconWrapper = exports.AKIconWrapper = _styled.default.span({
   marginRight: "var(--ds-space-negative-025, -2px)"
 });