@atlaskit/smart-card 26.8.1 → 26.9.1

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/smart-card
 
+## 26.9.1
+
+### Patch Changes
+
+- [`88cc5a0088c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/88cc5a0088c) - [ux] Flexible Smart Links: Hover preview to follow mouse position
+- Updated dependencies
+
+## 26.9.0
+
+### Minor Changes
+
+- [`7811ab546b9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7811ab546b9) - Cleans up FF platform.linking-platform.smart-card.enable-analytics-context introduced in 26.2.2 — resolved attributes now provided to all events fired within Smart Card by default.
+
 ## 26.8.1
 
 ### Patch Changes

package/dist/cjs/state/hooks/use-resolve/index.js

@@ -12,7 +12,6 @@ var _reactDom = require("react-dom");
 var _analytics = require("../../analytics");
 var _helpers = require("../../helpers");
 var _linkingCommon = require("@atlaskit/linking-common");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _constants = require("../../actions/constants");
 var _jsonld = require("../../../utils/jsonld");
 var _constants2 = require("../../../constants");
@@ -120,19 +119,16 @@ var useResolve = function useResolve() {
       handleResolvedLinkError(resourceUrl, new _linkingCommon.APIError('error', hostname, _constants.ERROR_MESSAGE_METADATA), response, isMetadataRequest);
       return;
     }
-    if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-analytics-context')) {
-      /**
-       * Using unstable_batchedUpdates because this store update happens async and trigers a rerender
-       * more info:
-       * https://github.com/facebook/react/blob/v18.2.0/packages/use-sync-external-store/src/useSyncExternalStoreShimClient.js#L113
-       * https://react-redux.js.org/api/batch
-       */
-      (0, _reactDom.unstable_batchedUpdates)(function () {
-        handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest);
-      });
-    } else {
+
+    /**
+     * Using unstable_batchedUpdates because this store update happens async and trigers a rerender
+     * more info:
+     * https://github.com/facebook/react/blob/v18.2.0/packages/use-sync-external-store/src/useSyncExternalStoreShimClient.js#L113
+     * https://react-redux.js.org/api/batch
+     */
+    (0, _reactDom.unstable_batchedUpdates)(function () {
       handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest);
-    }
+    });
   }, [handleResolvedLinkError, handleResolvedLinkSuccess, hasAuthFlowSupported]);
   return (0, _react.useCallback)( /*#__PURE__*/function () {
     var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(url) {

package/dist/cjs/version.json

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

package/dist/cjs/view/CardWithUrl/component.js

@@ -9,7 +9,6 @@ exports.CardWithUrlContent = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _linkProvider = require("@atlaskit/link-provider");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _utils = require("../../utils");
 var measure = _interopRequireWildcard(require("../../utils/performance"));
 var _helpers = require("../../state/helpers");
@@ -273,14 +272,11 @@ function Component(_ref) {
   }
 }
 var CardWithUrlContent = function CardWithUrlContent(props) {
-  if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-analytics-context')) {
-    var display = (0, _flexible.isFlexibleUiCard)(props.children) ? _constants.CardDisplay.Flexible : props.appearance;
-    return /*#__PURE__*/_react.default.createElement(_SmartLinkAnalyticsContext.SmartLinkAnalyticsContext, {
-      url: props.url,
-      id: props.id,
-      display: display
-    }, /*#__PURE__*/_react.default.createElement(Component, props));
-  }
-  return /*#__PURE__*/_react.default.createElement(Component, props);
+  var display = (0, _flexible.isFlexibleUiCard)(props.children) ? _constants.CardDisplay.Flexible : props.appearance;
+  return /*#__PURE__*/_react.default.createElement(_SmartLinkAnalyticsContext.SmartLinkAnalyticsContext, {
+    url: props.url,
+    id: props.id,
+    display: display
+  }, /*#__PURE__*/_react.default.createElement(Component, props));
 };
 exports.CardWithUrlContent = CardWithUrlContent;

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

@@ -58,14 +58,14 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
   var _useSmartCardActions = (0, _actions.useSmartCardActions)(id, url, analytics),
     loadMetadata = _useSmartCardActions.loadMetadata;
   var setMousePosition = (0, _react2.useCallback)(function (event) {
-    if (isOpen) {
+    if (isOpen && canOpen) {
       return;
     }
     mousePos.current = {
       x: event.clientX,
       y: event.clientY
     };
-  }, [isOpen]);
+  }, [canOpen, isOpen]);
   var hideCard = (0, _react2.useCallback)(function () {
     setIsOpen(false);
   }, []);
@@ -131,20 +131,21 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
 
     //Set mouse position in the case it's not already set by onMouseMove, as in the case of scrolling
     setMousePosition(event);
