@atlaskit/smart-card 26.49.0 → 26.49.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/cjs/state/hooks/use-ai-summary/ai-summary-service/index.js +39 -27
  3. package/dist/cjs/state/hooks/use-ai-summary/index.js +16 -38
  4. package/dist/cjs/utils/analytics/analytics.js +1 -1
  5. package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +37 -29
  6. package/dist/cjs/view/HoverCard/components/ContentContainer.js +42 -13
  7. package/dist/cjs/view/HoverCard/components/HoverCardContent.js +1 -10
  8. package/dist/cjs/view/HoverCard/components/views/resolved/index.js +63 -16
  9. package/dist/cjs/view/LinkUrl/index.js +1 -1
  10. package/dist/cjs/view/common/ai-summary/index.js +9 -3
  11. package/dist/es2019/state/hooks/use-ai-summary/ai-summary-service/index.js +14 -5
  12. package/dist/es2019/state/hooks/use-ai-summary/index.js +17 -35
  13. package/dist/es2019/utils/analytics/analytics.js +1 -1
  14. package/dist/es2019/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +33 -26
  15. package/dist/es2019/view/HoverCard/components/ContentContainer.js +35 -10
  16. package/dist/es2019/view/HoverCard/components/HoverCardContent.js +2 -7
  17. package/dist/es2019/view/HoverCard/components/views/resolved/index.js +56 -7
  18. package/dist/es2019/view/LinkUrl/index.js +1 -1
  19. package/dist/es2019/view/common/ai-summary/index.js +7 -3
  20. package/dist/esm/state/hooks/use-ai-summary/ai-summary-service/index.js +39 -27
  21. package/dist/esm/state/hooks/use-ai-summary/index.js +17 -39
  22. package/dist/esm/utils/analytics/analytics.js +1 -1
  23. package/dist/esm/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +38 -30
  24. package/dist/esm/view/HoverCard/components/ContentContainer.js +39 -13
  25. package/dist/esm/view/HoverCard/components/HoverCardContent.js +2 -11
  26. package/dist/esm/view/HoverCard/components/views/resolved/index.js +66 -18
  27. package/dist/esm/view/LinkUrl/index.js +1 -1
  28. package/dist/esm/view/common/ai-summary/index.js +9 -3
  29. package/dist/types/state/hooks/use-ai-summary/ai-summary-service/types.d.ts +3 -1
  30. package/dist/types/state/hooks/use-ai-summary/index.d.ts +0 -1
  31. package/dist/types/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/types.d.ts +2 -2
  32. package/dist/types/view/FlexibleCard/components/blocks/ai-summary-block/types.d.ts +2 -3
  33. package/dist/types/view/HoverCard/components/views/resolved/types.d.ts +0 -2
  34. package/dist/types/view/HoverCard/types.d.ts +1 -1
  35. package/dist/types/view/common/ai-summary/index.d.ts +4 -0
  36. package/dist/types-ts4.5/state/hooks/use-ai-summary/ai-summary-service/types.d.ts +3 -1
  37. package/dist/types-ts4.5/state/hooks/use-ai-summary/index.d.ts +0 -1
  38. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/types.d.ts +2 -2
  39. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/ai-summary-block/types.d.ts +2 -3
  40. package/dist/types-ts4.5/view/HoverCard/components/views/resolved/types.d.ts +0 -2
  41. package/dist/types-ts4.5/view/HoverCard/types.d.ts +1 -1
  42. package/dist/types-ts4.5/view/common/ai-summary/index.d.ts +4 -0
  43. package/package.json +2 -2
@@ -1,13 +1,13 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
- import { useState, useEffect, useMemo } from 'react';
2
+ import { useState, useEffect } from 'react';
3
3
  import { AISummariesStore } from './ai-summary-service/store';
4
4
  import { AISummaryService } from './ai-summary-service';
