@atlaskit/smart-card 27.6.4 → 27.7.0

package/dist/cjs/view/common/Byline.js

@@ -10,37 +10,37 @@ var _utils = require("./utils");
 /** @jsx jsx */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
+var baseStyles = (0, _react.css)({
+  // Spec: only allow two lines MAX to be shown.
+  display: '-webkit-box',
+  overflow: 'hidden',
+  textOverflow: 'ellipsis',
+  WebkitLineClamp: 2,
+  WebkitBoxOrient: 'vertical',
+  wordBreak: 'break-word',
+  whiteSpace: 'pre-line',
+  // EDM-713: fixes copy-paste from renderer to editor for Firefox
+  // due to HTML its unwrapping behaviour on paste.
+  MozUserSelect: 'none'
+});
+
+// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
+var styles = (0, _utils.mq)({
+  fontSize: (0, _utils.gs)(1.5),
+  lineHeight: (0, _utils.gs)(2.5),
+  color: "".concat("var(--ds-text-subtlest, ".concat(_colors.N300, ")")),
+  fontWeight: 'normal',
+  marginTop: (0, _utils.gs)(0.5),
+  // Fallback options.
+  maxHeight: (0, _utils.gs)(5)
+});
 var Byline = exports.Byline = function Byline(_ref) {
   var text = _ref.text,
     children = _ref.children,
     testId = _ref.testId,
     className = _ref.className;
   return (0, _react.jsx)("span", {
-    // 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: (0, _utils.mq)({
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      fontSize: (0, _utils.gs)(1.5),
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      lineHeight: (0, _utils.gs)(2.5),
-      color: "".concat("var(--ds-text-subtlest, ".concat(_colors.N300, ")")),
-      fontWeight: 'normal',
-      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      marginTop: (0, _utils.gs)(0.5),
-      // Spec: only allow two lines MAX to be shown.
-      display: '-webkit-box',
-      overflow: 'hidden',
-      textOverflow: 'ellipsis',
-      WebkitLineClamp: 2,
-      WebkitBoxOrient: 'vertical',
-      wordBreak: 'break-word',
-      // Fallback options.
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      maxHeight: (0, _utils.gs)(5),
-      whiteSpace: 'pre-line',
-      // EDM-713: fixes copy-paste from renderer to editor for Firefox
-      // due to HTML its unwrapping behaviour on paste.
-      MozUserSelect: 'none'
-    }),
+    css: [baseStyles, styles],
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,

package/dist/es2019/extractors/common/icon/extractIcon.js

@@ -6,6 +6,7 @@ import PullRequestIcon from '@atlaskit/icon-object/glyph/pull-request/16';
 import BranchIcon from '@atlaskit/icon-object/glyph/branch/16';
 import RepoIcon from '@atlaskit/icon-object/glyph/code/16';
 import TaskIcon from '@atlaskit/icon-object/glyph/task/16';
+import { getIconForFileType } from '../../../utils';
 import { extractorPriorityMap } from './priority';
 import { extractProvider, extractUrlFromIconJsonLd, extractTitle } from '@atlaskit/link-extractors';
 import { extractFileFormat } from './extractFileFormat';
@@ -30,6 +31,56 @@ export const extractIcon = (jsonLd, priority = 'type') => {
     return extractIconByType(type, opts);
   }
 };
