@atlaskit/smart-card 26.17.0 → 26.18.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/smart-card
 
+## 26.18.0
+
+### Minor Changes
+
+- [`e7e73b61721`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e7e73b61721) - [ux] We are testing an improved dispaly for Slack hover & block cards behind a feature flag. If this update is successful it will be available in a later release.
+
 ## 26.17.0
 
 ### Minor Changes

package/dist/cjs/utils/analytics/analytics.js

@@ -21,7 +21,7 @@ exports.ANALYTICS_CHANNEL = ANALYTICS_CHANNEL;
 var context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.17.0"
+  packageVersion: "26.18.0"
 };
 exports.context = context;
 var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {

package/dist/cjs/view/BlockCard/views/flexible/FlexibleResolvedView.js

@@ -91,7 +91,9 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
     onError: function onError() {
       setIsPreviewBlockErrored(true);
     }
-  }) : null, /*#__PURE__*/_react.default.createElement(_blocks.FooterBlock, {
+  }) : null, /*#__PURE__*/_react.default.createElement(_blocks.FooterBlock, (0, _extends2.default)({}, (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
+    overrideCss: _styled.footerBlockCss
+  }, {
     actions: [{
       name: _constants.ActionName.PreviewAction,
       hideIcon: true,
@@ -138,7 +140,7 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
         });
       }
     }]
-  }));
+  })));
 };
 var _default = (0, _withFlexibleUIBlockCardStyle.withFlexibleUIBlockCardStyle)(FlexibleResolvedView);
 exports.default = _default;

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

@@ -4,19 +4,21 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.titleBlockCss = exports.metadataBlockCss = exports.flexibleBlockCardStyle = void 0;
+exports.titleBlockCss = exports.metadataBlockCss = exports.footerBlockCss = exports.flexibleBlockCardStyle = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _token = require("../../../../utils/token");
 var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 // in editor prosemirror adds padding-left so we need to overwrite it
 var metadataBlockCss = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  /* primary element group */\n  span[data-smart-element-avatar-group] {\n    > ul {\n      padding-left: 0px;\n    }\n  }\n  [data-smart-element-group] {\n    line-height: 1rem;\n  }\n"])));
 exports.metadataBlockCss = metadataBlockCss;
 var titleBlockCss = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", "\n"])), (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "gap: 0.5em;" : "", (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? "[data-smart-element=\"Title\"] {\n          font-weight: 600;\n        }" : "");
 exports.titleBlockCss = titleBlockCss;
