@atlaskit/smart-card 25.8.0 → 25.9.1

package/dist/es2019/state/actions/index.js

@@ -16,21 +16,14 @@ export const useSmartCardActions = (id, url, analytics) => {
     getState,
     dispatch
   } = store;
-  const getSmartLinkState = useCallback(() => {
-    var _getState$url;
-    const {
-      details,
-      status,
-      metadataStatus
-    } = (_getState$url = getState()[url]) !== null && _getState$url !== void 0 ? _getState$url : {
-      status: SmartLinkStatus.Pending
-    };
-    return {
-      details,
-      status,
-      metadataStatus
-    };
-  }, [getState, url]);
+  const {
+    details,
+    status,
+    metadataStatus
+  } = getState()[url] || {
+    status: SmartLinkStatus.Pending,
+    details: undefined
+  };
   const setMetadataStatus = useCallback(metadataStatus => {
     dispatch(cardAction(ACTION_UPDATE_METADATA_STATUS, {
       url
@@ -38,9 +31,6 @@ export const useSmartCardActions = (id, url, analytics) => {
   }, [dispatch, url]);
   const resolve = useCallback(async (resourceUrl = url, isReloading = false, isMetadataRequest = false) => resolveUrl(resourceUrl, isReloading, isMetadataRequest, id), [id, resolveUrl, url]);
   const register = useCallback(() => {
-    const {
-      details
-    } = getSmartLinkState();
     if (!details) {
       dispatch(cardAction(ACTION_RESOLVING, {
         url
@@ -48,33 +38,23 @@ export const useSmartCardActions = (id, url, analytics) => {
       setMetadataStatus('pending');
     }
     return resolve();
-  }, [getSmartLinkState, resolve, dispatch, url, setMetadataStatus]);
+  }, [details, resolve, dispatch, url, setMetadataStatus]);
   const reload = useCallback(() => {
-    const {
-      details
-    } = getSmartLinkState();
     const definitionId = getDefinitionId(details);
     if (definitionId) {
       getByDefinitionId(definitionId, getState()).map(url => resolve(url, true));
     } else {
       resolve(url, true);
     }
-  }, [getSmartLinkState, url, getState, resolve]);
+  }, [details, url, getState, resolve]);
   const loadMetadata = useCallback(() => {
-    const {
-      metadataStatus
-    } = getSmartLinkState();
     //metadataStatus will be undefined for SSR links only
     if (metadataStatus === undefined) {
       setMetadataStatus('pending');
       return resolve(url, false, true);
     }
-  }, [getSmartLinkState, resolve, setMetadataStatus, url]);
+  }, [metadataStatus, resolve, setMetadataStatus, url]);
   const authorize = useCallback(appearance => {
-    const {
-      details,
-      status
-    } = getSmartLinkState();
     const definitionId = getDefinitionId(details);
     const extensionKey = getExtensionKey(details);
     const services = getServices(details);
@@ -126,7 +106,7 @@ export const useSmartCardActions = (id, url, analytics) => {
         reload();
       });
     }
-  }, [getSmartLinkState, analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload]);
+  }, [analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload, details, status]);
   const invoke = useCallback(async (opts, appearance) => {
     const {
       key,

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

@@ -1,5 +1,4 @@
 import { useCallback } from 'react';
-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';
@@ -99,26 +98,18 @@ const useResolve = () => {
       return;
     }
 
-    /**
-     * 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(() => {
-      //if a link resolves normally, metadata will also always be resolved
-      setMetadataStatus(resourceUrl, 'resolved');
-      // Dispatch Analytics and resolved card action - including unauthorized states.
-      if (isReloading) {
-        dispatch(cardAction(ACTION_RELOADING, {
-          url: resourceUrl
-        }, response));
-      } else {
-        dispatch(cardAction(ACTION_RESOLVED, {
-          url: resourceUrl
-        }, response, undefined, undefined, isMetadataRequest));
-      }
-    });
+    //if a link resolves normally, metadata will also always be resolved
+    setMetadataStatus(resourceUrl, 'resolved');
+    // Dispatch Analytics and resolved card action - including unauthorized states.
+    if (isReloading) {
+      dispatch(cardAction(ACTION_RELOADING, {
+        url: resourceUrl
+      }, response));
+    } else {
+      dispatch(cardAction(ACTION_RESOLVED, {
+        url: resourceUrl
+      }, response, undefined, undefined, isMetadataRequest));
+    }
   }, [dispatch, handleResolvedLinkError, hasAuthFlowSupported, setMetadataStatus]);
   return useCallback(async (url, isReloading = false, isMetadataRequest = false, id = '') => {
     const {

package/dist/es2019/version.json

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

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

@@ -71,7 +71,10 @@ const FlexibleResolvedView = ({
     }, {
       name: ElementName.State
     }],
-    hideRetry: true
+    hideRetry: true,
+    subtitle: [{
+      name: ElementName.Location
+    }]
   }), /*#__PURE__*/React.createElement(MetadataBlock, {
     primary: metadata,
     maxLines: 1

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

@@ -12,8 +12,7 @@ import { isFlexibleUiCard } from '../../utils/flexible';
 import FlexibleCard from '../FlexibleCard';
 import { CardDisplay } from '../../constants';
 import { fireLinkClickedEvent } from '../../utils/analytics/click';
-import { SmartLinkAnalyticsContext } from '../../utils/analytics/SmartLinkAnalyticsContext';
-function Component({
+export function CardWithUrlContent({
   id,
   url,
   isSelected,
@@ -255,9 +254,4 @@ function Component({
         onIframeFocus: onIframeFocus
       });
   }
-}
-export const CardWithUrlContent = props => /*#__PURE__*/React.createElement(SmartLinkAnalyticsContext, {
-  url: props.url,
-  appearance: props.appearance,
-  id: props.id
-}, /*#__PURE__*/React.createElement(Component, props));
+}

package/dist/es2019/view/FlexibleCard/components/blocks/element-group/index.js

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import React from 'react';
 import { css, jsx } from '@emotion/react';
-import { SmartLinkAlignment, SmartLinkDirection, SmartLinkSize, SmartLinkWidth } from '../../../../../constants';
+import { SmartLinkAlignment, SmartLinkDirection, SmartLinkPosition, SmartLinkSize, SmartLinkWidth } from '../../../../../constants';
 import { getBaseStyles, getGapSize, renderChildren } from '../utils';
 import { getMaxLineHeight, getTruncateStyles } from '../../utils';
 const getAlignmentStyles = align => {
@@ -65,12 +65,13 @@ const getHorizontalDirectionStyles = (size, align) => {
     ${getGapStyles(size, align)}
   `;
 };
-export const getElementGroupStyles = (direction, size, align, width) => css`
+export const getElementGroupStyles = (direction, size, align, width, position) => css`
   ${getBaseStyles(direction, size)}
   ${getAlignmentStyles(align)}
   min-width: 10%;
   ${width === SmartLinkWidth.Flexible ? `flex: 1 3;` : ''}
   ${direction === SmartLinkDirection.Horizontal ? getHorizontalDirectionStyles(size, align) : ''}
+  ${position === SmartLinkPosition.Top ? 'align-self: flex-start;' : ''}
 `;
 
 /**
@@ -87,9 +88,10 @@ const ElementGroup = ({
   direction = SmartLinkDirection.Horizontal,
   size = SmartLinkSize.Medium,
   testId = 'smart-element-group',
-  width = SmartLinkWidth.FitToContent
+  width = SmartLinkWidth.FitToContent,
+  position = SmartLinkPosition.Center
 }) => jsx("div", {
-  css: [getElementGroupStyles(direction, size, align, width), overrideCss],
+  css: [getElementGroupStyles(direction, size, align, width, position), overrideCss],
   "data-smart-element-group": true,
   "data-testid": testId
 }, renderChildren(children, size));

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

@@ -1,9 +1,10 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
+import { css } from '@emotion/react';
 import { LinkIcon } from '../../../elements';
 import Block from '../../block';
 import ElementGroup from '../../element-group';
-import { SmartLinkAlignment, SmartLinkDirection, SmartLinkWidth } from '../../../../../../constants';
+import { SmartLinkAlignment, SmartLinkDirection, SmartLinkPosition, SmartLinkWidth } from '../../../../../../constants';
 import { renderElementItems } from '../../utils';
 
 /**
@@ -29,12 +30,16 @@ const TitleBlockResolvedView = ({
     position: position
   }), /*#__PURE__*/React.createElement(ElementGroup, {
     direction: SmartLinkDirection.Vertical,
-    width: SmartLinkWidth.Flexible
+    width: SmartLinkWidth.Flexible,
+    overrideCss: css`
+          gap: 0.25rem;
+        `
   }, title, subtitleElements && /*#__PURE__*/React.createElement(ElementGroup, {
     direction: SmartLinkDirection.Horizontal
   }, subtitleElements)), metadataElements && /*#__PURE__*/React.createElement(ElementGroup, {
     direction: SmartLinkDirection.Horizontal,
-    align: SmartLinkAlignment.Right
+    align: SmartLinkAlignment.Right,
+    position: SmartLinkPosition.Top
   }, metadataElements), actionGroup);
 };
 export default TitleBlockResolvedView;

package/dist/es2019/view/FlexibleCard/components/blocks/utils.js

@@ -15,14 +15,12 @@ export const ElementDisplaySchema = {
   [ElementName.ChecklistProgress]: ['inline'],
   [ElementName.CollaboratorGroup]: ['inline'],
   [ElementName.CommentCount]: ['inline'],
-  [ElementName.ViewCount]: ['inline'],
-  [ElementName.ReactCount]: ['inline'],
-  [ElementName.VoteCount]: ['inline'],
   [ElementName.CreatedBy]: ['inline'],
   [ElementName.CreatedOn]: ['inline'],
   [ElementName.DueOn]: ['inline'],
   [ElementName.LatestCommit]: ['inline'],
   [ElementName.LinkIcon]: ['inline'],
+  [ElementName.Location]: ['inline'],
   [ElementName.ModifiedBy]: ['inline'],
   [ElementName.ModifiedOn]: ['inline'],
   [ElementName.OwnedBy]: ['inline'],
@@ -30,12 +28,15 @@ export const ElementDisplaySchema = {
   [ElementName.Priority]: ['inline'],
   [ElementName.ProgrammingLanguage]: ['inline'],
   [ElementName.Provider]: ['inline'],
+  [ElementName.ReactCount]: ['inline'],
   [ElementName.Snippet]: ['block'],
   [ElementName.SourceBranch]: ['inline'],
   [ElementName.State]: ['inline'],
   [ElementName.SubscriberCount]: ['inline'],
   [ElementName.TargetBranch]: ['inline'],
-  [ElementName.Title]: ['inline']
+  [ElementName.Title]: ['inline'],
+  [ElementName.ViewCount]: ['inline'],
+  [ElementName.VoteCount]: ['inline']
 };
 const getDirectionStyles = direction => {
   switch (direction) {

package/dist/es2019/view/FlexibleCard/components/elements/index.js

@@ -52,6 +52,12 @@ export const LatestCommit = createElement(ElementName.LatestCommit);
  * @see Icon
  */
 export const LinkIcon = createElement(ElementName.LinkIcon);
+/**
+ * Creates a Location Link element.
+ * This represents the location or container of the resource.
+ * @see Link
+ */
+export const Location = createElement(ElementName.Location);
 /**
  * Creates a ModifiedBy Text element using the data from ModifiedBy in the Flexible UI Context.
  * @see Text

package/dist/es2019/view/FlexibleCard/components/elements/link/index.js

@@ -2,7 +2,7 @@
 import React, { useMemo } from 'react';
 import { css, jsx } from '@emotion/react';
 import Tooltip from '@atlaskit/tooltip';
-import { SmartLinkSize, SmartLinkTheme } from '../../../../../constants';
+import { SmartLinkInternalTheme, SmartLinkSize, SmartLinkTheme } from '../../../../../constants';
 import { getLinkLineHeight, getLinkSizeStyles, getTruncateStyles, hasWhiteSpace } from '../../utils';
 import { tokens } from '../../../../../utils/token';
 import useMouseDownEvent from '../../../../../state/analytics/useMouseDownEvent';
@@ -14,6 +14,22 @@ const containerStyles = css`
 `;
 const getThemeStyles = theme => {
   switch (theme) {
+    case SmartLinkInternalTheme.Grey:
+      // We are being specifc with the CSS selectors to ensure that Confluence overrides
+      // do not affect our internal Smart Card styles
+      return css`
+        a& {
+          color: ${"var(--ds-text-subtlest, #626F86)"};
+          &:active,
+          &:visited,
+          &:focus,
+          &:hover {
+            color: ${"var(--ds-text-subtlest, #626F86)"};
+            text-decoration: underline;
+          }
+          font-size: 12px;
+        }
+      `;
     // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
     case SmartLinkTheme.Black:
       return css`

package/dist/es2019/view/FlexibleCard/components/elements/utils.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import React, { useContext } from 'react';
 import { FormattedDate } from 'react-intl-next';
 import { css } from '@emotion/react';
-import { ElementName, IconType } from '../../../../constants';
+import { ElementName, IconType, SmartLinkInternalTheme } from '../../../../constants';
 import Icon from './icon';
 import Link from './link';
 import Lozenge from './lozenge';
@@ -126,6 +126,12 @@ const elementMappings = {
   },
   [ElementName.Title]: {
     component: Link
+  },
+  [ElementName.Location]: {
+    component: Link,
+    props: {
+      theme: SmartLinkInternalTheme.Grey
+    }
   }
 };
 const getContextKey = name => {

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

@@ -9,11 +9,9 @@ import { useSmartCardState as useLinkState } from '../../../state/store';
 import HoverCardContent from '../components/HoverCardContent';
 import { CARD_GAP_PX, HOVER_CARD_Z_INDEX } from '../styled';
 import { CardDisplay } from '../../../constants';
-import { SmartLinkAnalyticsContext } from '../../../utils/analytics/SmartLinkAnalyticsContext';
 export const HoverCardComponent = ({
   children,
   url,
-  id,
   analyticsHandler,
   analytics,
   canOpen = true,
@@ -114,11 +112,7 @@ export const HoverCardComponent = ({
   }, [closeOnChildClick, hideCard]);
   const content = useCallback(({
     update
-  }) => jsx(SmartLinkAnalyticsContext, {
-    url: url,
-    appearance: CardDisplay.HoverCardPreview,
-    id: id
-  }, jsx(HoverCardContent, {
+  }) => jsx(HoverCardContent, {
     onMouseEnter: initShowCard,
     onMouseLeave: initHideCard,
     analytics: analytics,
@@ -128,9 +122,8 @@ export const HoverCardComponent = ({
     onResolve: update,
     renderers: renderers,
     showServerActions: showServerActions,
-    url: url,
-    id: id
-  })), [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url, id]);
+    url: url
+  }), [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url]);
   const trigger = useCallback(triggerProps => jsx("span", {
     ref: parentSpan
   }, jsx("span", _extends({}, triggerProps, {

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

@@ -43,7 +43,7 @@ export const titleBlockCss = css`
   [data-smart-element-group] {
     // gap between title and subtitle
     gap: 0.06rem;
-
+    display: flex;
     /* subtitle element group */
     > [data-smart-element-group] {
       > span {

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

@@ -44,7 +44,7 @@ export const getSimulatedMetadata = (extensionKey = '', data) => {
         metadata: {
           primary: [ElementName.AuthorGroup, ElementName.State, ElementName.DueOn],
           secondary: [ElementName.ReactCount, ElementName.CommentCount, ElementName.AttachmentCount, ElementName.ChecklistProgress],
-          subtitle: []
+          subtitle: [ElementName.Location]
         }
       };
     case 'watermelon-object-provider':

package/dist/esm/constants.js

@@ -63,16 +63,20 @@ export var SmartLinkStatus;
   SmartLinkStatus["Fallback"] = "fallback";
 })(SmartLinkStatus || (SmartLinkStatus = {}));
 export var SmartLinkTheme;
+(function (SmartLinkTheme) {
+  SmartLinkTheme["Black"] = "black";
+  SmartLinkTheme["Link"] = "link";
+})(SmartLinkTheme || (SmartLinkTheme = {}));
+export var SmartLinkInternalTheme;
 
 /**
  * Determines whether the container size will fit to the content
  * or expand to the available width or the parent component.
  * Similar to flex's flex-grow concept.
  */
-(function (SmartLinkTheme) {
-  SmartLinkTheme["Black"] = "black";
-  SmartLinkTheme["Link"] = "link";
-})(SmartLinkTheme || (SmartLinkTheme = {}));
+(function (SmartLinkInternalTheme) {
+  SmartLinkInternalTheme["Grey"] = "grey";
+})(SmartLinkInternalTheme || (SmartLinkInternalTheme = {}));
 export var SmartLinkWidth;
 
 /**
@@ -109,7 +113,9 @@ export var ElementName;
   ElementName["CreatedBy"] = "CreatedBy";
   ElementName["CreatedOn"] = "CreatedOn";
   ElementName["DueOn"] = "DueOn";
+  ElementName["LatestCommit"] = "LatestCommit";
   ElementName["LinkIcon"] = "LinkIcon";
+  ElementName["Location"] = "Location";
   ElementName["ModifiedBy"] = "ModifiedBy";
   ElementName["ModifiedOn"] = "ModifiedOn";
   ElementName["OwnedBy"] = "OwnedBy";
@@ -126,7 +132,6 @@ export var ElementName;
   ElementName["Title"] = "Title";
   ElementName["ViewCount"] = "ViewCount";
   ElementName["VoteCount"] = "VoteCount";
-  ElementName["LatestCommit"] = "LatestCommit";
 })(ElementName || (ElementName = {}));
 export var ActionName;
 

package/dist/esm/extractors/flexible/index.js

@@ -1,6 +1,6 @@
 import { extractSummary } from '../common/primitives';
 import { extractLinkIcon } from './icon';
-import { extractAttachmentCount, extractChecklistProgress, extractCommentCount, extractCreatedBy, extractModifiedBy, extractProgrammingLanguage, extractSubscriberCount, extractViewCount, extractReactCount, extractVoteCount, extractSourceBranch, extractTargetBranch, extractDueOn, extractOwnedBy } from './utils';
+import { extractAttachmentCount, extractChecklistProgress, extractCommentCount, extractCreatedBy, extractModifiedBy, extractProgrammingLanguage, extractSubscriberCount, extractViewCount, extractReactCount, extractVoteCount, extractSourceBranch, extractTargetBranch, extractDueOn, extractLocation, extractOwnedBy } from './utils';
 import { extractPersonsUpdatedBy } from './collaboratorGroup';
 import { extractPersonCreatedBy, extractTitle, extractDateUpdated, extractDateCreated, extractLink } from '@atlaskit/linking-common/extractors';
 import extractPriority from './extract-priority';
@@ -42,6 +42,7 @@ var extractFlexibleUiContext = function extractFlexibleUiContext() {
     downloadAction: extractDownloadAction(data),
     latestCommit: extractLatestCommit(data),
     linkIcon: extractLinkIcon(response, renderers),
+    location: extractLocation(data),
     modifiedBy: extractModifiedBy(data),
     modifiedOn: extractDateUpdated(data),
     preview: extractPreview(data),

package/dist/esm/extractors/flexible/utils.js

@@ -59,4 +59,15 @@ export var extractTargetBranch = function extractTargetBranch(data) {
 export var extractChecklistProgress = function extractChecklistProgress(data) {
   var checkItemsObj = extractValue(data, 'atlassian:checkItems');
   return checkItemsObj ? "".concat(checkItemsObj.checkedItems, "/").concat(checkItemsObj.totalItems) : undefined;
+};
+export var extractLocation = function extractLocation(data) {
+  var _ref = extractValue(data, 'location') || {},
+    url = _ref.url,
+    name = _ref.name;
+  if (url && name && typeof url === 'string') {
+    return {
+      text: name,
+      url: url
+    };
+  }
 };

package/dist/esm/state/actions/index.js

@@ -16,20 +16,13 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
     connections = _useSmartLinkContext.connections;
   var getState = store.getState,
     dispatch = store.dispatch;
-  var getSmartLinkState = useCallback(function () {
-    var _getState$url;
-    var _ref = (_getState$url = getState()[url]) !== null && _getState$url !== void 0 ? _getState$url : {
-        status: SmartLinkStatus.Pending
-      },
-      details = _ref.details,
-      status = _ref.status,
-      metadataStatus = _ref.metadataStatus;
-    return {
-      details: details,
-      status: status,
-      metadataStatus: metadataStatus
-    };
-  }, [getState, url]);
+  var _ref = getState()[url] || {
+      status: SmartLinkStatus.Pending,
+      details: undefined
+    },
+    details = _ref.details,
+    status = _ref.status,
+    metadataStatus = _ref.metadataStatus;
   var setMetadataStatus = useCallback(function (metadataStatus) {
     dispatch(cardAction(ACTION_UPDATE_METADATA_STATUS, {
       url: url
@@ -56,8 +49,6 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
     }, _callee);
   })), [id, resolveUrl, url]);
   var register = useCallback(function () {
-    var _getSmartLinkState = getSmartLinkState(),
-      details = _getSmartLinkState.details;
     if (!details) {
       dispatch(cardAction(ACTION_RESOLVING, {
         url: url
@@ -65,10 +56,8 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
       setMetadataStatus('pending');
     }
     return resolve();
-  }, [getSmartLinkState, resolve, dispatch, url, setMetadataStatus]);
+  }, [details, resolve, dispatch, url, setMetadataStatus]);
   var reload = useCallback(function () {
-    var _getSmartLinkState2 = getSmartLinkState(),
-      details = _getSmartLinkState2.details;
     var definitionId = getDefinitionId(details);
     if (definitionId) {
       getByDefinitionId(definitionId, getState()).map(function (url) {
@@ -77,20 +66,15 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
     } else {
       resolve(url, true);
     }
-  }, [getSmartLinkState, url, getState, resolve]);
+  }, [details, url, getState, resolve]);
   var loadMetadata = useCallback(function () {
-    var _getSmartLinkState3 = getSmartLinkState(),
-      metadataStatus = _getSmartLinkState3.metadataStatus;
     //metadataStatus will be undefined for SSR links only
     if (metadataStatus === undefined) {
       setMetadataStatus('pending');
       return resolve(url, false, true);
     }
-  }, [getSmartLinkState, resolve, setMetadataStatus, url]);
+  }, [metadataStatus, resolve, setMetadataStatus, url]);
   var authorize = useCallback(function (appearance) {
-    var _getSmartLinkState4 = getSmartLinkState(),
-      details = _getSmartLinkState4.details,
-      status = _getSmartLinkState4.status;
     var definitionId = getDefinitionId(details);
     var extensionKey = getExtensionKey(details);
     var services = getServices(details);
@@ -142,7 +126,7 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
         reload();
       });
     }
-  }, [getSmartLinkState, analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload]);
+  }, [analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload, details, status]);
   var invoke = useCallback( /*#__PURE__*/function () {
     var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(opts, appearance) {
       var key, action, source, markName, response;

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

@@ -2,7 +2,6 @@ import _typeof from "@babel/runtime/helpers/typeof";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = Object.defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof Symbol ? Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return Object.defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = Object.create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = Object.getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype); function defineIteratorMethods(prototype) { ["next", "throw", "return"].forEach(function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], tryLocsList.forEach(pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) { keys.push(key); } return keys.reverse(), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, catch: function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
 import { useCallback } from 'react';
-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';
@@ -100,26 +99,18 @@ var useResolve = function useResolve() {
       return;
     }
 
-    /**
-     * 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 () {
-      //if a link resolves normally, metadata will also always be resolved
-      setMetadataStatus(resourceUrl, 'resolved');
-      // Dispatch Analytics and resolved card action - including unauthorized states.
-      if (isReloading) {
-        dispatch(cardAction(ACTION_RELOADING, {
-          url: resourceUrl
-        }, response));
-      } else {
-        dispatch(cardAction(ACTION_RESOLVED, {
-          url: resourceUrl
-        }, response, undefined, undefined, isMetadataRequest));
-      }
-    });
+    //if a link resolves normally, metadata will also always be resolved
+    setMetadataStatus(resourceUrl, 'resolved');
+    // Dispatch Analytics and resolved card action - including unauthorized states.
+    if (isReloading) {
+      dispatch(cardAction(ACTION_RELOADING, {
+        url: resourceUrl
+      }, response));
+    } else {
+      dispatch(cardAction(ACTION_RESOLVED, {
+        url: resourceUrl
+      }, response, undefined, undefined, isMetadataRequest));
+    }
   }, [dispatch, handleResolvedLinkError, hasAuthFlowSupported, setMetadataStatus]);
   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": "25.8.0",
+	"version": "25.9.1",
 	"sideEffects": false
 }