@atlaskit/smart-card 23.8.0 → 23.8.1

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/smart-card
 
+## 23.8.1
+
+### Patch Changes
+
+- [`af251caa485`](https://bitbucket.org/atlassian/atlassian-frontend/commits/af251caa485) - Push div from hoverCardComponent into hoverCardContent to allow conditional rendering from inside hoverCardContent.
+
 ## 23.8.0
 
 ### Minor Changes

package/dist/cjs/version.json

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

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

@@ -7,7 +7,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.hoverCardClassName = exports.HoverCardComponent = void 0;
+exports.HoverCardComponent = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
@@ -36,9 +36,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 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; }
 
 /** @jsx jsx */
-var hoverCardClassName = 'smart-links-hover-preview';
-exports.hoverCardClassName = hoverCardClassName;
-
 var HoverCardComponent = function HoverCardComponent(_ref) {
   var children = _ref.children,
       url = _ref.url,
@@ -137,9 +134,6 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
     }
   }, [hideCard]); // Stop hover preview content to propagate event to parent.
 
-  var onClick = (0, _react2.useCallback)(function (e) {
-    return e.stopPropagation();
-  }, []);
   return (0, _react.jsx)(_popup.default, {
     testId: "hover-card",
     isOpen: isOpen,
@@ -149,14 +143,9 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
     autoFocus: false,
     content: function content(_ref2) {
       var update = _ref2.update;
-      return (0, _react.jsx)("div", {
+      return (0, _react.jsx)(_HoverCardContent.default, {
         onMouseEnter: initShowCard,
         onMouseLeave: initHideCard,
-        onClick: onClick,
-        css: _styled.HoverCardContainer // class name for trello to exclude click events
-        ,
-        className: hoverCardClassName
-      }, (0, _react.jsx)(_HoverCardContent.default, {
         analytics: analytics,
         cardActions: linkActions,
         cardState: linkState,
@@ -164,7 +153,7 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
         onResolve: update,
         renderers: renderers,
         url: url
-      }));
+      });
     },
     trigger: function trigger(triggerProps) {
       return (0, _react.jsx)("span", {

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

@@ -7,13 +7,15 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getOpenAction = exports.default = void 0;
+exports.hoverCardClassName = exports.getOpenAction = exports.default = void 0;
+
+var _react = require("@emotion/react");
 
 var _shortcut = _interopRequireDefault(require("@atlaskit/icon/glyph/shortcut"));
 
 var _extractors = require("@atlaskit/linking-common/extractors");
 
-var _react = _interopRequireWildcard(require("react"));
+var _react2 = _interopRequireWildcard(require("react"));
 
 var _constants = require("../../../constants");
 
@@ -41,10 +43,14 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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; }
 
+/** @jsx jsx */
+var hoverCardClassName = 'smart-links-hover-preview';
+exports.hoverCardClassName = hoverCardClassName;
+
 var getOpenAction = function getOpenAction(url, analytics, onActionClick) {
   return {
     name: _constants.ActionName.CustomAction,
-    icon: /*#__PURE__*/_react.default.createElement(_shortcut.default, {
+    icon: (0, _react.jsx)(_shortcut.default, {
       label: "open in new tab",
       size: "medium"
     }),
@@ -59,7 +65,7 @@ var getOpenAction = function getOpenAction(url, analytics, onActionClick) {
         previewDisplay: 'card'
       });
     },
-    tooltipMessage: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.open_link_in_a_new_tab),
+    tooltipMessage: (0, _react.jsx)(_reactIntlNext.FormattedMessage, _messages.messages.open_link_in_a_new_tab),
     testId: 'hover-card-open-button'
   };
 };
@@ -78,11 +84,13 @@ var HoverCardContent = function HoverCardContent(_ref) {
       onActionClick = _ref.onActionClick,
       onResolve = _ref.onResolve,
       renderers = _ref.renderers,
-      url = _ref.url;
-  var extensionKey = (0, _react.useMemo)(function () {
+      url = _ref.url,
+      onMouseEnter = _ref.onMouseEnter,
+      onMouseLeave = _ref.onMouseLeave;
+  var extensionKey = (0, _react2.useMemo)(function () {
     return (0, _helpers.getExtensionKey)(cardState.details);
   }, [cardState.details]);
-  var onClick = (0, _react.useCallback)(function (event) {
+  var onClick = (0, _react2.useCallback)(function (event) {
     var isModifierKeyPressed = (0, _utils.isSpecialEvent)(event);
     analytics.ui.cardClickedEvent({
       id: id,
@@ -92,7 +100,7 @@ var HoverCardContent = function HoverCardContent(_ref) {
       actionSubjectId: 'titleGoToLink'
     });
   }, [cardState.status, analytics.ui, id]);
-  var titleActions = (0, _react.useMemo)(function () {
+  var titleActions = (0, _react2.useMemo)(function () {
     return [getOpenAction(url, analytics, onActionClick)];
   }, [url, analytics, onActionClick]);
   var data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
@@ -119,36 +127,53 @@ var HoverCardContent = function HoverCardContent(_ref) {
     url: url,
     children: {}
   };
+  var onClickStopPropagation = (0, _react2.useCallback)(function (e) {
+    return e.stopPropagation();
+  }, []);
+
+  var getCardView = function getCardView(cardState) {
+    if (cardState.metadataStatus === 'pending') {
+      return (0, _react.jsx)(_resolving.default, {
+        flexibleCardProps: flexibleCardProps,
+        titleBlockProps: titleBlockProps
+      });
+    }
+
+    if (cardState.status === 'unauthorized') {
+      return (0, _react.jsx)(_unauthorised.default, {
+        analytics: analytics,
+        extensionKey: extensionKey,
+        id: id,
+        flexibleCardProps: flexibleCardProps,
+        url: url
+      });
+    }
+
+    if (cardState.status === 'resolved') {
+      return (0, _react.jsx)(_resolved.default, {
+        id: id,
+        url: url,
+        extensionKey: extensionKey,
+        analytics: analytics,
+        cardActions: cardActions,
+        cardState: cardState,
+        flexibleCardProps: flexibleCardProps,
+        onActionClick: onActionClick,
+        titleBlockProps: titleBlockProps
+      });
+    }
 
-  if (cardState.metadataStatus === 'pending') {
-    return /*#__PURE__*/_react.default.createElement(_resolving.default, {
-      flexibleCardProps: flexibleCardProps,
-      titleBlockProps: titleBlockProps
-    });
-  }
-
-  if (cardState.status === 'unauthorized') {
-    return /*#__PURE__*/_react.default.createElement(_unauthorised.default, {
-      analytics: analytics,
-      extensionKey: extensionKey,
-      id: id,
-      flexibleCardProps: flexibleCardProps,
-      url: url
-    });
-  } // if metadataStatus is 'errored' simply render using data available (normal path)
-
+    return null;
+  };
 
-  return /*#__PURE__*/_react.default.createElement(_resolved.default, {
-    id: id,
-    url: url,
-    extensionKey: extensionKey,
-    analytics: analytics,
-    cardActions: cardActions,
-    cardState: cardState,
-    flexibleCardProps: flexibleCardProps,
-    onActionClick: onActionClick,
-    titleBlockProps: titleBlockProps
-  });
+  var cardView = getCardView(cardState);
+  return cardView ? (0, _react.jsx)("div", {
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave,
+    onClick: onClickStopPropagation,
+    className: hoverCardClassName,
+    css: _styled.HoverCardContainer
+  }, cardView) : null;
 };
 
 var _default = HoverCardContent;

package/dist/es2019/version.json

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

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

@@ -8,9 +8,8 @@ import { useSmartLinkActions } from '../../../state/hooks-external/useSmartLinkA
 import { useSmartLinkRenderers } from '../../../state/renderers';
 import { useSmartCardState as useLinkState } from '../../../state/store';
 import HoverCardContent from '../components/HoverCardContent';
-import { HoverCardContainer, CARD_GAP_PX } from '../styled';
+import { CARD_GAP_PX } from '../styled';
 import { CardDisplay } from '../../../constants';
-export const hoverCardClassName = 'smart-links-hover-preview';
 export const HoverCardComponent = ({
   children,
   url,
@@ -103,7 +102,6 @@ export const HoverCardComponent = ({
     }
   }, [hideCard]); // Stop hover preview content to propagate event to parent.
 
-  const onClick = useCallback(e => e.stopPropagation(), []);
   return jsx(Popup, {
     testId: "hover-card",
     isOpen: isOpen,
@@ -113,14 +111,9 @@ export const HoverCardComponent = ({
     autoFocus: false,
     content: ({
       update
-    }) => jsx("div", {
+    }) => jsx(HoverCardContent, {
       onMouseEnter: initShowCard,
       onMouseLeave: initHideCard,
-      onClick: onClick,
-      css: HoverCardContainer // class name for trello to exclude click events
-      ,
-      className: hoverCardClassName
-    }, jsx(HoverCardContent, {
       analytics: analytics,
       cardActions: linkActions,
       cardState: linkState,
@@ -128,7 +121,7 @@ export const HoverCardComponent = ({
       onResolve: update,
       renderers: renderers,
       url: url
-    })),
+    }),
     trigger: triggerProps => jsx("span", {
       ref: parentSpan
     }, jsx("span", _extends({}, triggerProps, {

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

@@ -1,3 +1,5 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
 import ShortcutIcon from '@atlaskit/icon/glyph/shortcut';
 import { extractType } from '@atlaskit/linking-common/extractors';
 import React, { useCallback, useMemo } from 'react';
@@ -5,16 +7,17 @@ import { ActionName, CardDisplay, SmartLinkPosition, SmartLinkSize } from '../..
 import { extractMetadata } from '../../../extractors/hover/extractMetadata';
 import { getExtensionKey } from '../../../state/helpers';
 import { isSpecialEvent } from '../../../utils';
-import { flexibleUiOptions, titleBlockCss } from '../styled';
+import { HoverCardContainer, flexibleUiOptions, titleBlockCss } from '../styled';
 import { getSimulatedMetadata } from '../utils';
 import HoverCardLoadingView from './views/resolving';
 import HoverCardUnauthorisedView from './views/unauthorised';
 import HoverCardResolvedView from './views/resolved';
 import { FormattedMessage } from 'react-intl-next';
 import { messages } from '../../../messages';
+export const hoverCardClassName = 'smart-links-hover-preview';
 export const getOpenAction = (url, analytics, onActionClick) => ({
   name: ActionName.CustomAction,
-  icon: /*#__PURE__*/React.createElement(ShortcutIcon, {
+  icon: jsx(ShortcutIcon, {
     label: "open in new tab",
     size: "medium"
   }),
@@ -29,7 +32,7 @@ export const getOpenAction = (url, analytics, onActionClick) => ({
       previewDisplay: 'card'
     });
   },
-  tooltipMessage: /*#__PURE__*/React.createElement(FormattedMessage, messages.open_link_in_a_new_tab),
+  tooltipMessage: jsx(FormattedMessage, messages.open_link_in_a_new_tab),
   testId: 'hover-card-open-button'
 });
 
@@ -41,7 +44,9 @@ const HoverCardContent = ({
   onActionClick,
   onResolve,
   renderers,
-  url
+  url,
+  onMouseEnter,
+  onMouseLeave
 }) => {
   var _cardState$details;
 
@@ -80,36 +85,51 @@ const HoverCardContent = ({
     url: url,
     children: {}
   };
+  const onClickStopPropagation = useCallback(e => e.stopPropagation(), []);
 
-  if (cardState.metadataStatus === 'pending') {
-    return /*#__PURE__*/React.createElement(HoverCardLoadingView, {
-      flexibleCardProps: flexibleCardProps,
-      titleBlockProps: titleBlockProps
-    });
-  }
+  const getCardView = cardState => {
+    if (cardState.metadataStatus === 'pending') {
+      return jsx(HoverCardLoadingView, {
+        flexibleCardProps: flexibleCardProps,
+        titleBlockProps: titleBlockProps
+      });
+    }
 
-  if (cardState.status === 'unauthorized') {
-    return /*#__PURE__*/React.createElement(HoverCardUnauthorisedView, {
-      analytics: analytics,
-      extensionKey: extensionKey,
-      id: id,
-      flexibleCardProps: flexibleCardProps,
-      url: url
-    });
-  } // if metadataStatus is 'errored' simply render using data available (normal path)
+    if (cardState.status === 'unauthorized') {
+      return jsx(HoverCardUnauthorisedView, {
+        analytics: analytics,
+        extensionKey: extensionKey,
+        id: id,
+        flexibleCardProps: flexibleCardProps,
+        url: url
+      });
+    }
 
+    if (cardState.status === 'resolved') {
+      return jsx(HoverCardResolvedView, {
+        id: id,
+        url: url,
+        extensionKey: extensionKey,
+        analytics: analytics,
+        cardActions: cardActions,
+        cardState: cardState,
+        flexibleCardProps: flexibleCardProps,
+        onActionClick: onActionClick,
+        titleBlockProps: titleBlockProps
+      });
+    }
 
-  return /*#__PURE__*/React.createElement(HoverCardResolvedView, {
-    id: id,
-    url: url,
-    extensionKey: extensionKey,
-    analytics: analytics,
-    cardActions: cardActions,
-    cardState: cardState,
-    flexibleCardProps: flexibleCardProps,
-    onActionClick: onActionClick,
-    titleBlockProps: titleBlockProps
-  });
+    return null;
+  };
+
+  const cardView = getCardView(cardState);
+  return cardView ? jsx("div", {
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave,
+    onClick: onClickStopPropagation,
+    className: hoverCardClassName,
+    css: HoverCardContainer
+  }, cardView) : null;
 };
 
 export default HoverCardContent;

package/dist/esm/version.json

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

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

@@ -9,9 +9,8 @@ import { useSmartLinkActions } from '../../../state/hooks-external/useSmartLinkA
 import { useSmartLinkRenderers } from '../../../state/renderers';
 import { useSmartCardState as useLinkState } from '../../../state/store';
 import HoverCardContent from '../components/HoverCardContent';
-import { HoverCardContainer, CARD_GAP_PX } from '../styled';
+import { CARD_GAP_PX } from '../styled';
 import { CardDisplay } from '../../../constants';
-export var hoverCardClassName = 'smart-links-hover-preview';
 export var HoverCardComponent = function HoverCardComponent(_ref) {
   var children = _ref.children,
       url = _ref.url,
@@ -110,9 +109,6 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
     }
   }, [hideCard]); // Stop hover preview content to propagate event to parent.
 
-  var onClick = useCallback(function (e) {
-    return e.stopPropagation();
-  }, []);
   return jsx(Popup, {
     testId: "hover-card",
     isOpen: isOpen,
@@ -122,14 +118,9 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
     autoFocus: false,
     content: function content(_ref2) {
       var update = _ref2.update;
-      return jsx("div", {
+      return jsx(HoverCardContent, {
         onMouseEnter: initShowCard,
         onMouseLeave: initHideCard,
-        onClick: onClick,
-        css: HoverCardContainer // class name for trello to exclude click events
-        ,
-        className: hoverCardClassName
-      }, jsx(HoverCardContent, {
         analytics: analytics,
         cardActions: linkActions,
         cardState: linkState,
@@ -137,7 +128,7 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
         onResolve: update,
         renderers: renderers,
         url: url
-      }));
+      });
     },
     trigger: function trigger(triggerProps) {
       return jsx("span", {

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

@@ -1,3 +1,5 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
 import ShortcutIcon from '@atlaskit/icon/glyph/shortcut';
 import { extractType } from '@atlaskit/linking-common/extractors';
 import React, { useCallback, useMemo } from 'react';
@@ -5,17 +7,18 @@ import { ActionName, CardDisplay, SmartLinkPosition, SmartLinkSize } from '../..
 import { extractMetadata } from '../../../extractors/hover/extractMetadata';
 import { getExtensionKey } from '../../../state/helpers';
 import { isSpecialEvent } from '../../../utils';
-import { flexibleUiOptions, titleBlockCss } from '../styled';
+import { HoverCardContainer, flexibleUiOptions, titleBlockCss } from '../styled';
 import { getSimulatedMetadata } from '../utils';
 import HoverCardLoadingView from './views/resolving';
 import HoverCardUnauthorisedView from './views/unauthorised';
 import HoverCardResolvedView from './views/resolved';
 import { FormattedMessage } from 'react-intl-next';
 import { messages } from '../../../messages';
+export var hoverCardClassName = 'smart-links-hover-preview';
 export var getOpenAction = function getOpenAction(url, analytics, onActionClick) {
   return {
     name: ActionName.CustomAction,
-    icon: /*#__PURE__*/React.createElement(ShortcutIcon, {
+    icon: jsx(ShortcutIcon, {
       label: "open in new tab",
       size: "medium"
     }),
@@ -30,7 +33,7 @@ export var getOpenAction = function getOpenAction(url, analytics, onActionClick)
         previewDisplay: 'card'
       });
     },
-    tooltipMessage: /*#__PURE__*/React.createElement(FormattedMessage, messages.open_link_in_a_new_tab),
+    tooltipMessage: jsx(FormattedMessage, messages.open_link_in_a_new_tab),
     testId: 'hover-card-open-button'
   };
 };
@@ -47,7 +50,9 @@ var HoverCardContent = function HoverCardContent(_ref) {
       onActionClick = _ref.onActionClick,
       onResolve = _ref.onResolve,
       renderers = _ref.renderers,
-      url = _ref.url;
+      url = _ref.url,
+      onMouseEnter = _ref.onMouseEnter,
+      onMouseLeave = _ref.onMouseLeave;
   var extensionKey = useMemo(function () {
     return getExtensionKey(cardState.details);
   }, [cardState.details]);
@@ -88,36 +93,53 @@ var HoverCardContent = function HoverCardContent(_ref) {
     url: url,
     children: {}
   };
+  var onClickStopPropagation = useCallback(function (e) {
+    return e.stopPropagation();
+  }, []);
 
-  if (cardState.metadataStatus === 'pending') {
-    return /*#__PURE__*/React.createElement(HoverCardLoadingView, {
-      flexibleCardProps: flexibleCardProps,
-      titleBlockProps: titleBlockProps
-    });
-  }
+  var getCardView = function getCardView(cardState) {
+    if (cardState.metadataStatus === 'pending') {
+      return jsx(HoverCardLoadingView, {
+        flexibleCardProps: flexibleCardProps,
+        titleBlockProps: titleBlockProps
+      });
+    }
 
-  if (cardState.status === 'unauthorized') {
-    return /*#__PURE__*/React.createElement(HoverCardUnauthorisedView, {
-      analytics: analytics,
-      extensionKey: extensionKey,
-      id: id,
-      flexibleCardProps: flexibleCardProps,
-      url: url
-    });
-  } // if metadataStatus is 'errored' simply render using data available (normal path)
+    if (cardState.status === 'unauthorized') {
+      return jsx(HoverCardUnauthorisedView, {
+        analytics: analytics,
+        extensionKey: extensionKey,
+        id: id,
+        flexibleCardProps: flexibleCardProps,
+        url: url
+      });
+    }
 
+    if (cardState.status === 'resolved') {
+      return jsx(HoverCardResolvedView, {
+        id: id,
+        url: url,
+        extensionKey: extensionKey,
+        analytics: analytics,
+        cardActions: cardActions,
+        cardState: cardState,
+        flexibleCardProps: flexibleCardProps,
+        onActionClick: onActionClick,
+        titleBlockProps: titleBlockProps
+      });
+    }
 
-  return /*#__PURE__*/React.createElement(HoverCardResolvedView, {
-    id: id,
-    url: url,
-    extensionKey: extensionKey,
-    analytics: analytics,
-    cardActions: cardActions,
-    cardState: cardState,
-    flexibleCardProps: flexibleCardProps,
-    onActionClick: onActionClick,
-    titleBlockProps: titleBlockProps
-  });
+    return null;
+  };
+
+  var cardView = getCardView(cardState);
+  return cardView ? jsx("div", {
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave,
+    onClick: onClickStopPropagation,
+    className: hoverCardClassName,
+    css: HoverCardContainer
+  }, cardView) : null;
 };
 
 export default HoverCardContent;

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

@@ -1,4 +1,3 @@
 import { FC } from 'react';
 import { HoverCardComponentProps } from '../types';
-export declare const hoverCardClassName = "smart-links-hover-preview";
 export declare const HoverCardComponent: FC<HoverCardComponentProps>;

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

@@ -2,6 +2,7 @@ import React from 'react';
 import { AnalyticsFacade } from '../../../state/analytics';
 import { ActionItem } from '../../FlexibleCard/components/blocks/types';
 import { HoverCardContentProps } from '../types';
+export declare const hoverCardClassName = "smart-links-hover-preview";
 export declare const getOpenAction: (url: string, analytics: AnalyticsFacade, onActionClick?: ((actionId: string) => void) | undefined) => ActionItem;
 declare const HoverCardContent: React.FC<HoverCardContentProps>;
 export default HoverCardContent;

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

@@ -5,7 +5,7 @@ import { LinkAction } from '../../state/hooks-external/useSmartLinkActions';
 import { CardState } from '@atlaskit/linking-common';
 import { CardProviderRenderers } from '@atlaskit/link-provider';
 import { AnalyticsHandler } from '../../utils/types';
-import { ReactElement } from 'react';
+import { ReactElement, MouseEventHandler } from 'react';
 import { JsonLd } from 'json-ld-types';
 export interface HoverCardProps extends WithAnalyticsEventsProps {
     id?: string;
@@ -33,6 +33,8 @@ export declare type HoverCardContentProps = {
     onActionClick: (actionId: string) => void;
     onResolve: () => void;
     url: string;
+    onMouseEnter?: MouseEventHandler;
+    onMouseLeave?: MouseEventHandler;
 };
 export declare type SnippetOrPreviewProps = {
     data: JsonLd.Data.BaseData;

package/package.json

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