-var flexibleBlockCardElevationStyle = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  border-radius: 1.5px;\n  box-shadow: ", ";\n  margin: ", ";\n"])), _token.tokens.elevation, "var(--ds-space-025, 2px)");
-var refreshedFlexibleBlockCardStyle = (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  & > div {\n    border-radius: ", ";\n    border: 1px solid ", ";\n  }\n"])), "var(--ds-border-radius-300, 12px)", "var(--ds-border-input, ".concat(_colors.N40, ")"));
+var footerBlockCss = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  height: 1.5rem;\n"])));
+exports.footerBlockCss = footerBlockCss;
+var flexibleBlockCardElevationStyle = (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  border-radius: 1.5px;\n  box-shadow: ", ";\n  margin: ", ";\n"])), _token.tokens.elevation, "var(--ds-space-025, 2px)");
+var refreshedFlexibleBlockCardStyle = (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  & > div {\n    border-radius: ", ";\n    border: 1px solid ", ";\n  }\n"])), "var(--ds-border-radius-300, 12px)", "var(--ds-border-input, ".concat(_colors.N40, ")"));
 var flexibleBlockCardStyle = (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? refreshedFlexibleBlockCardStyle : flexibleBlockCardElevationStyle;
 exports.flexibleBlockCardStyle = flexibleBlockCardStyle;

package/dist/cjs/view/BlockCard/views/flexible/utils/index.js

@@ -81,6 +81,20 @@ var getSimulatedBetterMetadata = function getSimulatedBetterMetadata(cardDetails
           name: _constants.ElementName.SubTasksProgress
         }]
       };
+    case 'slack-object-provider':
+      return {
+        titleMetadata: defaultTitleMetadata,
+        topMetadata: [{
+          name: _constants.ElementName.AuthorGroup
+        }, {
+          name: _constants.ElementName.SentOn
+        }],
+        bottomMetadata: [{
+          name: _constants.ElementName.ReactCount
+        }, {
+          name: _constants.ElementName.CommentCount
+        }]
+      };
     default:
       return {
         titleMetadata: defaultTitleMetadata,

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

@@ -13,7 +13,7 @@ var _templateObject, _templateObject2, _templateObject3;
 var elementGap = '0.5rem';
 var metadataBlockCss = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  gap: 0px;\n  /* primary element group */\n  [data-smart-element-group]:nth-of-type(1) {\n    flex-grow: 7;\n\n    // a separator between text-based element\n    ", "\n\n    /* horizontal spacing between elements in group */\n    > span {\n      margin-right: ", ";\n    }\n  }\n  /* secondary element group */\n  [data-smart-element-group]:nth-of-type(2) {\n    flex-grow: 3;\n    /* horizontal spacing between elements in group */\n    > span {\n      margin-left: ", ";\n    }\n  }\n  ", "\n"])), _styled.separatorCss, elementGap, elementGap, (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "[data-smart-element-group] {\n       line-height: 1rem;\n    }" : "");
 exports.metadataBlockCss = metadataBlockCss;
-var footerBlockCss = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n"])), !(0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "padding-top: 0.25rem;" : "");
+var footerBlockCss = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n"])), !(0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "padding-top: 0.25rem;" : "height: 1.5rem;");
 exports.footerBlockCss = footerBlockCss;
 var hiddenSnippetStyles = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  visibility: hidden;\n  position: absolute;\n"])));
 exports.hiddenSnippetStyles = hiddenSnippetStyles;

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

@@ -37,7 +37,7 @@ var CARD_GAP_PX = 10;
 exports.CARD_GAP_PX = CARD_GAP_PX;
 var blockGap = '0.5rem';
 var elementGap = '0.5rem';
-var separatorCss = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  [data-separator] + [data-separator]:before {\n    margin-right: ", ";\n  }\n  ", "\n"])), elementGap, (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? " [data-smart-element-avatar-group] + [data-separator]:before {\n      content: '\u2022';\n      margin-right: ".concat(elementGap, ";\n    }") : "");
+var separatorCss = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  [data-separator] + [data-separator]:before {\n    margin-right: ", ";\n  }\n"])), elementGap);
 exports.separatorCss = separatorCss;
 var HoverCardContainer = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background: none;\n  border-width: 0;\n  box-sizing: border-box;\n  width: ", "rem;\n  ", "\n\n  .", " {\n    display: none;\n  }\n"])), CARD_WIDTH_REM, !(0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "padding: 1rem;" : "", _index.loadingPlaceholderClassName);
 exports.HoverCardContainer = HoverCardContainer;

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

@@ -169,6 +169,19 @@ var getSimulatedBetterMetadata = function getSimulatedBetterMetadata() {
           subtitle: []
         }
       });
+    case 'slack-object-provider':
+      return {
+        topMetadataBlock: {
+          primary: [_constants.ElementName.AuthorGroup, _constants.ElementName.SentOn],
+          secondary: [],
+          subtitle: []
+        },
+        bottomMetadataBlock: {
+          primary: [_constants.ElementName.ReactCount, _constants.ElementName.CommentCount],
+          secondary: [],
+          subtitle: []
+        }
+      };
     case 'google-object-provider':
     case 'figma-object-provider':
       return _objectSpread(_objectSpread({}, defaultMetadata), {}, {

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

@@ -18,7 +18,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId"],
   _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.17.0",
+  packageVersion: "26.18.0",
   componentName: 'linkUrl'
 };
 var Link = (0, _click.withLinkClickedEvent)('a');

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

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

package/dist/es2019/view/BlockCard/views/flexible/FlexibleResolvedView.js

@@ -3,7 +3,7 @@ import React, { useEffect, useState } from 'react';
 import FlexibleCard from '../../../FlexibleCard';
 import TitleBlock from '../../../FlexibleCard/components/blocks/title-block';
 import { FooterBlock, MetadataBlock, PreviewBlock, SnippetBlock } from '../../../FlexibleCard/components/blocks';
-import { metadataBlockCss } from './styled';
+import { metadataBlockCss, footerBlockCss } from './styled';
 import { ActionName, CardDisplay, ElementName, MediaPlacement, SmartLinkPosition } from '../../../../constants';
 import uuid from 'uuid';
 import { getSimulatedMetadata, getSimulatedBetterMetadata } from './utils';
@@ -75,7 +75,9 @@ const FlexibleResolvedView = ({
     onError: () => {
       setIsPreviewBlockErrored(true);
     }
-  }) : null, /*#__PURE__*/React.createElement(FooterBlock, {
+  }) : null, /*#__PURE__*/React.createElement(FooterBlock, _extends({}, getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
+    overrideCss: footerBlockCss
+  }, {
     actions: [{
       name: ActionName.PreviewAction,
       hideIcon: true,
@@ -122,6 +124,6 @@ const FlexibleResolvedView = ({
         });
       }
     }]
-  }));
+  })));
 };
 export default withFlexibleUIBlockCardStyle(FlexibleResolvedView);

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