+
+    //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
+    if ((!isOpen || !canOpen) && parentSpan.current && mousePos.current) {
+      var _parentSpan$current$g = parentSpan.current.getBoundingClientRect(),
+        bottom = _parentSpan$current$g.bottom,
+        left = _parentSpan$current$g.left;
+      popupOffset.current = [mousePos.current.x - left, mousePos.current.y - bottom + _styled.CARD_GAP_PX];
+    }
     if (!isOpen && !fadeInTimeoutId.current) {
       // setting a timeout to show a Hover Card after delay runs out
       fadeInTimeoutId.current = setTimeout(function () {
-        //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
-        if (parentSpan.current && mousePos.current) {
-          var _parentSpan$current$g = parentSpan.current.getBoundingClientRect(),
-            bottom = _parentSpan$current$g.bottom,
-            left = _parentSpan$current$g.left;
-          popupOffset.current = [mousePos.current.x - left, mousePos.current.y - bottom + _styled.CARD_GAP_PX];
-        }
         setIsOpen(true);
       }, FADE_IN_DELAY);
     }
-  }, [initResolve, isOpen, setMousePosition]);
+  }, [canOpen, initResolve, isOpen, setMousePosition]);
   var linkActions = (0, _useSmartLinkActions.useSmartLinkActions)({
     url: url,
     appearance: _constants.CardDisplay.HoverCardPreview,
@@ -163,7 +164,6 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
   }, [hideCard]);
 
   // Stop hover preview content to propagate event to parent.