5
5
  export var useAISummary = function useAISummary(props) {
6
6
  var _AISummariesStore$get;
7
7
  var url = props.url,
8
8
  baseUrl = props.baseUrl,
9
- product = props.product,
10
- headers = props.headers;
9
+ headers = props.headers,
10
+ product = props.product;
11
11
  var _useState = useState(((_AISummariesStore$get = AISummariesStore.get(url)) === null || _AISummariesStore$get === void 0 ? void 0 : _AISummariesStore$get.state) || {
12
12
  status: 'ready',
13
13
  content: ''
@@ -15,47 +15,25 @@ export var useAISummary = function useAISummary(props) {
15
15
  _useState2 = _slicedToArray(_useState, 2),
16
16
  state = _useState2[0],
17
17
  setState = _useState2[1];
18
-
19
- // Can be used to know the summary status upon mounting a component (HoverCard UI state for example).
20
- // For other scenarios, opt for dynamic status updates via state.status.
21
- var isSummarisedOnMount = useMemo(function () {
22
- var _AISummariesStore$get2;
23
- return ((_AISummariesStore$get2 = AISummariesStore.get(url)) === null || _AISummariesStore$get2 === void 0 ? void 0 : _AISummariesStore$get2.state.status) === 'done';
24
- }, [url]);
25
18
  useEffect(function () {
26
- // Create or subscribe to an AI service only if a summary has not been previously generated.
27
- // Otherwise, use the data from the current state synchronized with a cache (AISummariesStore).
28
- if (!isSummarisedOnMount) {
29
- var aISummaryService = AISummariesStore.get(url);
30
- var isAISummaryServiceInitiated = !!aISummaryService;
31
- if (isAISummaryServiceInitiated) {
32
- //if we want to subscribe to updates from an existing AI service that has not yet provided a summary or is currently in progress.
33
- var unsubscribe = aISummaryService.subscribe(setState);
34
- return function () {
35
- return unsubscribe();
36
- };
37
- } else {
38
- var _AISummariesStore$get3;
39
- //if we want to create a new AI service and wish to subscribe for updates
40
- AISummariesStore.set(url, new AISummaryService({
41
- url: url,
42
- baseUrl: baseUrl,
43
- product: product,
44
- headers: headers
45
- }));
46
- var _unsubscribe = (_AISummariesStore$get3 = AISummariesStore.get(url)) === null || _AISummariesStore$get3 === void 0 ? void 0 : _AISummariesStore$get3.subscribe(setState);
47
- return function () {
48
- return _unsubscribe && _unsubscribe();
49
- };
50
- }
19
+ var _AISummariesStore$get2;
20
+ if (!AISummariesStore.get(url)) {
21
+ AISummariesStore.set(url, new AISummaryService({
22
+ url: url,
23
+ baseUrl: baseUrl,
24
+ headers: headers,
25
+ product: product
26
+ }));
51
27
  }
52
- }, [isSummarisedOnMount, url, baseUrl, product, headers]);
28
+
29
+ //returns function that calls unsubscribe method
30
+ return (_AISummariesStore$get2 = AISummariesStore.get(url)) === null || _AISummariesStore$get2 === void 0 ? void 0 : _AISummariesStore$get2.subscribe(setState);
31
+ }, [url, baseUrl, headers, product]);
53
32
  var summariseUrl = function summariseUrl() {
54
- var _AISummariesStore$get4;
55
- return (_AISummariesStore$get4 = AISummariesStore.get(url)) === null || _AISummariesStore$get4 === void 0 ? void 0 : _AISummariesStore$get4.summariseUrl();
33
+ var _AISummariesStore$get3;
34
+ return (_AISummariesStore$get3 = AISummariesStore.get(url)) === null || _AISummariesStore$get3 === void 0 ? void 0 : _AISummariesStore$get3.summariseUrl();
56
35
  };
57
36
  return {
58
- isSummarisedOnMount: isSummarisedOnMount,
59
37
  summariseUrl: summariseUrl,
60
38
  state: state
61
39
  };
@@ -15,7 +15,7 @@ export var ANALYTICS_CHANNEL = 'media';
15
15
  export var context = {
16
16
  componentName: 'smart-cards',
17
17
  packageName: "@atlaskit/smart-card",
18
- packageVersion: "26.49.0"
18
+ packageVersion: "26.49.1"
19
19
  };
20
20
  export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
21
21
  TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
@@ -1,7 +1,7 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
3
3
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
4
- import React, { useCallback, useMemo, useState } from 'react';
4
+ import React, { useCallback, useMemo, useRef, useState, useEffect } from 'react';
5
5
  import { FormattedMessage } from 'react-intl-next';
6
6
  import { Box, Inline } from '@atlaskit/primitives';
7
7
  import { ActionName, SmartLinkDirection, SmartLinkSize, SmartLinkWidth } from '../../../../../../constants';
@@ -23,39 +23,46 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
23
23
  actions = _props$actions === void 0 ? [] : _props$actions,
24
24
  metadata = props.metadata,
25
25
  onActionMenuOpenChange = props.onActionMenuOpenChange,
26
- onAIActionChange = props.onAIActionChange,
27
26
  _props$size = props.size,
28
27
  size = _props$size === void 0 ? SmartLinkSize.Medium : _props$size,
29
- testId = props.testId;
30
- var _useState = useState('ready'),
31
- _useState2 = _slicedToArray(_useState, 2),
32
- aiState = _useState2[0],
33
- setAIState = _useState2[1];
28
+ testId = props.testId,
29
+ aiSummaryMinHeight = props.aiSummaryMinHeight;
30
+ var metadataElements = renderElementItems(metadata);
34
31
  var _useAnalyticsEvents = useAnalyticsEvents(),
35
32
  fireEvent = _useAnalyticsEvents.fireEvent;
36
- var metadataElements = renderElementItems(metadata);
37
33
  var context = useFlexibleUiContext();
38
34
  var url = (context === null || context === void 0 ? void 0 : context.url) || '';
39
- var aiSummary = useAISummary({
40
- url: url
41
- });
42
- var _aiSummary$state = aiSummary.state,
43
- content = _aiSummary$state.content,
44
- status = _aiSummary$state.status,
45
- isSummarisedOnMount = aiSummary.isSummarisedOnMount;
46
- var onAIActionClick = useCallback(function () {
47
- fireEvent('ui.button.clicked.aiSummary', {});
48
- setAIState('loading');
49
- if (onAIActionChange) {
50
- onAIActionChange('loading');
35
+ var _useAISummary = useAISummary({
36
+ url: url
37
+ }),
38
+ summariseUrl = _useAISummary.summariseUrl,
39
+ _useAISummary$state = _useAISummary.state,
40
+ content = _useAISummary$state.content,
41
+ status = _useAISummary$state.status;
42
+ var showAISummary = status !== 'ready' && status !== 'error';
43
+ var isSummarisedOnMountRef = useRef(status === 'done');
44
+ var isErroredOnMountRef = useRef(status === 'error');
45
+ var _useState = useState(false),
46
+ _useState2 = _slicedToArray(_useState, 2),
47
+ showAISummaryErrorMessage = _useState2[0],
48
+ setShowAISummaryErrorMessage = _useState2[1];
49
+ useEffect(function () {
50
+ if (isErroredOnMountRef.current && status === 'loading') {
51
+ isErroredOnMountRef.current = false;
52
+ setShowAISummaryErrorMessage(true);
53
+ } else {
54
+ setShowAISummaryErrorMessage(!isErroredOnMountRef.current && status === 'error');
51
55
  }
52
- }, [onAIActionChange, fireEvent]);
56
+ }, [status]);
53
57
  var combinedActions = useMemo(function () {
54
- if (aiState === 'ready') {
58
+ if (status === 'ready' || status === 'error') {
55
59
  var aiAction = {
56
60
  content: /*#__PURE__*/React.createElement(FormattedMessage, messages.ai_summarize),
57
61
  name: ActionName.CustomAction,
58
- onClick: onAIActionClick,
62
+ onClick: function onClick() {
63
+ fireEvent('ui.button.clicked.aiSummary', {});
64
+ summariseUrl();
65
+ },
59
66
  testId: "".concat(testId, "-ai-summary-action"),
60
67
  icon: /*#__PURE__*/React.createElement(AIIcon, {
61
68
  label: "AIIcon"
@@ -64,7 +71,7 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
64
71
  return [aiAction].concat(_toConsumableArray(actions));
65
72
  }
66
73
  return actions;
67
- }, [actions, aiState, onAIActionClick, testId]);
74
+ }, [actions, status, testId, summariseUrl, fireEvent]);
68
75
  var onDropdownOpenChange = useCallback(function (isOpen) {
69
76
  if (onActionMenuOpenChange) {
70
77
  onActionMenuOpenChange({
@@ -76,17 +83,18 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
76
83
  direction: SmartLinkDirection.Vertical,
77
84
  testId: "".concat(testId, "-resolved-view")
78
85
  }), status === 'done' && /*#__PURE__*/React.createElement(AIEventSummaryViewed, {
79
- fromCache: isSummarisedOnMount
80
- }), /*#__PURE__*/React.createElement(AISummary, {
86
+ fromCache: isSummarisedOnMountRef.current
87
+ }), showAISummary && /*#__PURE__*/React.createElement(AISummary, {
88
+ minHeight: aiSummaryMinHeight,
81
89
  content: content,
82
- showIcon: isSummarisedOnMount
90
+ showIcon: isSummarisedOnMountRef.current
83
91
  }), /*#__PURE__*/React.createElement(Inline, {
84
92
  alignBlock: "center",
85
93
  alignInline: "end",
86
94
  grow: "fill",
87
95
  spread: "space-between"
88
- }, /*#__PURE__*/React.createElement(Box, null, !isSummarisedOnMount && (aiState === 'loading' || aiState === 'done') ? /*#__PURE__*/React.createElement(AIStateIndicator, {
89
- state: aiState,
96
+ }, /*#__PURE__*/React.createElement(Box, null, !isSummarisedOnMountRef.current && (status === 'loading' || status === 'done') ? /*#__PURE__*/React.createElement(AIStateIndicator, {
97
+ state: status,
90
98
  testId: "".concat(testId, "-state-indicator")
91
99
  }) : /*#__PURE__*/React.createElement(ElementGroup, {
92
100
  width: SmartLinkWidth.FitToContent,
@@ -96,7 +104,7 @@ var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
96
104
  items: combinedActions,
97
105
  appearance: "default",
98
106
  size: size
99
- }))), status === 'error' && /*#__PURE__*/React.createElement(Inline, {
107
+ }))), showAISummaryErrorMessage && /*#__PURE__*/React.createElement(Inline, {
100
108
  grow: "fill"
101
109
  }, /*#__PURE__*/React.createElement(AIEventErrorViewed, null), /*#__PURE__*/React.createElement(AIStateIndicator, {
102
110
  state: status,
@@ -1,31 +1,57 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
+ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["children", "isAIEnabled", "showPrism", "testId"];
4
+ var _excluded = ["children", "isAIEnabled", "testId", "url"],
5
+ _excluded2 = ["children", "isAIEnabled", "testId", "url"];
4
6
  /** @jsx jsx */
5
7
  import { jsx } from '@emotion/react';
6
- import React from 'react';
8
+ import React, { useState, useEffect } from 'react';
7
9
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
8
10
  import { HoverCardContainer, popupContainerStyles } from '../styled';
9
11
  import AIPrism from '../../common/ai-prism';
10
12
  import { hoverCardClassName } from './HoverCardContent';
11
- var ContentContainer = function ContentContainer(_ref) {
13
+ import { useAISummary } from '../../../state/hooks/use-ai-summary';
14
+ var ConnectedAIPrismContainer = function ConnectedAIPrismContainer(_ref) {
12
15
  var children = _ref.children,
13
16
  _ref$isAIEnabled = _ref.isAIEnabled,
14
17
  isAIEnabled = _ref$isAIEnabled === void 0 ? false : _ref$isAIEnabled,
15
- _ref$showPrism = _ref.showPrism,
16
- showPrism = _ref$showPrism === void 0 ? false : _ref$showPrism,
17
18
  testId = _ref.testId,
19
+ url = _ref.url,
18
20
  props = _objectWithoutProperties(_ref, _excluded);
21
+ var _useAISummary = useAISummary({
22
+ url: url
23
+ }),
24
+ status = _useAISummary.state.status;
25
+ var _useState = useState(status === 'loading'),
26
+ _useState2 = _slicedToArray(_useState, 2),
27
+ showPrism = _useState2[0],
28
+ setShowPrism = _useState2[1];
29
+ useEffect(function () {
30
+ setShowPrism(status === 'loading');
31
+ }, [status]);
32
+ var container = jsx("div", _extends({
33
+ className: hoverCardClassName,
34
+ css: [HoverCardContainer, isAIEnabled && showPrism ? undefined : popupContainerStyles],
35
+ "data-testid": testId
36
+ }, props), children);
37
+ return isAIEnabled ? jsx(AIPrism, {
38
+ isVisible: showPrism,
39
+ testId: "".concat(testId, "-prism")
40
+ }, container) : container;
41
+ };
42
+ var ContentContainer = function ContentContainer(_ref2) {
43
+ var children = _ref2.children,
44
+ _ref2$isAIEnabled = _ref2.isAIEnabled,
45
+ isAIEnabled = _ref2$isAIEnabled === void 0 ? false : _ref2$isAIEnabled,
46
+ testId = _ref2.testId,
47
+ url = _ref2.url,
48
+ props = _objectWithoutProperties(_ref2, _excluded2);
19
49
  if (getBooleanFF('platform.linking-platform.smart-card.hover-card-ai-summaries')) {
20
- var container = jsx("div", _extends({
21
- className: hoverCardClassName,
22
- css: [HoverCardContainer, isAIEnabled && showPrism ? undefined : popupContainerStyles],
23
- "data-testid": testId
50
+ return jsx(ConnectedAIPrismContainer, _extends({
51
+ isAIEnabled: isAIEnabled,
52
+ url: url,
53
+ testId: testId
24
54
  }, props), children);
25
- return isAIEnabled ? jsx(AIPrism, {
26
- isVisible: showPrism,
27
- testId: "".concat(testId, "-prism")
28
- }, container) : container;
29
55
  }
30
56
  return jsx("div", _extends({
31
57
  className: hoverCardClassName,
@@ -1,11 +1,10 @@
1
- import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
1
  import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
3
2
  import _regeneratorRuntime from "@babel/runtime/regenerator";
4
3
  /** @jsx jsx */
5
4
  import { jsx } from '@emotion/react';
6
5
  import { useAnalyticsEvents } from '@atlaskit/analytics-next';
7
6
  import CopyIcon from '@atlaskit/icon/glyph/copy';
8
- import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
7
+ import React, { useCallback, useEffect, useMemo, useRef } from 'react';
9
8
  import { useSmartLinkContext } from '@atlaskit/link-provider';
10
9
  import { ActionName, CardDisplay, SmartLinkPosition, SmartLinkSize } from '../../../constants';
11
10
  import { extractMetadata } from '../../../extractors/hover/extractMetadata';
@@ -86,10 +85,6 @@ var HoverCardContent = function HoverCardContent(_ref) {
86
85
  var services = getServices(linkState.details);
87
86
  var statusRef = useRef(linkStatus);
88
87
  var analyticsRef = useRef(analytics);
89
- var _useState = useState(false),
90
- _useState2 = _slicedToArray(_useState, 2),
91
- showPrism = _useState2[0],
92
- setShowPrism = _useState2[1];
93
88
  useEffect(function () {
94
89
  /**
95
90
  * Must access current analytics object value via ref because its not stable
@@ -162,9 +157,6 @@ var HoverCardContent = function HoverCardContent(_ref) {
162
157
  var onClickStopPropagation = useCallback(function (e) {
163
158
  return e.stopPropagation();
164
159
  }, []);
165
- var onAIActionChange = useCallback(function (state) {
166
- setShowPrism(state === 'loading');
167
- }, []);
168
160
  var getCardView = function getCardView(cardState) {
169
161
  if (cardState.metadataStatus === 'pending') {
170
162
  return jsx(HoverCardLoadingView, {
@@ -197,7 +189,6 @@ var HoverCardContent = function HoverCardContent(_ref) {
197
189
  flexibleCardProps: flexibleCardProps,
198
190
  isAISummaryEnabled: isAISummaryEnabled,
199
191
  onActionClick: onActionClick,
200
- onAIActionChange: onAIActionChange,
201
192
  titleBlockProps: titleBlockProps
202
193
  });
203
194
  }
@@ -209,7 +200,7 @@ var HoverCardContent = function HoverCardContent(_ref) {
209
200
  onMouseLeave: onMouseLeave,
210
201
  onClick: onClickStopPropagation,
211
202
  isAIEnabled: isAISummaryEnabled,
212
- showPrism: showPrism
203
+ url: url
213
204
  }, cardView) : null;
214
205
  };
215
206
  export default HoverCardContent;
@@ -1,8 +1,8 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
3
3
  import React, { useCallback, useEffect, useMemo, useRef } from 'react';
4
- import { ActionName, CardDisplay, ElementName, SmartLinkPosition, SmartLinkSize } from '../../../../../constants';
5
- import { FooterBlock, MetadataBlock, RelatedUrlsBlock, SnippetBlock, TitleBlock, AISummaryBlock } from '../../../../FlexibleCard/components/blocks';
4
+ import { ActionName, CardDisplay, ElementName, SmartLinkPosition, SmartLinkSize, SmartLinkDirection } from '../../../../../constants';
5
+ import { FooterBlock, MetadataBlock, RelatedUrlsBlock, SnippetBlock, TitleBlock, AISummaryBlock, CustomBlock } from '../../../../FlexibleCard/components/blocks';
6
6
  import { footerBlockCss, hiddenSnippetStyles, metadataBlockCss } from './styled';
7
7
  import FlexibleCard from '../../../../FlexibleCard';
8
8
  import { getSimulatedBetterMetadata } from '../../../utils';
@@ -12,6 +12,8 @@ import { messages } from '../../../../../messages';
12
12
  import { FormattedMessage } from 'react-intl-next';
13
13
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
14
14
  import { getCanBeDatasource } from '../../../../../state/helpers';
15
+ import { useAISummary } from '../../../../../state/hooks/use-ai-summary';
16
+ import { SmartLinkStatus } from '../../../../../constants';
15
17
  export var toFooterActions = function toFooterActions(cardActions, onActionClick) {
16
18
  var followAction = {
17
19
  hideIcon: true,
@@ -46,19 +48,41 @@ export var toFooterActions = function toFooterActions(cardActions, onActionClick
46
48
  });
47
49
  return [followAction].concat(_toConsumableArray(actions));
48
50
  };
49
- var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
51
+
52
+ //This component encapsulates useAISummary hook under the AI Summary FF 'platform.linking-platform.smart-card.hover-card-ai-summaries'
53
+ var ConnectedAIBlock = function ConnectedAIBlock(_ref) {
54
+ var bottomPrimary = _ref.bottomPrimary,
55
+ url = _ref.url,
56
+ imagePreview = _ref.imagePreview;
57
+ var aiSummary = useAISummary({
58
+ url: url
59
+ });
60
+ var aiStatus = aiSummary.state.status;
61
+ var showData = aiStatus === 'ready' || aiStatus === 'error';
62
+ return showData ? /*#__PURE__*/React.createElement(CustomBlock, {
63
+ direction: SmartLinkDirection.Vertical
64
+ }, !imagePreview && /*#__PURE__*/React.createElement(SnippetBlock, {
65
+ status: SmartLinkStatus.Resolved
66
+ }), /*#__PURE__*/React.createElement(MetadataBlock, {
67
+ primary: bottomPrimary,
68
+ size: SmartLinkSize.Large,
69
+ overrideCss: metadataBlockCss,
70
+ maxLines: 1,
71
+ status: SmartLinkStatus.Resolved
72
+ })) : null;
73
+ };
74
+ var HoverCardResolvedView = function HoverCardResolvedView(_ref2) {
50
75
  var _cardState$details;
51
- var flexibleCardProps = _ref.flexibleCardProps,
52
- titleBlockProps = _ref.titleBlockProps,
53
- analytics = _ref.analytics,
54
- cardState = _ref.cardState,
55
- _ref$cardActions = _ref.cardActions,
56
- cardActions = _ref$cardActions === void 0 ? [] : _ref$cardActions,
57
- isAISummaryEnabled = _ref.isAISummaryEnabled,
58
- onActionClick = _ref.onActionClick,
59
- onAIActionChange = _ref.onAIActionChange,
60
- extensionKey = _ref.extensionKey,
61
- url = _ref.url;
76
+ var flexibleCardProps = _ref2.flexibleCardProps,
77
+ titleBlockProps = _ref2.titleBlockProps,
78
+ analytics = _ref2.analytics,
79
+ cardState = _ref2.cardState,
80
+ _ref2$cardActions = _ref2.cardActions,
81
+ cardActions = _ref2$cardActions === void 0 ? [] : _ref2$cardActions,
82
+ isAISummaryEnabled = _ref2.isAISummaryEnabled,
83
+ onActionClick = _ref2.onActionClick,
84
+ extensionKey = _ref2.extensionKey,
85
+ url = _ref2.url;
62
86
  var canBeDatasource = getCanBeDatasource(cardState.details);
63
87
  useEffect(function () {
64
88
  // Since this hover view is only rendered on resolved status,
@@ -90,6 +114,15 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
90
114
  var _snippetBlockRef$curr, _snippetBlockRef$curr2;
91
115
  snippetHeight.current = (_snippetBlockRef$curr = (_snippetBlockRef$curr2 = snippetBlockRef.current) === null || _snippetBlockRef$curr2 === void 0 ? void 0 : _snippetBlockRef$curr2.getBoundingClientRect().height) !== null && _snippetBlockRef$curr !== void 0 ? _snippetBlockRef$curr : 0;
92
116
  }, []);
117
+
118
+ // We want to maintain the height of the HoverCard while summarizing and pass this height to the AISummaryBlock.
119
+ // This approach will prevent any abrupt changes in the height of the HoverCard.
120
+ var connectedAIBlockHeight = React.useRef(0);
121
+ var connectedAIBlockRef = useRef(null);
122
+ var onConnectedAIBlockRender = useCallback(function () {
123
+ var _connectedAIBlockRef$, _connectedAIBlockRef$2;
124
+ connectedAIBlockHeight.current = (_connectedAIBlockRef$ = (_connectedAIBlockRef$2 = connectedAIBlockRef.current) === null || _connectedAIBlockRef$2 === void 0 ? void 0 : _connectedAIBlockRef$2.getBoundingClientRect().height) !== null && _connectedAIBlockRef$ !== void 0 ? _connectedAIBlockRef$ : 0;
125
+ }, []);
93
126
  var imagePreview = ImagePreview({
94
127
  data: data,
95
128
  fallbackElementHeight: snippetHeight.current
@@ -102,16 +135,31 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
102
135
  overrideCss: metadataBlockCss,
103
136
  maxLines: 1,
104
137
  size: SmartLinkSize.Medium
105
- }), !imagePreview && /*#__PURE__*/React.createElement(SnippetBlock, null), /*#__PURE__*/React.createElement(SnippetBlock, {
138
+ }), isAISummaryEnabled &&
139
+ /*#__PURE__*/
140
+ // All custom elements should be contained within a CustomBlock.
141
+ // Flex Container components check whether the direct child is a flex blocks. It removes anything that isn't
142
+ React.createElement(CustomBlock, {
143
+ direction: SmartLinkDirection.Vertical,
144
+ onRender: onConnectedAIBlockRender,
145
+ blockRef: connectedAIBlockRef
146
+ }, /*#__PURE__*/React.createElement(ConnectedAIBlock, {
147
+ imagePreview: !!imagePreview,
148
+ url: url,
149
+ bottomPrimary: bottomPrimary
150
+ })), !isAISummaryEnabled && !imagePreview && /*#__PURE__*/React.createElement(SnippetBlock, {
151
+ status: SmartLinkStatus.Resolved
152
+ }), /*#__PURE__*/React.createElement(SnippetBlock, {
106
153
  testId: 'hidden-snippet',
107
154
  onRender: onSnippetRender,
108
155
  blockRef: snippetBlockRef,
109
156
  overrideCss: hiddenSnippetStyles
110
- }), /*#__PURE__*/React.createElement(MetadataBlock, {
157
+ }), !isAISummaryEnabled && /*#__PURE__*/React.createElement(MetadataBlock, {
111
158
  primary: bottomPrimary,
112
159
  size: SmartLinkSize.Large,
113
160
  overrideCss: metadataBlockCss,
114
- maxLines: 1
161
+ maxLines: 1,
162
+ status: SmartLinkStatus.Resolved
115
163
  }), getBooleanFF('platform.linking-platform.smart-card.enable-hover-card-related-urls') && /*#__PURE__*/React.createElement(RelatedUrlsBlock, {
116
164
  url: url,
117
165
  size: SmartLinkSize.Small
@@ -120,7 +168,7 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
120
168
  name: ElementName.Provider
121
169
  }],
122
170
  actions: footerActions,
123
- onAIActionChange: onAIActionChange
171
+ aiSummaryMinHeight: connectedAIBlockHeight.current
124
172
  }) : /*#__PURE__*/React.createElement(FooterBlock, {
125
173
  actions: footerActions,
126
174
  size: SmartLinkSize.Large,
@@ -10,7 +10,7 @@ import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-m
10
10
  import LinkWarningModal from './LinkWarningModal';
11
11
  var PACKAGE_DATA = {
12
12
  packageName: "@atlaskit/smart-card",
13
- packageVersion: "26.49.0",
13
+ packageVersion: "26.49.1",
14
14
  componentName: 'linkUrl'
15
15
  };
16
16
  var Link = withLinkClickedEvent('a');
@@ -23,14 +23,17 @@ var AISummaryCSS = css({
23
23
  */
24
24
 
25
25
  var AISummary = function AISummary(_ref) {
26
- var content = _ref.content,
26
+ var _ref$content = _ref.content,
27
+ content = _ref$content === void 0 ? '' : _ref$content,
27
28
  _ref$showIcon = _ref.showIcon,
28
29
  showIcon = _ref$showIcon === void 0 ? false : _ref$showIcon,
29
30
  iconComponent = _ref.iconComponent,
30
31
  overrideCss = _ref.overrideCss,
31
32
  _ref$testId = _ref.testId,
32
- testId = _ref$testId === void 0 ? 'ai-summary' : _ref$testId;
33
- if (!content) {
33
+ testId = _ref$testId === void 0 ? 'ai-summary' : _ref$testId,
34
+ _ref$minHeight = _ref.minHeight,
35
+ minHeight = _ref$minHeight === void 0 ? 0 : _ref$minHeight;
36
+ if (!content && minHeight === 0) {
34
37
  return null;
35
38
  }
36
39
  return jsx(Markdown, {
@@ -42,6 +45,9 @@ var AISummary = function AISummary(_ref) {
42
45
  overrides: {
43
46
  Icon: iconComponent !== null && iconComponent !== void 0 ? iconComponent : AITooltipIcon
44
47
  }
48
+ },
49
+ style: {
50
+ minHeight: minHeight
45
51
  }
46
52
  });
47
53
  };
@@ -34,7 +34,9 @@ export type StateSetter = (state: AISummaryState) => any;
34
34
  export type StreamMessage = StreamTrace | StreamAnswerPart | StreamResponse | StreamError;
35
35
  export type StreamResponse = {
36
36
  type: 'FINAL_RESPONSE';
37
- message: Message;
37
+ message: {
38
+ message: Message;
39
+ };
38
40
  millisOffset?: number;
39
41
  metadata?: {
40
42
  request_id?: string;
@@ -1,6 +1,5 @@
1
1
  import type { AISummaryServiceProps, AISummaryStatus } from './ai-summary-service/types';
2
2
  export declare const useAISummary: (props: AISummaryServiceProps) => {
3
- isSummarisedOnMount: boolean;
4
3
  summariseUrl: () => Promise<void> | undefined;
5
4
  state: {
6
5
  status: AISummaryStatus;
@@ -1,11 +1,11 @@
1
1
  /// <reference types="react" />
2
2
  import type { XCSS } from '@atlaskit/primitives';
3
3
  import type { TooltipProps } from '@atlaskit/tooltip';
4
- import type { AIState } from '../types';
4
+ import type { AISummaryStatus } from '../../../../../../state/hooks/use-ai-summary/ai-summary-service/types';
5
5
  export type AIStateAppearance = 'default' | 'icon-only';
6
6
  export type AIStateIndicatorProps = {
7
7
  appearance?: AIStateAppearance;
8
- state: AIState;
8
+ state: AISummaryStatus;
9
9
  testId?: string;
10
10
  };
11
11
  export type AIIndicatorContainerProps = {
@@ -1,6 +1,5 @@
1
1
  import { ActionItem, BlockProps, ElementItem } from '../types';
2
2
  import { OnActionMenuOpenChangeOptions } from '../types';
3
- export type AIState = 'ready' | 'loading' | 'error' | 'done';
4
3
  export type AISummaryBlockProps = {
5
4
  /**
6
5
  * An array of actions to be displayed on the right
@@ -18,7 +17,7 @@ export type AISummaryBlockProps = {
18
17
  */
19
18
  onActionMenuOpenChange?: (options: OnActionMenuOpenChangeOptions) => void;
20
19
  /**
21
- * Function to be called when AI Summary state changed.
20
+ * Minimum height requirement for the AISummary component to prevent fluctuations in a card size on the summary action.
22
21
  */
23
- onAIActionChange?: (state: AIState) => void;
22
+ aiSummaryMinHeight?: number;
24
23
  } & BlockProps;
@@ -2,7 +2,6 @@ import { AnalyticsFacade } from '../../../../../state/analytics';
2
2
  import { LinkAction } from '../../../../../state/hooks-external/useSmartLinkActions';
3
3
  import { CardState } from '@atlaskit/linking-common';
4
4
  import { HoverCardLoadingViewProps } from '../resolving/types';
5
- import { AISummaryBlockProps } from '../../../../FlexibleCard/components/blocks/ai-summary-block/types';
6
5
  export type HoverCardResolvedProps = {
7
6
  extensionKey?: string;
8
7
  id?: string;
@@ -12,5 +11,4 @@ export type HoverCardResolvedProps = {
12
11
  cardState: CardState;
13
12
  isAISummaryEnabled?: boolean;
14
13
  onActionClick: (actionId: string) => void;
15
- onAIActionChange?: AISummaryBlockProps['onAIActionChange'];
16
14
  } & HoverCardLoadingViewProps;
@@ -101,8 +101,8 @@ export type HoverCardContentProps = {
101
101
  };
102
102
  export type ContentContainerProps = React.HTMLAttributes<HTMLDivElement> & {
103
103
  isAIEnabled?: boolean;
104
- showPrism?: boolean;
105
104
  testId?: string;
105
+ url: string;
106
106
  };
107
107
  export type ImagePreviewProps = {
108
108
  data: JsonLd.Data.BaseData;
@@ -12,6 +12,10 @@ type AISummaryProps = {
12
12
  * serving as a hook for automated tests
13
13
  */
14
14
  testId?: string;
15
+ /**
16
+ * Minimum height requirement for the AISummary component to prevent fluctuations in a card size on the summary action.
17
+ */
18
+ minHeight?: number;
15
19
  };
16
20
  /**
17
21
  * A component to render a response from AI in markdown text.
@@ -34,7 +34,9 @@ export type StateSetter = (state: AISummaryState) => any;
34
34
  export type StreamMessage = StreamTrace | StreamAnswerPart | StreamResponse | StreamError;
35
35
  export type StreamResponse = {
36
36
  type: 'FINAL_RESPONSE';
37
- message: Message;
37
+ message: {
38
+ message: Message;
39
+ };
38
40
  millisOffset?: number;
39
41
  metadata?: {
40
42
  request_id?: string;
@@ -1,6 +1,5 @@
1
1
  import type { AISummaryServiceProps, AISummaryStatus } from './ai-summary-service/types';
2
2
  export declare const useAISummary: (props: AISummaryServiceProps) => {
3
- isSummarisedOnMount: boolean;
4
3
  summariseUrl: () => Promise<void> | undefined;
5
4
  state: {
6
5
  status: AISummaryStatus;
@@ -1,11 +1,11 @@
1
1
  /// <reference types="react" />
2
2
  import type { XCSS } from '@atlaskit/primitives';
3
3
  import type { TooltipProps } from '@atlaskit/tooltip';
4
- import type { AIState } from '../types';
4
+ import type { AISummaryStatus } from '../../../../../../state/hooks/use-ai-summary/ai-summary-service/types';
5
5
  export type AIStateAppearance = 'default' | 'icon-only';
6
6
  export type AIStateIndicatorProps = {
7
7
  appearance?: AIStateAppearance;
8
- state: AIState;
8
+ state: AISummaryStatus;
9
9
  testId?: string;
10
10
  };
11
11
  export type AIIndicatorContainerProps = {