@@ -21,6 +21,9 @@ export const titleBlockCss = css`
           font-weight: 600;
         }` : ``}
 `;
+export const footerBlockCss = css`
+  height: 1.5rem;
+`;
 const flexibleBlockCardElevationStyle = css`
   border-radius: 1.5px;
   box-shadow: ${tokens.elevation};

package/dist/es2019/view/BlockCard/views/flexible/utils/index.js

@@ -75,6 +75,20 @@ export const getSimulatedBetterMetadata = cardDetails => {
           name: ElementName.SubTasksProgress
         }]
       };
+    case 'slack-object-provider':
+      return {
+        titleMetadata: defaultTitleMetadata,
+        topMetadata: [{
+          name: ElementName.AuthorGroup
+        }, {
+          name: ElementName.SentOn
+        }],
+        bottomMetadata: [{
+          name: ElementName.ReactCount
+        }, {
+          name: ElementName.CommentCount
+        }]
+      };
     default:
       return {
         titleMetadata: defaultTitleMetadata,

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

@@ -29,7 +29,7 @@ export const metadataBlockCss = css`
     }` : ``}
 `;
 export const footerBlockCss = css`
-  ${!getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? `padding-top: 0.25rem;` : ``}
+  ${!getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? `padding-top: 0.25rem;` : `height: 1.5rem;`}
 `;
 export const hiddenSnippetStyles = css`
   visibility: hidden;

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