+function typeToIcon(type, opts) {
+  switch (type) {
+    case 'atlassian:SourceCodeCommit':
+      return /*#__PURE__*/React.createElement(CommitIcon, {
+        label: opts.title || 'commit',
+        testId: "commit-icon"
+      });
+    case 'atlassian:Project':
+      return /*#__PURE__*/React.createElement(ProjectIcon, {
+        label: opts.title || 'project',
+        size: "small",
+        testId: "project-icon"
+      });
+    case 'atlassian:SourceCodePullRequest':
+      return /*#__PURE__*/React.createElement(PullRequestIcon, {
+        label: opts.title || 'pullRequest',
+        testId: "pull-request-icon"
+      });
+    case 'atlassian:SourceCodeReference':
+      return /*#__PURE__*/React.createElement(BranchIcon, {
+        label: opts.title || 'reference',
+        testId: "branch-icon"
+      });
+    case 'atlassian:SourceCodeRepository':
+      return /*#__PURE__*/React.createElement(RepoIcon, {
+        label: opts.title || 'repository',
+        testId: "repo-icon"
+      });
+    case 'atlassian:Goal':
+      return /*#__PURE__*/React.createElement(TaskIcon, {
+        label: opts.title || 'goal',
+        testId: "task-icon"
+      });
+    case 'atlassian:Task':
+      return extractIconFromTask(opts);
+    default:
+      return undefined;
+  }
+}
+function standardisedExtractIcon(type, opts) {
+  const iconFromType = typeToIcon(type, opts);
+  const iconFromFileFormat = opts.fileFormat ? getIconForFileType(opts.fileFormat) : undefined;
+  const iconFromProvider = opts.provider && opts.provider.icon;
+  return prioritiseIcon({
+    fileFormatIcon: iconFromFileFormat,
+    documentTypeIcon: iconFromType,
+    urlIcon: opts.icon,
+    providerIcon: iconFromProvider
+  });
+}
 
 /**
  * Extracts an icon based on the given type.
@@ -42,6 +93,21 @@ export const extractIcon = (jsonLd, priority = 'type') => {
  * @returns The extracted icon as a React node, or `undefined` if no icon is found.
  */
 const extractIconByType = (type, opts) => {
+  if (getBooleanFF('platform.linking-platform.smart-card.standardise-smart-link-icon-behaviour')) {
+    switch (type) {
+      case 'Document':
+      case 'schema:BlogPosting':
+      case 'schema:DigitalDocument':
+      case 'schema:TextDigitalDocument':
+      case 'schema:PresentationDigitalDocument':
+      case 'schema:SpreadsheetDigitalDocument':
+      case 'atlassian:Template':
+      case 'atlassian:UndefinedLink':
+        return extractIconFromDocument(type, opts);
+      default:
+        return standardisedExtractIcon(type, opts);
+    }
+  }
   switch (type) {
     case 'Document':
     case 'schema:BlogPosting':
@@ -86,24 +152,6 @@ const extractIconByType = (type, opts) => {
     case 'atlassian:Task':
       return extractIconFromTask(opts);
     default:
-      return getBooleanFF('platform.linking-platform.smart-card.standardise-smart-link-icon-behaviour') ? extractDefaultIcon(opts) : opts.provider && opts.provider.icon;
+      return opts.provider && opts.provider.icon;
   }
-};
-
-/**
- * Choose which icon to show when the type is not recognized.
- */
-const extractDefaultIcon = opts => {
-  var _opts$provider;
-  const {
-    provider
-  } = opts;
-  const providerId = provider === null || provider === void 0 ? void 0 : provider.id;
-  return prioritiseIcon({
-    providerId,
-    fileFormatIcon: undefined,
-    documentTypeIcon: undefined,
-    urlIcon: opts.icon,
-    providerIcon: (_opts$provider = opts.provider) === null || _opts$provider === void 0 ? void 0 : _opts$provider.icon
-  });
 };

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

@@ -16,16 +16,11 @@ import { prioritiseIcon } from './prioritiseIcon';
  * @returns The React node representing the extracted icon, or `undefined` if no icon is found.
  */
 export const extractIconFromDocument = (type, opts) => {
-  const {
-    provider
-  } = opts;
   const iconFromType = documentTypeToIcon(type, opts);
   const iconFromFileFormat = documentFileFormatToIcon(opts);
   const iconFromProvider = opts.provider && opts.provider.icon;
   if (getBooleanFF('platform.linking-platform.smart-card.standardise-smart-link-icon-behaviour')) {
-    const providerId = provider === null || provider === void 0 ? void 0 : provider.id;
     return prioritiseIcon({
-      providerId,
       fileFormatIcon: iconFromFileFormat,
       documentTypeIcon: iconFromType,
       urlIcon: opts.icon,

package/dist/es2019/extractors/common/icon/prioritiseIcon.js

@@ -1,8 +1,3 @@
-import { CONFLUENCE_GENERATOR_ID, JIRA_GENERATOR_ID } from '../../constants';
-const isConfluenceProvider = provider => provider === CONFLUENCE_GENERATOR_ID;
-const isJiraProvider = provider => provider === JIRA_GENERATOR_ID;
-const isNativeProvider = provider => isConfluenceProvider(provider) || isJiraProvider(provider);
-
 /**
  * Represents an icon. Should either contain a label and url, or a an icon type and label.
  */
@@ -16,14 +11,10 @@ const isNativeProvider = provider => isConfluenceProvider(provider) || isJiraPro
  * Generic so it can be used to prioritise strings, or React components depending on the usage.
  */
 export function prioritiseIcon({
-  providerId,
   fileFormatIcon,
   documentTypeIcon,
   urlIcon,
   providerIcon
 }) {
-  if (isNativeProvider(providerId)) {
-    return fileFormatIcon || documentTypeIcon || urlIcon || providerIcon;
-  }
   return urlIcon || fileFormatIcon || documentTypeIcon || providerIcon;
 }

package/dist/es2019/extractors/embed/index.js

@@ -24,7 +24,6 @@ function generateContext(jsonLd) {
   }
   const generator = jsonLd.generator;
   const icon = prioritiseIcon({
-    providerId: generator && typeof generator !== 'string' && generator['@type'] !== 'Link' ? generator['@id'] : undefined,
     fileFormatIcon: undefined,
     documentTypeIcon: undefined,
     urlIcon: extractUrlFromIconJsonLd(jsonLd.icon),

package/dist/es2019/extractors/flexible/icon/extract-jsonld-data-icon.js

@@ -32,6 +32,85 @@ const extractType = jsonLd => {
 const isConfluenceProvider = provider => provider === CONFLUENCE_GENERATOR_ID;
 const isJiraProvider = provider => provider === JIRA_GENERATOR_ID;
 const isNativeProvider = provider => isConfluenceProvider(provider) || isJiraProvider(provider);
+function chooseIcon({
+  urlIcon,
+  type,
+  label,
+  data,
+  providerIcon
+}) {
+  var _data$generator;
+  const providerId = (_data$generator = data.generator) === null || _data$generator === void 0 ? void 0 : _data$generator['@id'];
+  const fileFormat = data === null || data === void 0 ? void 0 : data['schema:fileFormat'];
+  const fileFormatIcon = extractFileFormatIcon(fileFormat);
+  const documentTypeIcon = typeToIconDescriptor({
+    type,
+    label,
+    providerId,
+    data
+  }) || extractDocumentTypeIcon(type, label);
+  return prioritiseIcon({
+    fileFormatIcon,
+    documentTypeIcon,
+    urlIcon,
+    providerIcon
+  });
+}
+function typeToIconDescriptor({
+  type,
+  label,
+  providerId,
+  data
+}) {
+  switch (type) {
+    case 'atlassian:Goal':
+      return {
+        icon: IconType.Task,
+        label: label || 'Goal'
+      };
+    case 'atlassian:Project':
+      return {
+        icon: IconType.Project,
+        label: label || 'Project'
+      };
+    case 'atlassian:SourceCodeCommit':
+      return {
+        icon: IconType.Commit,
+        label: label || 'Commit'
+      };
+    case 'atlassian:SourceCodePullRequest':
+      return {
+        icon: IconType.PullRequest,
+        label: label || 'Pull request'
+      };
+    case 'atlassian:SourceCodeReference':
+      return {
+        icon: IconType.Branch,
+        label: label || 'Reference'
+      };
+    case 'atlassian:SourceCodeRepository':
+      return {
+        icon: IconType.Repo,
+        label: label || 'Repository'
+      };
+    case 'atlassian:Task':
+      const taskLabel = label || 'Task';
+      const taskIconDescriptor = {
+        icon: IconType.Task,
+        label: taskLabel
+      };
+      if (isJiraProvider(providerId)) {
+        const {
+          taskType,
+          taskIcon
+        } = extractTask(data);
+        return taskType === 'JiraCustomTaskType' ? taskIcon || taskIconDescriptor : extractJiraTaskIcon(taskType, taskLabel);
+      }
+      return taskIconDescriptor;
+    default:
+      return undefined;
+  }
+}
 
 /**
  * Return the icon object given a JSON-LD data object.
@@ -43,6 +122,15 @@ const extractJsonldDataIcon = data => {
   const urlIcon = extractUrlIcon(data.icon, label);
   const provider = generator === null || generator === void 0 ? void 0 : generator['@id'];
   const providerIcon = extractProviderIcon(data);
+  if (getBooleanFF('platform.linking-platform.smart-card.standardise-smart-link-icon-behaviour')) {
+    return chooseIcon({
+      urlIcon,
+      providerIcon,
+      type,
+      label,
+      data
+    });
+  }
   switch (type) {
     case 'Document':
     case 'schema:BlogPosting':
@@ -60,15 +148,6 @@ const extractJsonldDataIcon = data => {
       const fileFormat = documentData === null || documentData === void 0 ? void 0 : documentData['schema:fileFormat'];
       const fileFormatIcon = extractFileFormatIcon(fileFormat);
       const documentTypeIcon = extractDocumentTypeIcon(type, label);
-      if (getBooleanFF('platform.linking-platform.smart-card.standardise-smart-link-icon-behaviour')) {
-        return prioritiseIcon({
-          providerId: provider,
-          fileFormatIcon,
-          documentTypeIcon,
-          urlIcon,
-          providerIcon
-        });
-      }
       return isNativeProvider(provider) ? fileFormatIcon || documentTypeIcon || urlIcon || providerIcon : providerIcon || fileFormatIcon || documentTypeIcon;
     case 'atlassian:Task':
       const taskLabel = label || 'Task';
@@ -117,38 +196,7 @@ const extractJsonldDataIcon = data => {
         label: label || 'Repository'
       };
     default:
-      return getBooleanFF('platform.linking-platform.smart-card.standardise-smart-link-icon-behaviour') ? extractDefaultIcon({
-        data,
-        type,
-        label,
-        provider,
-        urlIcon,
-        providerIcon
-      }) : providerIcon;
+      return providerIcon;
   }
 };
-export default extractJsonldDataIcon;
-
-/**
- * Choose which icon to show when the type is not recognized.
- */
-const extractDefaultIcon = ({
-  data,
-  type,
-  label,
-  provider,
-  urlIcon,
-  providerIcon
-}) => {
-  const documentData = data;
-  const fileFormat = documentData === null || documentData === void 0 ? void 0 : documentData['schema:fileFormat'];
-  const fileFormatIcon = extractFileFormatIcon(fileFormat);
-  const documentTypeIcon = extractDocumentTypeIcon(type, label);
-  return prioritiseIcon({
-    providerId: provider,
-    fileFormatIcon,
-    documentTypeIcon,
-    urlIcon,
-    providerIcon
-  });
-};
+export default extractJsonldDataIcon;

package/dist/es2019/utils/analytics/analytics.js

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

package/dist/es2019/view/BlockCard/components/ActionList.js

@@ -9,9 +9,20 @@ import MoreIcon from '@atlaskit/icon/glyph/more';
 import { Action } from './Action';
 import { gs, mq } from '../../common/utils';
 import { di } from 'react-magnetic-di';
+
+// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
+const wrapperStyles = mq({
+  display: 'flex',
+  marginTop: [gs(2), 0]
+});
 const buttonStyles = css({
   height: 'auto'
 });
+
+// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
+const actionsWrapperStyles = {
+  marginLeft: gs(0.5)
+};
 export const ActionList = ({
   items
 }) => {
@@ -19,19 +30,13 @@ export const ActionList = ({
   const actionsToList = items.slice(2, items.length);
   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({
-      display: 'flex',
-      // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-      marginTop: [gs(2), 0]
-    })
+    css: wrapperStyles
   }, jsx(ButtonGroup, null, actionsToShow.map(action => jsx(Action, _extends({
     key: action.id
   }, action)))), actionsToList.length ?
   // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
   jsx("div", {
-    css: {
-      marginLeft: gs(0.5)
-    }
+    css: actionsWrapperStyles
   }, jsx(DropdownMenu, {
     trigger: ({
       triggerRef,

package/dist/es2019/view/BlockCard/components/Content.js

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { gs, mq } from '../../common/utils';
 /**
  * Class name for selecting non-flexible block card content
@@ -9,19 +9,23 @@ import { gs, mq } 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 const blockCardContentClassName = 'block-card-content';
+const baseStyles = css({
+  display: 'flex',
+  flexDirection: 'column',
+  flexGrow: 1
+});
 export const Content = ({
   children,
   isCompact = false
 }) => 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({
+  css: [baseStyles,
+  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+  mq({
     // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     padding: isCompact ? gs(1) : gs(2),
-    display: 'flex',
-    flexDirection: 'column',
-    justifyContent: isCompact ? 'unset' : ['unset', 'space-between'],
-    flexGrow: 1
-  }),
+    justifyContent: isCompact ? 'unset' : ['unset', 'space-between']
+  })],
   "data-trello-do-not-use-override": "block-card-content"
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
   ,

package/dist/es2019/view/BlockCard/components/ContentFooter.js

@@ -1,22 +1,28 @@
 /** @jsx jsx */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import { gs, mq } from '../../common/utils';
 export const contentFooterClassName = 'smart-link-content-footer';
+const flexStyles = css({
+  display: 'flex'
+});
+
+// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+const baseStyles = mq({
+  flexDirection: ['column', 'row'],
+  flexGrow: [1, 'unset'],
+  alignItems: ['unset', 'center'],
+  marginTop: [gs(1), gs(1.5)]
+});
 export const ContentFooter = ({
   children,
   hasSpaceBetween = false
 }) => jsx("div", {
+  css: [flexStyles, baseStyles,
   // 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({
-    display: 'flex',
-    flexDirection: ['column', 'row'],
-    flexGrow: [1, 'unset'],
-    justifyContent: [hasSpaceBetween ? 'space-between' : 'flex-end', 'space-between'],
-    alignItems: ['unset', 'center'],
-    // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    marginTop: [gs(1), gs(1.5)]
-  })
+  mq({
+    justifyContent: [hasSpaceBetween ? 'space-between' : 'flex-end', 'space-between']
+  })]
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
   ,
   className: contentFooterClassName

package/dist/es2019/view/BlockCard/components/Frame.js

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+import { css, jsx } from '@emotion/react';
 import React from 'react';
 import { N20A, N30A, B200, N40A, N50A } from '@atlaskit/theme/colors';
 import { gs, br, mq } from '../../common/utils';
@@ -9,10 +9,14 @@ export const Frame = (props = {
   isHoverable: false,
   isFluidHeight: false
 }) => props.compact ? jsx(CompactFrame, props) : jsx(ExpandedFrame, props);
+const sharedBaseFrameStyles = css({
+  width: '100%',
+  display: 'flex'
+});
+
+// eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
 const sharedFrameStyles = {
   maxWidth: gs(95),
-  width: '100%',
-  display: 'flex',
   backgroundColor: "var(--ds-surface-raised, white)"
 };
 export const ExpandedFrame = ({
@@ -24,9 +28,9 @@ export const ExpandedFrame = ({
   isFluidHeight
 }) => {
   return jsx("div", {
+    css: [sharedBaseFrameStyles, sharedFrameStyles,
     // 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({
-      ...sharedFrameStyles,
+    mq({
       '&:hover': isHoverable ? {
         // TODO: https://product-fabric.atlassian.net/browse/DSP-4064
         backgroundColor: `var(--ds-background-neutral-subtle-hovered, ${N20A})`,
@@ -40,7 +44,7 @@ export const ExpandedFrame = ({
       justifyContent: 'space-between',
       overflow: 'hidden',
       boxShadow: `var(--ds-shadow-raised, ${`0 1px 1px ${N50A}, 0 0 1px 1px ${N40A}`})`
-    }),
+    })],
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
@@ -57,9 +61,9 @@ export const CompactFrame = ({
   inheritDimensions
 }) => {
   return jsx("div", {
+    css: [sharedBaseFrameStyles, sharedFrameStyles,
     // 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({
-      ...sharedFrameStyles,
+    mq({
       '&:hover': isHoverable ? {
         backgroundColor: `var(--ds-background-neutral-hovered, ${N30A})`
       } : undefined,
@@ -74,7 +78,7 @@ export const CompactFrame = ({
       width: ['calc(100% - 16px)', '100%'],
       // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
       padding: [`0px ${gs(1)}`, '0']
-    }),
+    })],
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,

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

@@ -24,6 +24,13 @@ const styles = css({
   justifyContent: 'space-between',
   alignItems: 'flex-start'
 });
+const lozengeStyles = {
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  height: gs(2.5),
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center'
+};
 /**
  * Class name for selecting non-flexible resolved block card
  *
@@ -88,13 +95,7 @@ export const ResolvedView = ({
     name: title,
     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',
-      justifyContent: 'center'
-    }
+    css: lozengeStyles
   }, jsx(Lozenge, _extends({
     style: lozenge.style
   }, lozenge), lozenge.text))), jsx(CollaboratorList, {

package/dist/es2019/view/FlexibleCard/components/elements/lozenge/lozenge-action/lozenge-action-analytics.js

@@ -1,21 +1,20 @@
-import { TrackQuickActionFailureReason, TrackQuickActionType } from '../../../../../../utils/analytics/analytics';
 export const unknownLoadErrorAnalyticsPayload = {
-  smartLinkActionType: TrackQuickActionType.StatusUpdate,
-  reason: TrackQuickActionFailureReason.UnknownError,
+  smartLinkActionType: 'StatusUpdate',
+  reason: 'UnknownError',
   step: 'load'
 };
 export const permissionLoadErrorAnalyticsPayload = {
-  smartLinkActionType: TrackQuickActionType.StatusUpdate,
-  reason: TrackQuickActionFailureReason.PermissionError,
+  smartLinkActionType: 'StatusUpdate',
+  reason: 'PermissionError',
   step: 'load'
 };
 export const unknownUpdateErrorAnalyticsPayload = {
-  smartLinkActionType: TrackQuickActionType.StatusUpdate,
-  reason: TrackQuickActionFailureReason.UnknownError,
+  smartLinkActionType: 'StatusUpdate',
+  reason: 'UnknownError',
   step: 'update'
 };
 export const validationUpdateErrorAnalyticsPayload = {
-  smartLinkActionType: TrackQuickActionType.StatusUpdate,
-  reason: TrackQuickActionFailureReason.ValidationError,
+  smartLinkActionType: 'StatusUpdate',
+  reason: 'ValidationError',
   step: 'update'
 };

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

@@ -7,7 +7,7 @@ import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-m
 import LinkWarningModal from './LinkWarningModal';
 const PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "27.6.4",
+  packageVersion: "27.7.0",
   componentName: 'linkUrl'
 };
 const Link = withLinkClickedEvent('a');