-
   var onChildClick = (0, _react2.useCallback)(function (e) {
     e.stopPropagation();
     if (closeOnChildClick) {

package/dist/es2019/state/hooks/use-resolve/index.js

@@ -3,7 +3,6 @@ import { unstable_batchedUpdates } from 'react-dom';
 import { addMetadataToExperience } from '../../analytics';
 import { getStatus } from '../../helpers';
 import { ACTION_ERROR, ACTION_ERROR_FALLBACK, ACTION_RELOADING, ACTION_RESOLVED, ACTION_UPDATE_METADATA_STATUS, APIError, cardAction } from '@atlaskit/linking-common';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { ERROR_MESSAGE_FATAL, ERROR_MESSAGE_METADATA, ERROR_MESSAGE_OAUTH } from '../../actions/constants';
 import { getUnauthorizedJsonLd } from '../../../utils/jsonld';
 import { SmartLinkStatus } from '../../../constants';
@@ -113,19 +112,16 @@ const useResolve = () => {
       handleResolvedLinkError(resourceUrl, new APIError('error', hostname, ERROR_MESSAGE_METADATA), response, isMetadataRequest);
       return;
     }
-    if (getBooleanFF('platform.linking-platform.smart-card.enable-analytics-context')) {
-      /**
-       * Using unstable_batchedUpdates because this store update happens async and trigers a rerender
-       * more info:
-       * https://github.com/facebook/react/blob/v18.2.0/packages/use-sync-external-store/src/useSyncExternalStoreShimClient.js#L113
-       * https://react-redux.js.org/api/batch
-       */
-      unstable_batchedUpdates(() => {
-        handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest);
-      });
-    } else {
+
+    /**
+     * Using unstable_batchedUpdates because this store update happens async and trigers a rerender
+     * more info:
+     * https://github.com/facebook/react/blob/v18.2.0/packages/use-sync-external-store/src/useSyncExternalStoreShimClient.js#L113
+     * https://react-redux.js.org/api/batch
+     */
+    unstable_batchedUpdates(() => {
       handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest);
-    }
+    });
   }, [handleResolvedLinkError, handleResolvedLinkSuccess, hasAuthFlowSupported]);
   return useCallback(async (url, isReloading = false, isMetadataRequest = false, id = '') => {
     const {

package/dist/es2019/version.json

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

package/dist/es2019/view/CardWithUrl/component.js

@@ -1,7 +1,6 @@
 import React, { useEffect, useCallback, useMemo } from 'react';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import { useFeatureFlag } from '@atlaskit/link-provider';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { isSpecialEvent } from '../../utils';
 import * as measure from '../../utils/performance';
 import { getDefinitionId, getServices, isFinalState, getClickUrl, getResourceType, getExtensionKey, getSubproduct, getProduct } from '../../state/helpers';
@@ -260,13 +259,10 @@ function Component({
   }
 }
 export const CardWithUrlContent = props => {
-  if (getBooleanFF('platform.linking-platform.smart-card.enable-analytics-context')) {
-    const display = isFlexibleUiCard(props.children) ? CardDisplay.Flexible : props.appearance;
-    return /*#__PURE__*/React.createElement(SmartLinkAnalyticsContext, {
-      url: props.url,
-      id: props.id,
-      display: display
-    }, /*#__PURE__*/React.createElement(Component, props));
-  }
-  return /*#__PURE__*/React.createElement(Component, props);
+  const display = isFlexibleUiCard(props.children) ? CardDisplay.Flexible : props.appearance;
+  return /*#__PURE__*/React.createElement(SmartLinkAnalyticsContext, {
+    url: props.url,
+    id: props.id,
+    display: display
+  }, /*#__PURE__*/React.createElement(Component, props));
 };

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

@@ -40,14 +40,14 @@ export const HoverCardComponent = ({
     loadMetadata
   } = useSmartCardActions(id, url, analytics);
   const setMousePosition = useCallback(event => {
-    if (isOpen) {
+    if (isOpen && canOpen) {
       return;
     }
     mousePos.current = {
       x: event.clientX,
       y: event.clientY
     };
-  }, [isOpen]);
+  }, [canOpen, isOpen]);
   const hideCard = useCallback(() => {
     setIsOpen(false);
   }, []);
@@ -111,21 +111,22 @@ export const HoverCardComponent = ({
 
     //Set mouse position in the case it's not already set by onMouseMove, as in the case of scrolling
     setMousePosition(event);
+
+    //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
+    if ((!isOpen || !canOpen) && parentSpan.current && mousePos.current) {
+      const {
+        bottom,
+        left
+      } = parentSpan.current.getBoundingClientRect();
+      popupOffset.current = [mousePos.current.x - left, mousePos.current.y - bottom + CARD_GAP_PX];
+    }
     if (!isOpen && !fadeInTimeoutId.current) {
       // setting a timeout to show a Hover Card after delay runs out
       fadeInTimeoutId.current = setTimeout(() => {
-        //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
-        if (parentSpan.current && mousePos.current) {
-          const {
-            bottom,
-            left
-          } = parentSpan.current.getBoundingClientRect();
-          popupOffset.current = [mousePos.current.x - left, mousePos.current.y - bottom + CARD_GAP_PX];
-        }
         setIsOpen(true);
       }, FADE_IN_DELAY);
     }
-  }, [initResolve, isOpen, setMousePosition]);
+  }, [canOpen, initResolve, isOpen, setMousePosition]);
   const linkActions = useSmartLinkActions({
     url,
     appearance: CardDisplay.HoverCardPreview,
@@ -142,7 +143,6 @@ export const HoverCardComponent = ({
   }, [hideCard]);
 
   // Stop hover preview content to propagate event to parent.
-
   const onChildClick = useCallback(e => {
     e.stopPropagation();
     if (closeOnChildClick) {

package/dist/esm/state/hooks/use-resolve/index.js

@@ -5,7 +5,6 @@ import { unstable_batchedUpdates } from 'react-dom';
 import { addMetadataToExperience } from '../../analytics';
 import { getStatus } from '../../helpers';
 import { ACTION_ERROR, ACTION_ERROR_FALLBACK, ACTION_RELOADING, ACTION_RESOLVED, ACTION_UPDATE_METADATA_STATUS, APIError, cardAction } from '@atlaskit/linking-common';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { ERROR_MESSAGE_FATAL, ERROR_MESSAGE_METADATA, ERROR_MESSAGE_OAUTH } from '../../actions/constants';
 import { getUnauthorizedJsonLd } from '../../../utils/jsonld';
 import { SmartLinkStatus } from '../../../constants';
@@ -113,19 +112,16 @@ var useResolve = function useResolve() {
       handleResolvedLinkError(resourceUrl, new APIError('error', hostname, ERROR_MESSAGE_METADATA), response, isMetadataRequest);
       return;
     }
-    if (getBooleanFF('platform.linking-platform.smart-card.enable-analytics-context')) {
-      /**
-       * Using unstable_batchedUpdates because this store update happens async and trigers a rerender
-       * more info:
-       * https://github.com/facebook/react/blob/v18.2.0/packages/use-sync-external-store/src/useSyncExternalStoreShimClient.js#L113
-       * https://react-redux.js.org/api/batch
-       */
-      unstable_batchedUpdates(function () {
-        handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest);
-      });
-    } else {
+
+    /**
+     * Using unstable_batchedUpdates because this store update happens async and trigers a rerender
+     * more info:
+     * https://github.com/facebook/react/blob/v18.2.0/packages/use-sync-external-store/src/useSyncExternalStoreShimClient.js#L113
+     * https://react-redux.js.org/api/batch
+     */
+    unstable_batchedUpdates(function () {
       handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest);
-    }
+    });
   }, [handleResolvedLinkError, handleResolvedLinkSuccess, hasAuthFlowSupported]);
   return useCallback( /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(url) {

package/dist/esm/version.json

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

package/dist/esm/view/CardWithUrl/component.js

@@ -1,7 +1,6 @@
 import React, { useEffect, useCallback, useMemo } from 'react';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import { useFeatureFlag } from '@atlaskit/link-provider';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { isSpecialEvent } from '../../utils';
 import * as measure from '../../utils/performance';
 import { getDefinitionId, getServices, isFinalState, getClickUrl, getResourceType, getExtensionKey, getSubproduct, getProduct } from '../../state/helpers';
@@ -263,13 +262,10 @@ function Component(_ref) {
   }
 }
 export var CardWithUrlContent = function CardWithUrlContent(props) {
-  if (getBooleanFF('platform.linking-platform.smart-card.enable-analytics-context')) {
-    var display = isFlexibleUiCard(props.children) ? CardDisplay.Flexible : props.appearance;
-    return /*#__PURE__*/React.createElement(SmartLinkAnalyticsContext, {
-      url: props.url,
-      id: props.id,
-      display: display
-    }, /*#__PURE__*/React.createElement(Component, props));
-  }
-  return /*#__PURE__*/React.createElement(Component, props);
+  var display = isFlexibleUiCard(props.children) ? CardDisplay.Flexible : props.appearance;
+  return /*#__PURE__*/React.createElement(SmartLinkAnalyticsContext, {
+    url: props.url,
+    id: props.id,
+    display: display
+  }, /*#__PURE__*/React.createElement(Component, props));
 };

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

@@ -47,14 +47,14 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
   var _useSmartCardActions = useSmartCardActions(id, url, analytics),
     loadMetadata = _useSmartCardActions.loadMetadata;
   var setMousePosition = useCallback(function (event) {
-    if (isOpen) {
+    if (isOpen && canOpen) {
       return;
     }
     mousePos.current = {
       x: event.clientX,
       y: event.clientY
     };
-  }, [isOpen]);
+  }, [canOpen, isOpen]);
   var hideCard = useCallback(function () {
     setIsOpen(false);
   }, []);
@@ -120,20 +120,21 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
 
     //Set mouse position in the case it's not already set by onMouseMove, as in the case of scrolling
     setMousePosition(event);
+
+    //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
+    if ((!isOpen || !canOpen) && parentSpan.current && mousePos.current) {
+      var _parentSpan$current$g = parentSpan.current.getBoundingClientRect(),
+        bottom = _parentSpan$current$g.bottom,
+        left = _parentSpan$current$g.left;
+      popupOffset.current = [mousePos.current.x - left, mousePos.current.y - bottom + CARD_GAP_PX];
+    }
     if (!isOpen && !fadeInTimeoutId.current) {
       // setting a timeout to show a Hover Card after delay runs out
       fadeInTimeoutId.current = setTimeout(function () {
-        //If these are undefined then popupOffset is undefined and we fallback to default bottom-start placement
-        if (parentSpan.current && mousePos.current) {
-          var _parentSpan$current$g = parentSpan.current.getBoundingClientRect(),
-            bottom = _parentSpan$current$g.bottom,
-            left = _parentSpan$current$g.left;
-          popupOffset.current = [mousePos.current.x - left, mousePos.current.y - bottom + CARD_GAP_PX];
-        }
         setIsOpen(true);
       }, FADE_IN_DELAY);
     }
-  }, [initResolve, isOpen, setMousePosition]);
+  }, [canOpen, initResolve, isOpen, setMousePosition]);
   var linkActions = useSmartLinkActions({
     url: url,
     appearance: CardDisplay.HoverCardPreview,
@@ -152,7 +153,6 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
   }, [hideCard]);
 
   // Stop hover preview content to propagate event to parent.
-
   var onChildClick = useCallback(function (e) {
     e.stopPropagation();
     if (closeOnChildClick) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/smart-card",
-  "version": "26.8.1",
+  "version": "26.9.1",
   "description": "Smart card component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -42,9 +42,9 @@
     "@atlaskit/icon-object": "^6.3.0",
     "@atlaskit/icon-priority": "^6.3.0",
     "@atlaskit/in-product-testing": "^0.2.0",
-    "@atlaskit/link-analytics": "^8.1.0",
+    "@atlaskit/link-analytics": "^8.2.0",
     "@atlaskit/link-client-extension": "^1.5.0",
-    "@atlaskit/linking-common": "^3.1.0",
+    "@atlaskit/linking-common": "^3.2.0",
     "@atlaskit/linking-types": "^8.1.0",
     "@atlaskit/logo": "^13.14.0",
     "@atlaskit/lozenge": "^11.4.0",
@@ -138,9 +138,6 @@
     ".": "./src/index.ts"
   },
   "platform-feature-flags": {
-    "platform.linking-platform.smart-card.enable-analytics-context": {
-      "type": "boolean"
-    },
     "platform.linking-platform.smart-card.remove-dispatch-analytics-as-prop": {
       "type": "boolean"
     },