@@ -27,10 +27,6 @@ export const separatorCss = css`
   [data-separator] + [data-separator]:before {
     margin-right: ${elementGap};
   }
-  ${getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? ` [data-smart-element-avatar-group] + [data-separator]:before {
-      content: '•';
-      margin-right: ${elementGap};
-    }` : ``}
 `;
 export const HoverCardContainer = css`
   background: none;

package/dist/es2019/view/HoverCard/utils.js

@@ -160,6 +160,19 @@ export const getSimulatedBetterMetadata = (extensionKey = '', data) => {
           subtitle: []
         }
       };
+    case 'slack-object-provider':
+      return {
+        topMetadataBlock: {
+          primary: [ElementName.AuthorGroup, ElementName.SentOn],
+          secondary: [],
+          subtitle: []
+        },
+        bottomMetadataBlock: {
+          primary: [ElementName.ReactCount, ElementName.CommentCount],
+          secondary: [],
+          subtitle: []
+        }
+      };
     case 'google-object-provider':
     case 'figma-object-provider':
       return {

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

@@ -8,7 +8,7 @@ import LinkWarningModal from './LinkWarningModal';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 const PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.17.0",
+  packageVersion: "26.18.0",
   componentName: 'linkUrl'
 };
 const Link = withLinkClickedEvent('a');

package/dist/esm/utils/analytics/analytics.js

@@ -13,7 +13,7 @@ export var ANALYTICS_CHANNEL = 'media';
 export var context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.17.0"
+  packageVersion: "26.18.0"
 };
 export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

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

@@ -4,7 +4,7 @@ import React, { useEffect, useState } from 'react';
 import FlexibleCard from '../../../FlexibleCard';
 import TitleBlock from '../../../FlexibleCard/components/blocks/title-block';
 import { FooterBlock, MetadataBlock, PreviewBlock, SnippetBlock } from '../../../FlexibleCard/components/blocks';
-import { metadataBlockCss } from './styled';
+import { metadataBlockCss, footerBlockCss } from './styled';
 import { ActionName, CardDisplay, ElementName, MediaPlacement, SmartLinkPosition } from '../../../../constants';
 import uuid from 'uuid';
 import { getSimulatedMetadata, getSimulatedBetterMetadata } from './utils';
@@ -82,7 +82,9 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
     onError: function onError() {
       setIsPreviewBlockErrored(true);
     }
-  }) : null, /*#__PURE__*/React.createElement(FooterBlock, {
+  }) : null, /*#__PURE__*/React.createElement(FooterBlock, _extends({}, getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
+    overrideCss: footerBlockCss
+  }, {
     actions: [{
       name: ActionName.PreviewAction,
       hideIcon: true,
@@ -129,6 +131,6 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
         });
       }
     }]
-  }));
+  })));
 };
 export default withFlexibleUIBlockCardStyle(FlexibleResolvedView);

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

@@ -1,5 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 import { tokens } from '../../../../utils/token';
 import { css } from '@emotion/react';
 import { N40 } from '@atlaskit/theme/colors';
@@ -8,6 +8,7 @@ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 // in editor prosemirror adds padding-left so we need to overwrite it
 export var metadataBlockCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  /* primary element group */\n  span[data-smart-element-avatar-group] {\n    > ul {\n      padding-left: 0px;\n    }\n  }\n  [data-smart-element-group] {\n    line-height: 1rem;\n  }\n"])));
 export var titleBlockCss = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n  ", "\n"])), getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "gap: 0.5em;" : "", getBooleanFF('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? "[data-smart-element=\"Title\"] {\n          font-weight: 600;\n        }" : "");
-var flexibleBlockCardElevationStyle = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  border-radius: 1.5px;\n  box-shadow: ", ";\n  margin: ", ";\n"])), tokens.elevation, "var(--ds-space-025, 2px)");
-var refreshedFlexibleBlockCardStyle = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  & > div {\n    border-radius: ", ";\n    border: 1px solid ", ";\n  }\n"])), "var(--ds-border-radius-300, 12px)", "var(--ds-border-input, ".concat(N40, ")"));
+export var footerBlockCss = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  height: 1.5rem;\n"])));
+var flexibleBlockCardElevationStyle = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  border-radius: 1.5px;\n  box-shadow: ", ";\n  margin: ", ";\n"])), tokens.elevation, "var(--ds-space-025, 2px)");
+var refreshedFlexibleBlockCardStyle = css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  & > div {\n    border-radius: ", ";\n    border: 1px solid ", ";\n  }\n"])), "var(--ds-border-radius-300, 12px)", "var(--ds-border-input, ".concat(N40, ")"));
 export var flexibleBlockCardStyle = getBooleanFF('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? refreshedFlexibleBlockCardStyle : flexibleBlockCardElevationStyle;

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

@@ -75,6 +75,20 @@ export var getSimulatedBetterMetadata = function getSimulatedBetterMetadata(card
           name: ElementName.SubTasksProgress
         }]
       };
+    case 'slack-object-provider':
+      return {
+        titleMetadata: defaultTitleMetadata,
+        topMetadata: [{
+          name: ElementName.AuthorGroup
+        }, {
+          name: ElementName.SentOn
+        }],
+        bottomMetadata: [{
+          name: ElementName.ReactCount
+        }, {
+          name: ElementName.CommentCount
+        }]
+      };
     default:
       return {
         titleMetadata: defaultTitleMetadata,

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

@@ -5,5 +5,5 @@ import { separatorCss } from '../../../styled';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 var elementGap = '0.5rem';
 export var metadataBlockCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  gap: 0px;\n  /* primary element group */\n  [data-smart-element-group]:nth-of-type(1) {\n    flex-grow: 7;\n\n    // a separator between text-based element\n    ", "\n\n    /* horizontal spacing between elements in group */\n    > span {\n      margin-right: ", ";\n    }\n  }\n  /* secondary element group */\n  [data-smart-element-group]:nth-of-type(2) {\n    flex-grow: 3;\n    /* horizontal spacing between elements in group */\n    > span {\n      margin-left: ", ";\n    }\n  }\n  ", "\n"])), separatorCss, elementGap, elementGap, getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "[data-smart-element-group] {\n       line-height: 1rem;\n    }" : "");
-export var footerBlockCss = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n"])), !getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "padding-top: 0.25rem;" : "");
+export var footerBlockCss = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  ", "\n"])), !getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "padding-top: 0.25rem;" : "height: 1.5rem;");
 export var hiddenSnippetStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  visibility: hidden;\n  position: absolute;\n"])));

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

@@ -27,7 +27,7 @@ export var CARD_WIDTH_REM = 24;
 export var CARD_GAP_PX = 10;
 var blockGap = '0.5rem';
 var elementGap = '0.5rem';
-export var separatorCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  [data-separator] + [data-separator]:before {\n    margin-right: ", ";\n  }\n  ", "\n"])), elementGap, getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? " [data-smart-element-avatar-group] + [data-separator]:before {\n      content: '\u2022';\n      margin-right: ".concat(elementGap, ";\n    }") : "");
+export var separatorCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  [data-separator] + [data-separator]:before {\n    margin-right: ", ";\n  }\n"])), elementGap);
 export var HoverCardContainer = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  background: none;\n  border-width: 0;\n  box-sizing: border-box;\n  width: ", "rem;\n  ", "\n\n  .", " {\n    display: none;\n  }\n"])), CARD_WIDTH_REM, !getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "padding: 1rem;" : "", loadingPlaceholderClassName);
 export var titleBlockCss = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  gap: ", ";\n\n  ", "\n\n  // title and subtitle element group\n  [data-smart-element-group] {\n    // gap between title and subtitle\n    gap: 0.06rem;\n    display: flex;\n    /* subtitle element group */\n    > [data-smart-element-group] {\n      > span {\n        margin-right: ", ";\n      }\n    }\n  }\n\n  ", "\n"])), blockGap, separatorCss, elementGap, getBooleanFF('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? "[data-smart-element=\"Title\"] {\n          font-weight: 600;\n        }" : "");
 export var getTransitionStyles = function getTransitionStyles(snippetHeight) {

package/dist/esm/view/HoverCard/utils.js

@@ -161,6 +161,19 @@ export var getSimulatedBetterMetadata = function getSimulatedBetterMetadata() {
           subtitle: []
         }
       });
+    case 'slack-object-provider':
+      return {
+        topMetadataBlock: {
+          primary: [ElementName.AuthorGroup, ElementName.SentOn],
+          secondary: [],
+          subtitle: []
+        },
+        bottomMetadataBlock: {
+          primary: [ElementName.ReactCount, ElementName.CommentCount],
+          secondary: [],
+          subtitle: []
+        }
+      };
     case 'google-object-provider':
     case 'figma-object-provider':
       return _objectSpread(_objectSpread({}, defaultMetadata), {}, {

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

@@ -11,7 +11,7 @@ import LinkWarningModal from './LinkWarningModal';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.17.0",
+  packageVersion: "26.18.0",
   componentName: 'linkUrl'
 };
 var Link = withLinkClickedEvent('a');

package/dist/types/view/BlockCard/views/flexible/styled.d.ts

@@ -1,3 +1,4 @@
 export declare const metadataBlockCss: import("@emotion/react").SerializedStyles;
 export declare const titleBlockCss: import("@emotion/react").SerializedStyles;
+export declare const footerBlockCss: import("@emotion/react").SerializedStyles;
 export declare const flexibleBlockCardStyle: import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/view/BlockCard/views/flexible/styled.d.ts

@@ -1,3 +1,4 @@
 export declare const metadataBlockCss: import("@emotion/react").SerializedStyles;
 export declare const titleBlockCss: import("@emotion/react").SerializedStyles;
+export declare const footerBlockCss: import("@emotion/react").SerializedStyles;
 export declare const flexibleBlockCardStyle: import("@emotion/react").SerializedStyles;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/smart-card",
-  "version": "26.17.0",
+  "version": "26.18.0",
   "description": "Smart card component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"