@atlaskit/smart-card 18.0.20 → 18.0.23

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/smart-card
 
+## 18.0.22
+
+### Patch Changes
+
+- [`8b9f08cbc1c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8b9f08cbc1c) - [ux] Default representation for Slack links was changed from 'block' to 'inline'
+- [`f4811ca8c6a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f4811ca8c6a) - add provider based metadata to hover previews
+
+## 18.0.21
+
+### Patch Changes
+
+- [`ffaf122189e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ffaf122189e) - Flexible UI: TitleBlock is now composory to display Flexible UI on Smart Links
+
 ## 18.0.20
 
 ### Patch Changes

package/dist/cjs/extractors/hover/extractMetadata.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.extractMetadata = void 0;
+
+var _constants = require("../../constants");
+
+var elementNamesToItems = function elementNamesToItems(elementNames) {
+  return elementNames.filter(function (element) {
+    return element in _constants.ElementName;
+  }).map(function (elementName) {
+    return {
+      name: elementName,
+      testId: "".concat(elementName.toLowerCase(), "-metadata-element")
+    };
+  });
+};
+
+var extractMetadata = function extractMetadata(jsonLd) {
+  var _jsonLd$metadata, _metadata$primary, _metadata$secondary;
+
+  var metadata = (_jsonLd$metadata = jsonLd.metadata) !== null && _jsonLd$metadata !== void 0 ? _jsonLd$metadata : [];
+  return {
+    primary: elementNamesToItems((_metadata$primary = metadata.primary) !== null && _metadata$primary !== void 0 ? _metadata$primary : []),
+    secondary: elementNamesToItems((_metadata$secondary = metadata.secondary) !== null && _metadata$secondary !== void 0 ? _metadata$secondary : [])
+  };
+};
+
+exports.extractMetadata = extractMetadata;

package/dist/cjs/providers/editor/transformer.js

@@ -23,10 +23,6 @@ var isJwmView = function isJwmView(url) {
   return url.match(/^https:\/\/.*?\/jira\/core\/projects\/[^\/]+?\/(timeline|calendar|list|board)\/?/);
 };
 
-var isSlackMessage = function isSlackMessage(url) {
-  return url.match(/^https:\/\/.+?\.slack\.com\/archives\/[CG][A-Z0-9]+\/p[0-9]+(\?.*)?$/);
-};
-
 var Transformer = /*#__PURE__*/function () {
   function Transformer() {
     (0, _classCallCheck2.default)(this, Transformer);
@@ -68,8 +64,6 @@ var Transformer = /*#__PURE__*/function () {
     value: function toAdf(url, appearance) {
       if (isJiraRoadMap(url) || isPolarisView(url) || isJwmView(url)) {
         return this.buildEmbedAdf(url);
-      } else if (isSlackMessage(url)) {
-        return this.buildBlockAdf(url);
       } else {
         switch (appearance) {
           case 'inline':

package/dist/cjs/ssr.js

@@ -9,7 +9,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.CardSSR = void 0;
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
@@ -17,12 +17,20 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _uuid = _interopRequireDefault(require("uuid"));
 
+var _reactErrorBoundary = require("react-error-boundary");
+
 var _component = require("./view/CardWithUrl/component");
 
+var _LazyFallback = require("./view/CardWithUrl/component-lazy/LazyFallback");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 // SSR friendly version of smart-card
 // simplifies the logic around rendering and loading placeholders and
 // only contains whats necessary to render the card on SSR mode
@@ -36,10 +44,16 @@ var CardSSR = function CardSSR(props) {
   var dispatchAnalytics = function dispatchAnalytics() {}; // we can't dispatch events on SSR, after hydration the we will provide the real callback
 
 
-  return /*#__PURE__*/_react.default.createElement(_component.CardWithUrlContent, (0, _extends2.default)({}, props, {
+  var cardProps = _objectSpread(_objectSpread({}, props), {}, {
     id: id,
     dispatchAnalytics: dispatchAnalytics
-  }));
+  });
+
+  return /*#__PURE__*/_react.default.createElement(_reactErrorBoundary.ErrorBoundary, {
+    FallbackComponent: function FallbackComponent() {
+      return /*#__PURE__*/_react.default.createElement(_LazyFallback.LoadingCardLink, cardProps);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_component.CardWithUrlContent, cardProps));
 };
 
 exports.CardSSR = CardSSR;

package/dist/cjs/utils/flexible.js

@@ -21,7 +21,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 var isFlexibleUiCard = function isFlexibleUiCard(children) {
   if (children && _react.default.Children.toArray(children).some(function (child) {
-    return isFlexibleUiBlock(child);
+    return isFlexibleUiTitleBlock(child);
   })) {
     return true;
   }

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "18.0.20",
+	"version": "18.0.23",
 	"sideEffects": false
 }

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

@@ -41,6 +41,10 @@ var _analytics2 = require("../../state/analytics");
 
 var _helpers = require("../../state/helpers");
 
+var _extractMetadata = require("../../extractors/hover/extractMetadata");
+
+var _utils = require("./utils");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -134,7 +138,9 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
     };
   }, [url, definitionId, extensionKey, analytics]);
 
-  var cardComponent = function cardComponent() {
+  var CardComponent = function CardComponent() {
+    //TODO: EDM-3224 deleted simulated and use real JsonLd
+    var metadataElements = (0, _extractMetadata.extractMetadata)((0, _utils.getSimulatedMetadata)(extensionKey));
     return (0, _core.jsx)("div", {
       onMouseEnter: initShowCard,
       onMouseLeave: initHideCard,
@@ -148,6 +154,9 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
       }
     }, (0, _core.jsx)(_blocks.TitleBlock, {
       actions: [openAction]
+    }), (0, _core.jsx)(_blocks.MetadataBlock, {
+      primary: metadataElements.primary,
+      secondary: metadataElements.secondary
     }), (0, _core.jsx)(_blocks.SnippetBlock, null), (0, _core.jsx)(_blocks.FooterBlock, {
       actions: smartlinkActions
     })));
@@ -161,7 +170,7 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
     isOpen: isOpen,
     onClose: onClose,
     placement: "bottom-start",
-    content: cardComponent,
+    content: CardComponent,
     trigger: function trigger(triggerProps) {
       return (0, _core.jsx)("span", (0, _extends2.default)({}, triggerProps, {
         onMouseEnter: initShowCard,

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

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getSimulatedMetadata = void 0;
+
+var getSimulatedMetadata = function getSimulatedMetadata(extensionKey) {
+  switch (extensionKey) {
+    case 'confluence-object-provider':
+      return {
+        metadata: {
+          primary: ['AuthorGroup', 'CreatedBy', 'CommentCount', 'ReactCount'],
+          secondary: []
+        }
+      };
+
+    case 'jira-object-provider':
+      return {
+        metadata: {
+          primary: ['AuthorGroup', 'State', 'Priority'],
+          secondary: []
+        }
+      };
+
+    default:
+      return {
+        metadata: {
+          primary: ['ModifiedOn'],
+          secondary: []
+        }
+      };
+  }
+};
+
+exports.getSimulatedMetadata = getSimulatedMetadata;

package/dist/es2019/extractors/hover/extractMetadata.js

@@ -0,0 +1,18 @@
+import { ElementName } from '../../constants';
+
+const elementNamesToItems = elementNames => {
+  return elementNames.filter(element => element in ElementName).map(elementName => ({
+    name: elementName,
+    testId: `${elementName.toLowerCase()}-metadata-element`
+  }));
+};
+
+export const extractMetadata = jsonLd => {
+  var _jsonLd$metadata, _metadata$primary, _metadata$secondary;
+
+  const metadata = (_jsonLd$metadata = jsonLd.metadata) !== null && _jsonLd$metadata !== void 0 ? _jsonLd$metadata : [];
+  return {
+    primary: elementNamesToItems((_metadata$primary = metadata.primary) !== null && _metadata$primary !== void 0 ? _metadata$primary : []),
+    secondary: elementNamesToItems((_metadata$secondary = metadata.secondary) !== null && _metadata$secondary !== void 0 ? _metadata$secondary : [])
+  };
+};

package/dist/es2019/providers/editor/transformer.js

@@ -4,8 +4,6 @@ const isPolarisView = url => url.match(/^https:\/\/.*?\/jira\/polaris\/projects\
 
 const isJwmView = url => url.match(/^https:\/\/.*?\/jira\/core\/projects\/[^\/]+?\/(timeline|calendar|list|board)\/?/);
 
-const isSlackMessage = url => url.match(/^https:\/\/.+?\.slack\.com\/archives\/[CG][A-Z0-9]+\/p[0-9]+(\?.*)?$/);
-
 export class Transformer {
   buildInlineAdf(url) {
     return {
@@ -38,8 +36,6 @@ export class Transformer {
   toAdf(url, appearance) {
     if (isJiraRoadMap(url) || isPolarisView(url) || isJwmView(url)) {
       return this.buildEmbedAdf(url);
-    } else if (isSlackMessage(url)) {
-      return this.buildBlockAdf(url);
     } else {
       switch (appearance) {
         case 'inline':

package/dist/es2019/ssr.js

@@ -1,8 +1,9 @@
-import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import { useState } from 'react';
 import uuid from 'uuid';
+import { ErrorBoundary } from 'react-error-boundary';
 import { CardWithUrlContent } from './view/CardWithUrl/component';
+import { LoadingCardLink } from './view/CardWithUrl/component-lazy/LazyFallback';
 // SSR friendly version of smart-card
 // simplifies the logic around rendering and loading placeholders and
 // only contains whats necessary to render the card on SSR mode
@@ -12,8 +13,11 @@ export const CardSSR = props => {
   const dispatchAnalytics = () => {}; // we can't dispatch events on SSR, after hydration the we will provide the real callback
 
 
-  return /*#__PURE__*/React.createElement(CardWithUrlContent, _extends({}, props, {
-    id: id,
-    dispatchAnalytics: dispatchAnalytics
-  }));
+  const cardProps = { ...props,
+    id,
+    dispatchAnalytics
+  };
+  return /*#__PURE__*/React.createElement(ErrorBoundary, {
+    FallbackComponent: () => /*#__PURE__*/React.createElement(LoadingCardLink, cardProps)
+  }, /*#__PURE__*/React.createElement(CardWithUrlContent, cardProps));
 };

package/dist/es2019/utils/flexible.js

@@ -3,7 +3,7 @@ import * as Blocks from '../view/FlexibleCard/components/blocks';
 import { TitleBlock } from '../view/FlexibleCard/components/blocks';
 import * as Elements from '../view/FlexibleCard/components/elements';
 export const isFlexibleUiCard = children => {
-  if (children && React.Children.toArray(children).some(child => isFlexibleUiBlock(child))) {
+  if (children && React.Children.toArray(children).some(child => isFlexibleUiTitleBlock(child))) {
     return true;
   }
 

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "18.0.20",
+	"version": "18.0.23",
 	"sideEffects": false
 }

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

@@ -3,7 +3,7 @@ import _extends from "@babel/runtime/helpers/extends";
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import React, { useCallback, useRef, useMemo } from 'react';
-import { TitleBlock, SnippetBlock, FooterBlock } from '../FlexibleCard/components/blocks';
+import { TitleBlock, SnippetBlock, FooterBlock, MetadataBlock } from '../FlexibleCard/components/blocks';
 import { Card } from '../Card';
 import Popup from '@atlaskit/popup';
 import { SmartLinkSize, ActionName } from '../../constants';
@@ -15,6 +15,8 @@ import { fireSmartLinkEvent } from '../../utils/analytics';
 import { useSmartCardState as useLinkState } from '../../state/store';
 import { useSmartLinkAnalytics } from '../../state/analytics';
 import { getExtensionKey, getDefinitionId } from '../../state/helpers';
+import { extractMetadata } from '../../extractors/hover/extractMetadata';
+import { getSimulatedMetadata } from './utils';
 export const HoverCardComponent = ({
   children,
   url,
@@ -89,22 +91,29 @@ export const HoverCardComponent = ({
     };
   }, [url, definitionId, extensionKey, analytics]);
 
-  const cardComponent = () => jsx("div", {
-    onMouseEnter: initShowCard,
-    onMouseLeave: initHideCard,
-    css: HoverCardContainer
-  }, jsx(Card, {
-    appearance: "block",
-    url: url,
-    ui: {
-      hideElevation: true,
-      size: SmartLinkSize.Large
-    }
-  }, jsx(TitleBlock, {
-    actions: [openAction]
-  }), jsx(SnippetBlock, null), jsx(FooterBlock, {
-    actions: smartlinkActions
-  })));
+  const CardComponent = () => {
+    //TODO: EDM-3224 deleted simulated and use real JsonLd
+    const metadataElements = extractMetadata(getSimulatedMetadata(extensionKey));
+    return jsx("div", {
+      onMouseEnter: initShowCard,
+      onMouseLeave: initHideCard,
+      css: HoverCardContainer
+    }, jsx(Card, {
+      appearance: "block",
+      url: url,
+      ui: {
+        hideElevation: true,
+        size: SmartLinkSize.Large
+      }
+    }, jsx(TitleBlock, {
+      actions: [openAction]
+    }), jsx(MetadataBlock, {
+      primary: metadataElements.primary,
+      secondary: metadataElements.secondary
+    }), jsx(SnippetBlock, null), jsx(FooterBlock, {
+      actions: smartlinkActions
+    })));
+  };
 
   const onClose = useCallback(() => setIsOpen(false), []);
   return jsx(Popup, {
@@ -112,7 +121,7 @@ export const HoverCardComponent = ({
     isOpen: isOpen,
     onClose: onClose,
     placement: "bottom-start",
-    content: cardComponent,
+    content: CardComponent,
     trigger: triggerProps => jsx("span", _extends({}, triggerProps, {
       onMouseEnter: initShowCard,
       onMouseLeave: initHideCard

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

@@ -0,0 +1,27 @@
+export const getSimulatedMetadata = extensionKey => {
+  switch (extensionKey) {
+    case 'confluence-object-provider':
+      return {
+        metadata: {
+          primary: ['AuthorGroup', 'CreatedBy', 'CommentCount', 'ReactCount'],
+          secondary: []
+        }
+      };
+
+    case 'jira-object-provider':
+      return {
+        metadata: {
+          primary: ['AuthorGroup', 'State', 'Priority'],
+          secondary: []
+        }
+      };
+
+    default:
+      return {
+        metadata: {
+          primary: ['ModifiedOn'],
+          secondary: []
+        }
+      };
+  }
+};

package/dist/esm/extractors/hover/extractMetadata.js

@@ -0,0 +1,22 @@
+import { ElementName } from '../../constants';
+
+var elementNamesToItems = function elementNamesToItems(elementNames) {
+  return elementNames.filter(function (element) {
+    return element in ElementName;
+  }).map(function (elementName) {
+    return {
+      name: elementName,
+      testId: "".concat(elementName.toLowerCase(), "-metadata-element")
+    };
+  });
+};
+
+export var extractMetadata = function extractMetadata(jsonLd) {
+  var _jsonLd$metadata, _metadata$primary, _metadata$secondary;
+
+  var metadata = (_jsonLd$metadata = jsonLd.metadata) !== null && _jsonLd$metadata !== void 0 ? _jsonLd$metadata : [];
+  return {
+    primary: elementNamesToItems((_metadata$primary = metadata.primary) !== null && _metadata$primary !== void 0 ? _metadata$primary : []),
+    secondary: elementNamesToItems((_metadata$secondary = metadata.secondary) !== null && _metadata$secondary !== void 0 ? _metadata$secondary : [])
+  };
+};

package/dist/esm/providers/editor/transformer.js

@@ -13,10 +13,6 @@ var isJwmView = function isJwmView(url) {
   return url.match(/^https:\/\/.*?\/jira\/core\/projects\/[^\/]+?\/(timeline|calendar|list|board)\/?/);
 };
 
-var isSlackMessage = function isSlackMessage(url) {
-  return url.match(/^https:\/\/.+?\.slack\.com\/archives\/[CG][A-Z0-9]+\/p[0-9]+(\?.*)?$/);
-};
-
 export var Transformer = /*#__PURE__*/function () {
   function Transformer() {
     _classCallCheck(this, Transformer);
@@ -58,8 +54,6 @@ export var Transformer = /*#__PURE__*/function () {
     value: function toAdf(url, appearance) {
       if (isJiraRoadMap(url) || isPolarisView(url) || isJwmView(url)) {
         return this.buildEmbedAdf(url);
-      } else if (isSlackMessage(url)) {
-        return this.buildBlockAdf(url);
       } else {
         switch (appearance) {
           case 'inline':

package/dist/esm/ssr.js

@@ -1,9 +1,16 @@
-import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 import React from 'react';
 import { useState } from 'react';
 import uuid from 'uuid';
+import { ErrorBoundary } from 'react-error-boundary';
 import { CardWithUrlContent } from './view/CardWithUrl/component';
+import { LoadingCardLink } from './view/CardWithUrl/component-lazy/LazyFallback';
 // SSR friendly version of smart-card
 // simplifies the logic around rendering and loading placeholders and
 // only contains whats necessary to render the card on SSR mode
@@ -17,8 +24,14 @@ export var CardSSR = function CardSSR(props) {
   var dispatchAnalytics = function dispatchAnalytics() {}; // we can't dispatch events on SSR, after hydration the we will provide the real callback
 
 
-  return /*#__PURE__*/React.createElement(CardWithUrlContent, _extends({}, props, {
+  var cardProps = _objectSpread(_objectSpread({}, props), {}, {
     id: id,
     dispatchAnalytics: dispatchAnalytics
-  }));
+  });
+
+  return /*#__PURE__*/React.createElement(ErrorBoundary, {
+    FallbackComponent: function FallbackComponent() {
+      return /*#__PURE__*/React.createElement(LoadingCardLink, cardProps);
+    }
+  }, /*#__PURE__*/React.createElement(CardWithUrlContent, cardProps));
 };

package/dist/esm/utils/flexible.js

@@ -4,7 +4,7 @@ import { TitleBlock } from '../view/FlexibleCard/components/blocks';
 import * as Elements from '../view/FlexibleCard/components/elements';
 export var isFlexibleUiCard = function isFlexibleUiCard(children) {
   if (children && React.Children.toArray(children).some(function (child) {
-    return isFlexibleUiBlock(child);
+    return isFlexibleUiTitleBlock(child);
   })) {
     return true;
   }

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "18.0.20",
+	"version": "18.0.23",
 	"sideEffects": false
 }

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

@@ -4,7 +4,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import React, { useCallback, useRef, useMemo } from 'react';
-import { TitleBlock, SnippetBlock, FooterBlock } from '../FlexibleCard/components/blocks';
+import { TitleBlock, SnippetBlock, FooterBlock, MetadataBlock } from '../FlexibleCard/components/blocks';
 import { Card } from '../Card';
 import Popup from '@atlaskit/popup';
 import { SmartLinkSize, ActionName } from '../../constants';
@@ -16,6 +16,8 @@ import { fireSmartLinkEvent } from '../../utils/analytics';
 import { useSmartCardState as useLinkState } from '../../state/store';
 import { useSmartLinkAnalytics } from '../../state/analytics';
 import { getExtensionKey, getDefinitionId } from '../../state/helpers';
+import { extractMetadata } from '../../extractors/hover/extractMetadata';
+import { getSimulatedMetadata } from './utils';
 export var HoverCardComponent = function HoverCardComponent(_ref) {
   var children = _ref.children,
       url = _ref.url,
@@ -104,7 +106,9 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
     };
   }, [url, definitionId, extensionKey, analytics]);
 
-  var cardComponent = function cardComponent() {
+  var CardComponent = function CardComponent() {
+    //TODO: EDM-3224 deleted simulated and use real JsonLd
+    var metadataElements = extractMetadata(getSimulatedMetadata(extensionKey));
     return jsx("div", {
       onMouseEnter: initShowCard,
       onMouseLeave: initHideCard,
@@ -118,6 +122,9 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
       }
     }, jsx(TitleBlock, {
       actions: [openAction]
+    }), jsx(MetadataBlock, {
+      primary: metadataElements.primary,
+      secondary: metadataElements.secondary
     }), jsx(SnippetBlock, null), jsx(FooterBlock, {
       actions: smartlinkActions
     })));
@@ -131,7 +138,7 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
     isOpen: isOpen,
     onClose: onClose,
     placement: "bottom-start",
-    content: cardComponent,
+    content: CardComponent,
     trigger: function trigger(triggerProps) {
       return jsx("span", _extends({}, triggerProps, {
         onMouseEnter: initShowCard,

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

@@ -0,0 +1,27 @@
+export var getSimulatedMetadata = function getSimulatedMetadata(extensionKey) {
+  switch (extensionKey) {
+    case 'confluence-object-provider':
+      return {
+        metadata: {
+          primary: ['AuthorGroup', 'CreatedBy', 'CommentCount', 'ReactCount'],
+          secondary: []
+        }
+      };
+
+    case 'jira-object-provider':
+      return {
+        metadata: {
+          primary: ['AuthorGroup', 'State', 'Priority'],
+          secondary: []
+        }
+      };
+
+    default:
+      return {
+        metadata: {
+          primary: ['ModifiedOn'],
+          secondary: []
+        }
+      };
+  }
+};

package/dist/types/extractors/hover/extractMetadata.d.ts

@@ -0,0 +1,3 @@
+import { MetadataOptions } from '../../view/HoverCard/types';
+import { JsonLd } from 'json-ld-types';
+export declare const extractMetadata: (jsonLd: JsonLd.Primitives.Property<any>) => MetadataOptions;

package/dist/types/view/HoverCard/types.d.ts

@@ -1,6 +1,11 @@
 import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
+import { ElementItem } from '../FlexibleCard/components/blocks/types';
 export interface HoverCardProps extends WithAnalyticsEventsProps {
     url: string;
 }
 export declare type PreviewDisplay = 'card' | 'embed';
 export declare type PreviewInvokeMethod = 'keyboard' | 'mouse_hover' | 'mouse_click';
+export interface MetadataOptions {
+    primary: Array<ElementItem>;
+    secondary: Array<ElementItem>;
+}

package/dist/types/view/HoverCard/utils.d.ts

@@ -0,0 +1,2 @@
+import { JsonLd } from 'json-ld-types';
+export declare const getSimulatedMetadata: (extensionKey: string) => JsonLd.Primitives.Property<any>;

package/package.json

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