@atlaskit/smart-card 17.7.2 → 17.7.5

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/smart-card
 
+## 17.7.5
+
+### Patch Changes
+
+- [`b89ef291fb9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b89ef291fb9) - EDM-2902: Move common component out of BlockCard
+
+## 17.7.4
+
+### Patch Changes
+
+- [`ff7b1126682`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ff7b1126682) - Set up base component and relevant tests for hover previews
+
+## 17.7.3
+
+### Patch Changes
+
+- [`474d69913ef`](https://bitbucket.org/atlassian/atlassian-frontend/commits/474d69913ef) - Title block can have an action visible only on hover
+
 ## 17.7.2
 
 ### Patch Changes

package/dist/cjs/classNames.js

@@ -84,7 +84,7 @@ Object.defineProperty(exports, "metadataListClassName", {
 
 var _ContentFooter = require("./view/BlockCard/components/ContentFooter");
 
-var _MetadataList = require("./view/BlockCard/components/MetadataList");
+var _MetadataList = require("./view/common/MetadataList");
 
 var _ResolvingView = require("./view/BlockCard/views/ResolvingView");
 
@@ -92,7 +92,7 @@ var _ResolvedView = require("./view/BlockCard/views/ResolvedView");
 
 var _ForbiddenView = require("./view/BlockCard/views/ForbiddenView");
 
-var _Icon = require("./view/BlockCard/components/Icon");
+var _Icon = require("./view/common/Icon");
 
 var _Content = require("./view/BlockCard/components/Content");
 

package/dist/cjs/version.json

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

package/dist/cjs/view/BlockCard/actions/PreviewAction.js

@@ -81,7 +81,7 @@ function _previewFunction() {
 
             _context.next = 5;
             return Promise.resolve().then(function () {
-              return _interopRequireWildcard(require('../components/Modal'));
+              return _interopRequireWildcard(require('../../common/Modal'));
             });
 
           case 5:

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

@@ -25,7 +25,7 @@ var _more = _interopRequireDefault(require("@atlaskit/icon/glyph/more"));
 
 var _Action = require("./Action");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 var _excluded = ["triggerRef"];
 

package/dist/cjs/view/BlockCard/components/CollaboratorList.js

@@ -11,7 +11,7 @@ var _core = require("@emotion/core");
 
 var _avatarGroup = _interopRequireDefault(require("@atlaskit/avatar-group"));
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var CollaboratorList = function CollaboratorList(_ref) {

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

@@ -7,7 +7,7 @@ exports.blockCardContentClassName = exports.Content = void 0;
 
 var _core = require("@emotion/core");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var blockCardContentClassName = 'block-card-content';

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

@@ -7,7 +7,7 @@ exports.contentFooterClassName = exports.ContentFooter = void 0;
 
 var _core = require("@emotion/core");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var contentFooterClassName = 'smart-link-content-footer';

package/dist/cjs/view/BlockCard/components/Emoji.js

@@ -11,7 +11,7 @@ var _core = require("@emotion/core");
 
 var _react = _interopRequireDefault(require("react"));
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var Emoji = function Emoji(_ref) {

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

@@ -15,7 +15,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _colors = require("@atlaskit/theme/colors");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 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; }
 

package/dist/cjs/view/BlockCard/components/Name.js

@@ -9,7 +9,7 @@ var _core = require("@emotion/core");
 
 var _constants = require("@atlaskit/theme/constants");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var blockCardContentHeaderNameClassName = 'block-card-content-header-name';

package/dist/cjs/view/BlockCard/components/Provider.js

@@ -9,7 +9,7 @@ var _core = require("@emotion/core");
 
 var _colors = require("@atlaskit/theme/colors");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var Provider = function Provider(_ref) {

package/dist/cjs/view/BlockCard/components/Thumbnail.js

@@ -11,7 +11,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _core = require("@emotion/core");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 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; }
 

package/dist/cjs/view/BlockCard/views/ErroredView.js

@@ -21,7 +21,7 @@ var _warning = _interopRequireDefault(require("@atlaskit/icon/glyph/warning"));
 
 var _Frame = require("../components/Frame");
 
-var _Byline = require("../components/Byline");
+var _Byline = require("../../common/Byline");
 
 var _ActionList = require("../components/ActionList");
 

package/dist/cjs/view/BlockCard/views/ForbiddenView.js

@@ -23,7 +23,7 @@ var _Frame = require("../components/Frame");
 
 var _Provider = require("../components/Provider");
 
-var _Byline = require("../components/Byline");
+var _Byline = require("../../common/Byline");
 
 var _ActionList = require("../components/ActionList");
 

package/dist/cjs/view/BlockCard/views/NotFoundView.js

@@ -23,7 +23,7 @@ var _Frame = require("../components/Frame");
 
 var _Provider = require("../components/Provider");
 
-var _Byline = require("../components/Byline");
+var _Byline = require("../../common/Byline");
 
 var _Content = require("../components/Content");
 

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

@@ -19,7 +19,7 @@ var _Provider = require("../components/Provider");
 
 var _Name = require("../components/Name");
 
-var _Byline = require("../components/Byline");
+var _Byline = require("../../common/Byline");
 
 var _ActionList = require("../components/ActionList");
 
@@ -27,11 +27,11 @@ var _CollaboratorList = require("../components/CollaboratorList");
 
 var _Emoji = require("../components/Emoji");
 
-var _Icon = require("../components/Icon");
+var _Icon = require("../../common/Icon");
 
 var _Content = require("../components/Content");
 
-var _MetadataList = require("../components/MetadataList");
+var _MetadataList = require("../../common/MetadataList");
 
 var _styled = require("../../InlineCard/IconAndTitleLayout/styled");
 
@@ -39,7 +39,7 @@ var _ContentHeader = require("../components/ContentHeader");
 
 var _ContentFooter = require("../components/ContentFooter");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 var _handlers = require("../utils/handlers");
 

package/dist/cjs/view/BlockCard/views/ResolvingView.js

@@ -17,7 +17,7 @@ var _constants = require("@atlaskit/theme/constants");
 
 var _Frame = require("../components/Frame");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 var _reactIntlNext = require("react-intl-next");
 

package/dist/cjs/view/BlockCard/views/UnauthorizedView.js

@@ -19,7 +19,7 @@ var _Frame = require("../components/Frame");
 
 var _Provider = require("../components/Provider");
 
-var _Byline = require("../components/Byline");
+var _Byline = require("../../common/Byline");
 
 var _ActionList = require("../components/ActionList");
 

package/dist/cjs/view/EmbedCard/components/styled.js

@@ -19,7 +19,7 @@ var _constants = require("@atlaskit/theme/constants");
 
 var colors = _interopRequireWildcard(require("@atlaskit/theme/colors"));
 
-var _utils = require("../../BlockCard/utils");
+var _utils = require("../../common/utils");
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
 

package/dist/cjs/view/EmbedCard/views/ErroredView.js

@@ -23,7 +23,7 @@ var _reactIntlNext = require("react-intl-next");
 
 var _messages = require("@atlaskit/media-ui/messages");
 
-var _utils = require("../../BlockCard/utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var EmbedCardErroredView = function EmbedCardErroredView(_ref) {

package/dist/cjs/view/EmbedCard/views/UnresolvedView.js

@@ -19,7 +19,7 @@ var _reactIntlNext = require("react-intl-next");
 
 var _messages = require("@atlaskit/media-ui/messages");
 
-var _utils = require("../../BlockCard/utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var EmbedCardUnresolvedView = function EmbedCardUnresolvedView(_ref) {

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

@@ -40,18 +40,26 @@ var ActionGroup = function ActionGroup(_ref) {
       items = _ref$items === void 0 ? [] : _ref$items,
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? _constants.SmartLinkSize.Medium : _ref$size,
-      appearance = _ref.appearance;
-  var isMoreThenTwoItems = items.length > 2;
-  var firstActions = isMoreThenTwoItems ? items.slice(0, 1) : items;
-  var restActions = isMoreThenTwoItems ? items.slice(1) : [];
+      appearance = _ref.appearance,
+      _ref$visibleButtonsNu = _ref.visibleButtonsNum,
+      visibleButtonsNum = _ref$visibleButtonsNu === void 0 ? 2 : _ref$visibleButtonsNu,
+      onDropdownOpenChange = _ref.onDropdownOpenChange;
+  var isMoreThenTwoItems = items.length > visibleButtonsNum;
+  var firstActions = isMoreThenTwoItems ? items.slice(0, visibleButtonsNum - 1) : items;
+  var restActions = isMoreThenTwoItems ? items.slice(visibleButtonsNum - 1) : [];
   return (0, _core.jsx)("div", {
     css: styles
   }, (0, _core.jsx)(_buttonGroup.default, null, (0, _utils.renderActionItems)(firstActions, size, appearance), restActions.length > 0 ? (0, _core.jsx)(_dropdownMenu.default, {
-    trigger: function trigger(_ref2) {
-      var triggerRef = _ref2.triggerRef,
-          props = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+    onOpenChange: function onOpenChange(_ref2) {
+      var isOpen = _ref2.isOpen;
+      return onDropdownOpenChange && onDropdownOpenChange(isOpen);
+    },
+    trigger: function trigger(_ref3) {
+      var triggerRef = _ref3.triggerRef,
+          props = (0, _objectWithoutProperties2.default)(_ref3, _excluded);
       return (0, _core.jsx)(_standardButton.default, (0, _extends2.default)({}, props, {
         spacing: _action.sizeToSpacing[size],
+        className: "action-group-more-button",
         testId: "action-group-more-button",
         iconBefore: (0, _core.jsx)(_more.default, {
           label: "more"

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

@@ -30,9 +30,10 @@ var Block = function Block(_ref) {
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? _constants.SmartLinkSize.Medium : _ref$size,
       _ref$testId = _ref.testId,
-      testId = _ref$testId === void 0 ? 'smart-block' : _ref$testId;
+      testId = _ref$testId === void 0 ? 'smart-block' : _ref$testId,
+      extraCss = _ref.extraCss;
   return (0, _core.jsx)("div", {
-    css: getBlockStyles(direction, size),
+    css: [getBlockStyles(direction, size), extraCss],
     "data-smart-block": true,
     "data-testid": testId
   }, (0, _utils.renderChildren)(children, size));

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

@@ -2,6 +2,8 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
+var _typeof = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,9 +11,15 @@ exports.default = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
-var _react = _interopRequireDefault(require("react"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _core = require("@emotion/core");
 
 var _elements = require("../../../elements");
 
@@ -25,7 +33,15 @@ var _utils = require("../../utils");
 
 var _actionGroup = _interopRequireDefault(require("../../action-group"));
 
-var _excluded = ["maxLines", "metadata", "position", "subtitle", "actions", "testId", "theme", "text"];
+var _excluded = ["maxLines", "metadata", "position", "subtitle", "actions", "testId", "theme", "text", "showActionOnHover"];
+
+var _templateObject;
+
+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; }
+
+var actionOnHoverOnlyStyle = (0, _core.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .action-group-more-button {\n    visibility: hidden;\n  }\n\n  &:hover {\n    .action-group-more-button {\n      visibility: visible;\n    }\n  }\n"])));
 
 var TitleBlockResolvedView = function TitleBlockResolvedView(_ref) {
   var maxLines = _ref.maxLines,
@@ -39,29 +55,42 @@ var TitleBlockResolvedView = function TitleBlockResolvedView(_ref) {
       testId = _ref.testId,
       theme = _ref.theme,
       text = _ref.text,
+      showActionOnHover = _ref.showActionOnHover,
       blockProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      actionDropdownOpen = _useState2[0],
+      setActionDropdownOpen = _useState2[1];
+
   var metadataElements = (0, _utils.renderElementItems)(metadata);
   var subtitleElements = (0, _utils.renderElementItems)(subtitle);
   var overrideText = !!text ? {
     text: text
   } : {};
-  return /*#__PURE__*/_react.default.createElement(_block.default, (0, _extends2.default)({}, blockProps, {
-    testId: "".concat(testId, "-resolved-view")
-  }), /*#__PURE__*/_react.default.createElement(_elements.LinkIcon, {
+  var extraCss = showActionOnHover && !actionDropdownOpen ? actionOnHoverOnlyStyle : undefined;
+  return (0, _core.jsx)(_block.default, (0, _extends2.default)({}, blockProps, {
+    testId: "".concat(testId, "-resolved-view"),
+    extraCss: extraCss
+  }), (0, _core.jsx)(_elements.LinkIcon, {
     position: position
-  }), /*#__PURE__*/_react.default.createElement(_elementGroup.default, {
+  }), (0, _core.jsx)(_elementGroup.default, {
     direction: _constants.SmartLinkDirection.Vertical,
     width: _constants.SmartLinkWidth.Flexible
-  }, /*#__PURE__*/_react.default.createElement(_elements.Title, (0, _extends2.default)({
+  }, (0, _core.jsx)(_elements.Title, (0, _extends2.default)({
     maxLines: maxLines,
     theme: theme
-  }, overrideText)), subtitleElements && /*#__PURE__*/_react.default.createElement(_elementGroup.default, {
+  }, overrideText)), subtitleElements && (0, _core.jsx)(_elementGroup.default, {
     direction: _constants.SmartLinkDirection.Horizontal
-  }, subtitleElements)), metadataElements && /*#__PURE__*/_react.default.createElement(_elementGroup.default, {
+  }, subtitleElements)), metadataElements && (0, _core.jsx)(_elementGroup.default, {
     direction: _constants.SmartLinkDirection.Horizontal,
     align: _constants.SmartLinkAlignment.Right
-  }, metadataElements), actions.length > 0 && /*#__PURE__*/_react.default.createElement(_actionGroup.default, {
-    items: actions
+  }, metadataElements), actions.length > 0 && (0, _core.jsx)(_actionGroup.default, {
+    items: actions,
+    visibleButtonsNum: showActionOnHover ? 1 : 2,
+    onDropdownOpenChange: function onDropdownOpenChange(isOpen) {
+      return setActionDropdownOpen(isOpen);
+    }
   }));
 };
 

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

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HoverCard = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
+
+var _blocks = require("../FlexibleCard/components/blocks");
+
+var _Card = require("../Card");
+
+var _styled = require("./styled");
+
+var HoverCard = function HoverCard(_ref) {
+  var children = _ref.children,
+      url = _ref.url;
+
+  var cardComponent = /*#__PURE__*/_react.default.createElement(_Card.Card, {
+    appearance: "block",
+    url: url
+  }, /*#__PURE__*/_react.default.createElement(_blocks.TitleBlock, null), /*#__PURE__*/_react.default.createElement(_blocks.SnippetBlock, null), /*#__PURE__*/_react.default.createElement(_blocks.FooterBlock, null));
+
+  return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+    content: cardComponent,
+    component: _styled.HoverCardContainer,
+    testId: "hover-card",
+    tag: "span"
+  }, children);
+};
+
+exports.HoverCard = HoverCard;

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

@@ -0,0 +1,19 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HoverCardContainer = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _tooltip = require("@atlaskit/tooltip");
+
+var _templateObject;
+
+var HoverCardContainer = (0, _styled.default)(_tooltip.TooltipPrimitive)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  background: none;\n  border-width: 0;\n  box-sizing: content-box; /* do not set this to border-box or it will break the overflow handling */\n  max-width: 500px;\n  padding: 0;\n"])));
+exports.HoverCardContainer = HoverCardContainer;

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

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/view/InlineCard/ResolvedView/index.js

@@ -27,6 +27,8 @@ var _IconAndTitleLayout = require("../IconAndTitleLayout");
 
 var _styled = require("../IconAndTitleLayout/styled");
 
+var _index = require("../../../view/HoverCard/index");
+
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -68,8 +70,11 @@ var InlineCardResolvedView = /*#__PURE__*/function (_React$Component) {
           _this$props$testId = _this$props.testId,
           testId = _this$props$testId === void 0 ? 'inline-card-resolved-view' : _this$props$testId,
           titleTextColor = _this$props.titleTextColor,
-          titlePrefix = _this$props.titlePrefix;
-      return /*#__PURE__*/_react.default.createElement(_Frame.Frame, {
+          titlePrefix = _this$props.titlePrefix,
+          _this$props$showHover = _this$props.showHoverPreview,
+          showHoverPreview = _this$props$showHover === void 0 ? false : _this$props$showHover;
+
+      var inlineCardResolvedView = /*#__PURE__*/_react.default.createElement(_Frame.Frame, {
         testId: testId,
         link: link,
         isSelected: isSelected,
@@ -80,6 +85,14 @@ var InlineCardResolvedView = /*#__PURE__*/function (_React$Component) {
         title: title,
         titleTextColor: titleTextColor
       }), this.renderLozenge());
+
+      if (showHoverPreview && link) {
+        return /*#__PURE__*/_react.default.createElement(_index.HoverCard, {
+          url: link
+        }, inlineCardResolvedView);
+      }
+
+      return inlineCardResolvedView;
     }
   }]);
   return InlineCardResolvedView;

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

@@ -70,7 +70,8 @@ var InlineCard = function InlineCard(_ref) {
       renderers = _ref.renderers,
       onResolve = _ref.onResolve,
       testId = _ref.testId,
-      inlinePreloaderStyle = _ref.inlinePreloaderStyle;
+      inlinePreloaderStyle = _ref.inlinePreloaderStyle,
+      showHoverPreview = _ref.showHoverPreview;
   var status = cardState.status,
       details = cardState.details;
   var cardDetails = details && details.data || (0, _jsonld.getEmptyJsonLd)();
@@ -98,6 +99,7 @@ var InlineCard = function InlineCard(_ref) {
       }
 
       return /*#__PURE__*/_react.default.createElement(_ResolvedView.InlineCardResolvedView, (0, _extends2.default)({}, resolvedProps, {
+        showHoverPreview: showHoverPreview,
         link: url,
         isSelected: isSelected,
         onClick: handleFrameClick,

package/dist/cjs/view/{BlockCard/components → common}/Byline.js

@@ -9,7 +9,7 @@ var _core = require("@emotion/core");
 
 var _colors = require("@atlaskit/theme/colors");
 
-var _utils = require("../utils");
+var _utils = require("./utils");
 
 /** @jsx jsx */
 var Byline = function Byline(_ref) {

package/dist/cjs/view/{BlockCard/components → common}/Icon.js

@@ -15,7 +15,7 @@ var _reactRenderImage = _interopRequireDefault(require("react-render-image"));
 
 var _link = _interopRequireDefault(require("@atlaskit/icon/glyph/link"));
 
-var _utils = require("../utils");
+var _utils = require("./utils");
 
 /** @jsx jsx */
 var blockCardIconImageClassName = 'block-card-icon-image';

package/dist/cjs/view/{BlockCard/components → common}/Metadata.js

@@ -11,7 +11,7 @@ var _core = require("@emotion/core");
 
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 
-var _utils = require("../utils");
+var _utils = require("./utils");
 
 var _colors = require("@atlaskit/theme/colors");
 

package/dist/cjs/view/{BlockCard/components → common}/MetadataList.js

@@ -13,7 +13,7 @@ var _core = require("@emotion/core");
 
 var _Metadata = require("./Metadata");
 
-var _utils = require("../utils");
+var _utils = require("./utils");
 
 /** @jsx jsx */
 var metadataListClassName = 'smart-link-metadata-list';

package/dist/cjs/view/{BlockCard/components → common}/Modal.js

@@ -27,7 +27,7 @@ var _modalDialog = _interopRequireWildcard(require("@atlaskit/modal-dialog"));
 
 var _ModalHeader = require("./ModalHeader");
 
-var _utils = require("../../../utils");
+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); }
 

package/dist/cjs/view/{BlockCard/components → common}/ModalHeader.js

@@ -23,7 +23,7 @@ var _colors = require("@atlaskit/theme/colors");
 
 var _reactIntlNext = require("react-intl-next");
 
-var _utils = require("../utils");
+var _utils = require("./utils");
 
 var _Icon = require("./Icon");
 

package/dist/es2019/classNames.js

@@ -1,9 +1,9 @@
 export { contentFooterClassName } from './view/BlockCard/components/ContentFooter';
-export { metadataListClassName } from './view/BlockCard/components/MetadataList';
+export { metadataListClassName } from './view/common/MetadataList';
 export { blockCardResolvingViewClassName } from './view/BlockCard/views/ResolvingView';
 export { blockCardResolvedViewClassName, blockCardResolvedViewByClassName } from './view/BlockCard/views/ResolvedView';
 export { blockCardForbiddenViewClassName, blockCardForbiddenViewLinkClassName } from './view/BlockCard/views/ForbiddenView';
-export { blockCardIconImageClassName } from './view/BlockCard/components/Icon';
+export { blockCardIconImageClassName } from './view/common/Icon';
 export { blockCardContentClassName } from './view/BlockCard/components/Content';
 export { blockCardContentHeaderClassName } from './view/BlockCard/components/ContentHeader';
 export { blockCardContentHeaderNameClassName } from './view/BlockCard/components/Name';

package/dist/es2019/version.json

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

package/dist/es2019/view/BlockCard/actions/PreviewAction.js

@@ -32,7 +32,7 @@ export async function previewFunction({
     document.body.appendChild(popupMountPoint);
   }
 
-  let Modal = await import('../components/Modal');
+  let Modal = await import('../../common/Modal');
   ReactDOM.render( /*#__PURE__*/React.createElement(IntlProvider, {
     locale: "en"
   }, /*#__PURE__*/React.createElement(Modal.default, _extends({}, rest, {