@atlaskit/smart-card 26.59.1 → 26.61.0

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 (164) hide show
  1. package/CHANGELOG.md +40 -0
  2. package/dist/cjs/extractors/common/icon/extractIcon.js +19 -1
  3. package/dist/cjs/extractors/common/icon/index.js +7 -0
  4. package/dist/cjs/extractors/embed/index.js +26 -1
  5. package/dist/cjs/extractors/flexible/actions/extract-ai-summary-action.js +2 -2
  6. package/dist/cjs/extractors/flexible/icon/extract-jsonld-data-icon.js +33 -4
  7. package/dist/cjs/state/hooks/use-ai-summary/ai-summary-service/index.js +2 -1
  8. package/dist/cjs/utils/{get-is-ai-summary-enabled.js → ai-summary.js} +21 -1
  9. package/dist/cjs/utils/analytics/analytics.js +1 -1
  10. package/dist/cjs/view/BlockCard/views/flexible/utils/index.js +8 -0
  11. package/dist/cjs/view/CardWithUrl/component-lazy/LazyIntersectionObserverCard.js +4 -51
  12. package/dist/cjs/view/EmbedCard/components/ExpandedFrame.js +2 -0
  13. package/dist/cjs/view/EmbedCard/components/styled.js +5 -1
  14. package/dist/cjs/view/FlexibleCard/components/actions/action/action-icon/index.js +0 -3
  15. package/dist/cjs/view/FlexibleCard/components/actions/ai-summary-action/ai-summary-action-component.js +22 -14
  16. package/dist/cjs/view/FlexibleCard/components/actions/ai-summary-action/utils.js +32 -0
  17. package/dist/cjs/view/FlexibleCard/components/actions/follow-action/goal-icon/index.js +1 -1
  18. package/dist/cjs/view/FlexibleCard/components/actions/follow-action/projects-icon/index.js +1 -1
  19. package/dist/cjs/view/FlexibleCard/components/blocks/action-block/action-footer/index.js +67 -0
  20. package/dist/cjs/view/FlexibleCard/components/blocks/action-block/index.js +23 -3
  21. package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/ai-state-done.js +1 -1
  22. package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/ai-state-error.js +5 -24
  23. package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +4 -4
  24. package/dist/cjs/view/FlexibleCard/components/{blocks/ai-summary-block/ai-event-error-viewed/index.js → common/ai-summary/ai-event-error-viewed.js} +1 -1
  25. package/dist/cjs/view/FlexibleCard/components/{blocks/ai-summary-block/ai-state-indicator → common/ai-summary}/ai-learn-more-anchor.js +1 -1
  26. package/dist/cjs/view/FlexibleCard/components/{blocks/ai-summary-block/ai-motion-wrapper → common/motion-wrapper}/index.js +3 -3
  27. package/dist/cjs/view/FlexibleCard/components/common/motion-wrapper/types.js +5 -0
  28. package/dist/cjs/view/HoverCard/components/HoverCardContent.js +2 -2
  29. package/dist/cjs/view/HoverCard/components/views/resolved/index.js +1 -7
  30. package/dist/cjs/view/HoverCard/utils.js +1 -1
  31. package/dist/cjs/view/LinkUrl/index.js +1 -1
  32. package/dist/cjs/view/common/ai-icon/index.js +23 -20
  33. package/dist/cjs/view/common/ai-summary/index.js +1 -0
  34. package/dist/es2019/extractors/common/icon/extractIcon.js +21 -1
  35. package/dist/es2019/extractors/common/icon/index.js +1 -0
  36. package/dist/es2019/extractors/embed/index.js +28 -2
  37. package/dist/es2019/extractors/flexible/actions/extract-ai-summary-action.js +1 -1
  38. package/dist/es2019/extractors/flexible/icon/extract-jsonld-data-icon.js +34 -3
  39. package/dist/es2019/state/hooks/use-ai-summary/ai-summary-service/index.js +1 -0
  40. package/dist/es2019/utils/ai-summary.js +25 -0
  41. package/dist/es2019/utils/analytics/analytics.js +1 -1
  42. package/dist/es2019/view/BlockCard/views/flexible/utils/index.js +8 -0
  43. package/dist/es2019/view/CardWithUrl/component-lazy/LazyIntersectionObserverCard.js +2 -44
  44. package/dist/es2019/view/EmbedCard/components/ExpandedFrame.js +2 -0
  45. package/dist/es2019/view/EmbedCard/components/styled.js +8 -2
  46. package/dist/es2019/view/FlexibleCard/components/actions/action/action-icon/index.js +0 -3
  47. package/dist/es2019/view/FlexibleCard/components/actions/ai-summary-action/ai-summary-action-component.js +21 -13
  48. package/dist/es2019/view/FlexibleCard/components/actions/ai-summary-action/utils.js +24 -0
  49. package/dist/es2019/view/FlexibleCard/components/actions/follow-action/goal-icon/index.js +1 -1
  50. package/dist/es2019/view/FlexibleCard/components/actions/follow-action/projects-icon/index.js +1 -1
  51. package/dist/es2019/view/FlexibleCard/components/blocks/action-block/action-footer/index.js +61 -0
  52. package/dist/es2019/view/FlexibleCard/components/blocks/action-block/index.js +19 -4
  53. package/dist/es2019/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/ai-state-done.js +1 -1
  54. package/dist/es2019/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/ai-state-error.js +3 -22
  55. package/dist/es2019/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +4 -4
  56. package/dist/es2019/view/FlexibleCard/components/{blocks/ai-summary-block/ai-event-error-viewed/index.js → common/ai-summary/ai-event-error-viewed.js} +1 -1
  57. package/dist/es2019/view/FlexibleCard/components/{blocks/ai-summary-block/ai-state-indicator → common/ai-summary}/ai-learn-more-anchor.js +1 -1
  58. package/dist/es2019/view/FlexibleCard/components/{blocks/ai-summary-block/ai-motion-wrapper → common/motion-wrapper}/index.js +2 -2
  59. package/dist/es2019/view/HoverCard/components/HoverCardContent.js +1 -1
  60. package/dist/es2019/view/HoverCard/components/views/resolved/index.js +1 -7
  61. package/dist/es2019/view/HoverCard/utils.js +1 -1
  62. package/dist/es2019/view/LinkUrl/index.js +1 -1
  63. package/dist/es2019/view/common/ai-icon/index.js +104 -99
  64. package/dist/es2019/view/common/ai-summary/index.js +1 -0
  65. package/dist/esm/extractors/common/icon/extractIcon.js +19 -1
  66. package/dist/esm/extractors/common/icon/index.js +1 -0
  67. package/dist/esm/extractors/embed/index.js +27 -2
  68. package/dist/esm/extractors/flexible/actions/extract-ai-summary-action.js +1 -1
  69. package/dist/esm/extractors/flexible/icon/extract-jsonld-data-icon.js +33 -3
  70. package/dist/esm/state/hooks/use-ai-summary/ai-summary-service/index.js +2 -1
  71. package/dist/esm/utils/{get-is-ai-summary-enabled.js → ai-summary.js} +20 -0
  72. package/dist/esm/utils/analytics/analytics.js +1 -1
  73. package/dist/esm/view/BlockCard/views/flexible/utils/index.js +8 -0
  74. package/dist/esm/view/CardWithUrl/component-lazy/LazyIntersectionObserverCard.js +3 -50
  75. package/dist/esm/view/EmbedCard/components/ExpandedFrame.js +2 -0
  76. package/dist/esm/view/EmbedCard/components/styled.js +5 -1
  77. package/dist/esm/view/FlexibleCard/components/actions/action/action-icon/index.js +0 -3
  78. package/dist/esm/view/FlexibleCard/components/actions/ai-summary-action/ai-summary-action-component.js +22 -14
  79. package/dist/esm/view/FlexibleCard/components/actions/ai-summary-action/utils.js +25 -0
  80. package/dist/esm/view/FlexibleCard/components/actions/follow-action/goal-icon/index.js +1 -1
  81. package/dist/esm/view/FlexibleCard/components/actions/follow-action/projects-icon/index.js +1 -1
  82. package/dist/esm/view/FlexibleCard/components/blocks/action-block/action-footer/index.js +60 -0
  83. package/dist/esm/view/FlexibleCard/components/blocks/action-block/action-footer/types.js +1 -0
  84. package/dist/esm/view/FlexibleCard/components/blocks/action-block/index.js +23 -4
  85. package/dist/esm/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/ai-state-done.js +1 -1
  86. package/dist/esm/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/ai-state-error.js +5 -24
  87. package/dist/esm/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js +4 -4
  88. package/dist/esm/view/FlexibleCard/components/{blocks/ai-summary-block/ai-event-error-viewed/index.js → common/ai-summary/ai-event-error-viewed.js} +1 -1
  89. package/dist/esm/view/FlexibleCard/components/{blocks/ai-summary-block/ai-state-indicator → common/ai-summary}/ai-learn-more-anchor.js +1 -1
  90. package/dist/esm/view/FlexibleCard/components/{blocks/ai-summary-block/ai-motion-wrapper → common/motion-wrapper}/index.js +2 -2
  91. package/dist/esm/view/FlexibleCard/components/common/motion-wrapper/types.js +1 -0
  92. package/dist/esm/view/HoverCard/components/HoverCardContent.js +1 -1
  93. package/dist/esm/view/HoverCard/components/views/resolved/index.js +1 -7
  94. package/dist/esm/view/HoverCard/utils.js +1 -1
  95. package/dist/esm/view/LinkUrl/index.js +1 -1
  96. package/dist/esm/view/common/ai-icon/index.js +23 -20
  97. package/dist/esm/view/common/ai-summary/index.js +1 -0
  98. package/dist/types/extractors/common/icon/index.d.ts +1 -0
  99. package/dist/types/extractors/embed/index.d.ts +3 -3
  100. package/dist/types/extractors/flexible/actions/extract-ai-summary-action.d.ts +3 -3
  101. package/dist/types/state/hooks/use-ai-summary/ai-summary-service/index.d.ts +1 -1
  102. package/dist/types/state/hooks/use-ai-summary/ai-summary-service/types.d.ts +1 -1
  103. package/dist/types/state/hooks/use-ai-summary/index.d.ts +1 -1
  104. package/dist/types/utils/ai-summary.d.ts +8 -0
  105. package/dist/types/view/BlockCard/views/flexible/utils/index.d.ts +2 -2
  106. package/dist/types/view/CardWithUrl/component-lazy/LazyIntersectionObserverCard.d.ts +1 -4
  107. package/dist/types/view/EmbedCard/components/ExpandedFrame.d.ts +2 -2
  108. package/dist/types/view/EmbedCard/components/styled.d.ts +1 -0
  109. package/dist/types/view/EmbedCard/views/ResolvedView.d.ts +1 -1
  110. package/dist/types/view/FlexibleCard/components/actions/action/action-icon/index.d.ts +1 -1
  111. package/dist/types/view/FlexibleCard/components/actions/action/types.d.ts +11 -1
  112. package/dist/types/view/FlexibleCard/components/actions/ai-summary-action/ai-summary-action-component.d.ts +3 -3
  113. package/dist/types/view/FlexibleCard/components/actions/ai-summary-action/utils.d.ts +3 -0
  114. package/dist/types/view/FlexibleCard/components/actions/follow-action/goal-icon/index.d.ts +1 -1
  115. package/dist/types/view/FlexibleCard/components/actions/follow-action/projects-icon/index.d.ts +1 -1
  116. package/dist/types/view/FlexibleCard/components/blocks/action-block/action-footer/index.d.ts +3 -0
  117. package/dist/types/view/FlexibleCard/components/blocks/action-block/action-footer/types.d.ts +8 -0
  118. package/dist/types/view/FlexibleCard/components/blocks/action-block/index.d.ts +1 -1
  119. package/dist/types/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/ai-state-error.d.ts +1 -1
  120. package/dist/types/view/FlexibleCard/components/common/motion-wrapper/index.d.ts +4 -0
  121. package/dist/types/view/FlexibleCard/components/{blocks/ai-summary-block/ai-motion-wrapper → common/motion-wrapper}/types.d.ts +1 -1
  122. package/dist/types/view/HoverCard/components/HoverCardContent.d.ts +2 -2
  123. package/dist/types/view/HoverCard/components/views/resolved/index.d.ts +3 -3
  124. package/dist/types/view/common/ai-summary/index.d.ts +1 -1
  125. package/dist/types-ts4.5/extractors/common/icon/index.d.ts +1 -0
  126. package/dist/types-ts4.5/extractors/embed/index.d.ts +3 -3
  127. package/dist/types-ts4.5/extractors/flexible/actions/extract-ai-summary-action.d.ts +3 -3
  128. package/dist/types-ts4.5/state/hooks/use-ai-summary/ai-summary-service/index.d.ts +1 -1
  129. package/dist/types-ts4.5/state/hooks/use-ai-summary/ai-summary-service/types.d.ts +1 -1
  130. package/dist/types-ts4.5/state/hooks/use-ai-summary/index.d.ts +1 -1
  131. package/dist/types-ts4.5/utils/ai-summary.d.ts +8 -0
  132. package/dist/types-ts4.5/view/BlockCard/views/flexible/utils/index.d.ts +2 -2
  133. package/dist/types-ts4.5/view/CardWithUrl/component-lazy/LazyIntersectionObserverCard.d.ts +1 -4
  134. package/dist/types-ts4.5/view/EmbedCard/components/ExpandedFrame.d.ts +2 -2
  135. package/dist/types-ts4.5/view/EmbedCard/components/styled.d.ts +1 -0
  136. package/dist/types-ts4.5/view/EmbedCard/views/ResolvedView.d.ts +1 -1
  137. package/dist/types-ts4.5/view/FlexibleCard/components/actions/action/action-icon/index.d.ts +1 -1
  138. package/dist/types-ts4.5/view/FlexibleCard/components/actions/action/types.d.ts +11 -1
  139. package/dist/types-ts4.5/view/FlexibleCard/components/actions/ai-summary-action/ai-summary-action-component.d.ts +3 -3
  140. package/dist/types-ts4.5/view/FlexibleCard/components/actions/ai-summary-action/utils.d.ts +3 -0
  141. package/dist/types-ts4.5/view/FlexibleCard/components/actions/follow-action/goal-icon/index.d.ts +1 -1
  142. package/dist/types-ts4.5/view/FlexibleCard/components/actions/follow-action/projects-icon/index.d.ts +1 -1
  143. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/action-block/action-footer/index.d.ts +3 -0
  144. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/action-block/action-footer/types.d.ts +8 -0
  145. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/action-block/index.d.ts +1 -1
  146. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/ai-summary-block/ai-state-indicator/ai-state-error.d.ts +1 -1
  147. package/dist/types-ts4.5/view/FlexibleCard/components/common/motion-wrapper/index.d.ts +4 -0
  148. package/dist/types-ts4.5/view/FlexibleCard/components/{blocks/ai-summary-block/ai-motion-wrapper → common/motion-wrapper}/types.d.ts +1 -1
  149. package/dist/types-ts4.5/view/HoverCard/components/HoverCardContent.d.ts +2 -2
  150. package/dist/types-ts4.5/view/HoverCard/components/views/resolved/index.d.ts +3 -3
  151. package/dist/types-ts4.5/view/common/ai-summary/index.d.ts +1 -1
  152. package/package.json +9 -9
  153. package/dist/es2019/utils/get-is-ai-summary-enabled.js +0 -5
  154. package/dist/types/utils/get-is-ai-summary-enabled.d.ts +0 -2
  155. package/dist/types/view/FlexibleCard/components/blocks/ai-summary-block/ai-motion-wrapper/index.d.ts +0 -4
  156. package/dist/types-ts4.5/utils/get-is-ai-summary-enabled.d.ts +0 -2
  157. package/dist/types-ts4.5/view/FlexibleCard/components/blocks/ai-summary-block/ai-motion-wrapper/index.d.ts +0 -4
  158. /package/dist/cjs/view/FlexibleCard/components/blocks/{ai-summary-block/ai-motion-wrapper → action-block/action-footer}/types.js +0 -0
  159. /package/dist/es2019/view/FlexibleCard/components/blocks/{ai-summary-block/ai-motion-wrapper → action-block/action-footer}/types.js +0 -0
  160. /package/dist/{esm/view/FlexibleCard/components/blocks/ai-summary-block/ai-motion-wrapper → es2019/view/FlexibleCard/components/common/motion-wrapper}/types.js +0 -0
  161. /package/dist/types/view/FlexibleCard/components/{blocks/ai-summary-block/ai-event-error-viewed/index.d.ts → common/ai-summary/ai-event-error-viewed.d.ts} +0 -0
  162. /package/dist/types/view/FlexibleCard/components/{blocks/ai-summary-block/ai-state-indicator → common/ai-summary}/ai-learn-more-anchor.d.ts +0 -0
  163. /package/dist/types-ts4.5/view/FlexibleCard/components/{blocks/ai-summary-block/ai-event-error-viewed/index.d.ts → common/ai-summary/ai-event-error-viewed.d.ts} +0 -0
  164. /package/dist/types-ts4.5/view/FlexibleCard/components/{blocks/ai-summary-block/ai-state-indicator → common/ai-summary}/ai-learn-more-anchor.d.ts +0 -0
@@ -1,5 +1,4 @@
1
1
  import React, { useCallback, useEffect, useRef, useState } from 'react';
2
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
3
2
  import { usePrefetch } from '../../../state';
4
3
  import { CardWithUrlContent } from '../component';
5
4
  import { LoadingCardLink } from './LoadingCardLink';
@@ -10,44 +9,7 @@ import { startUfoExperience } from '../../../state/analytics/ufoExperiences';
10
9
  // being compared to. Since the default container is the `document`, we set this
11
10
  // up to check once a Smart Link is within `X` px from the bottom of the viewport.
12
11
  const ROOT_MARGIN_VERTICAL = '360px';
13
- function LazyIntersectionObserverCardLegacy(props) {
14
- const [isIntersecting, setIsIntersecting] = useState(false);
15
- const {
16
- appearance,
17
- url,
18
- id
19
- } = props;
20
- const prefetch = usePrefetch(url);
21
- const Component = appearance === 'inline' ? 'span' : 'div';
22
- const ComponentObserver = Component;
23
- const onIntersection = useCallback((entries, observer) => {
24
- const isVisible = entries.some(entry => entry.isIntersecting);
25
- if (isVisible) {
26
- startUfoExperience('smart-link-rendered', id);
27
- setIsIntersecting(true);
28
- observer.disconnect();
29
- } else {
30
- prefetch();
31
- }
32
- }, [prefetch, id]);
33
- const onRef = useCallback(element => {
34
- if (!element) {
35
- return;
36
- }
37
- const intersectionObserver = new IntersectionObserver(onIntersection, {
38
- rootMargin: `${ROOT_MARGIN_VERTICAL} 0px ${ROOT_MARGIN_VERTICAL} 0px`
39
- });
40
- intersectionObserver.observe(element);
41
- return () => intersectionObserver.disconnect();
42
- }, [onIntersection]);
43
- const content = isIntersecting ? /*#__PURE__*/React.createElement(CardWithUrlContent, props) : /*#__PURE__*/React.createElement(ComponentObserver, {
44
- ref: onRef
45
- }, /*#__PURE__*/React.createElement(LoadingCardLink, props));
46
- return /*#__PURE__*/React.createElement(Component, {
47
- className: "loader-wrapper"
48
- }, content);
49
- }
50
- function LazyIntersectionObserverCardNext(props) {
12
+ export function LazyIntersectionObserverCard(props) {
51
13
  const ref = useRef(null);
52
14
  const [isIntersecting, setIsIntersecting] = useState(false);
53
15
  const {
@@ -84,8 +46,4 @@ function LazyIntersectionObserverCardNext(props) {
84
46
  return /*#__PURE__*/React.createElement(Component, {
85
47
  className: "loader-wrapper"
86
48
  }, content);
87
- }
88
- export const LazyIntersectionObserverCard = props => {
89
- const Component = getBooleanFF('platform.linking-platform.smart-card.fix-intersection-observer') ? LazyIntersectionObserverCardNext : LazyIntersectionObserverCardLegacy;
90
- return /*#__PURE__*/React.createElement(Component, props);
91
- };
49
+ }
@@ -22,6 +22,7 @@ export const ExpandedFrame = ({
22
22
  const isInteractive = () => !isPlaceholder && (Boolean(href) || Boolean(onClick));
23
23
  const handleClick = event => handleClickCommon(event, onClick);
24
24
  const handleMouseDown = useMouseDownEvent();
25
+ const isFixEmbedCardBlurEnabled = getBooleanFF('platform.linking-platform.smart-card.fix-embed-card-blurring') ? true : false;
25
26
  const renderHeaderOld = () => /*#__PURE__*/React.createElement(Header, {
26
27
  className: "embed-header",
27
28
  frameStyle: frameStyle
@@ -52,6 +53,7 @@ export const ExpandedFrame = ({
52
53
  const renderContent = () => /*#__PURE__*/React.createElement(Content, {
53
54
  "data-testid": "embed-content-wrapper",
54
55
  allowScrollBar: allowScrollBar,
56
+ removeOverflow: isFixEmbedCardBlurEnabled,
55
57
  isInteractive: isInteractive(),
56
58
  frameStyle: frameStyle
57
59
  }, children);
@@ -224,8 +224,14 @@ export const Content = styled.div`
224
224
  }
225
225
 
226
226
  ${({
227
- allowScrollBar
228
- }) => allowScrollBar ? 'overflow: auto;' : 'overflow: hidden;'}
227
+ allowScrollBar,
228
+ removeOverflow
229
+ }) => {
230
+ if (removeOverflow) {
231
+ return '';
232
+ }
233
+ return allowScrollBar ? 'overflow: auto;' : 'overflow: hidden;';
234
+ }}
229
235
 
230
236
  ${({
231
237
  frameStyle
@@ -18,9 +18,6 @@ const getIconStyles = isDisabled => css({
18
18
  color: isDisabled ? "var(--ds-text-disabled, #6B778C)" : "var(--ds-icon, #44546F)"
19
19
  });
20
20
  const backgroundStyles = css({
21
- backgroundColor: "var(--ds-background-brand-subtlest, #E9F2FF)",
22
- borderRadius: "var(--ds-border-radius-050, 2px)",
23
- color: "var(--ds-icon-brand, #0C66E4)",
24
21
  display: 'inline-block',
25
22
  lineHeight: 0,
26
23
  padding: "var(--ds-space-025, 2px)",
@@ -1,13 +1,16 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import React, { useCallback } from 'react';
3
3
  import { FormattedMessage } from 'react-intl-next';
4
+ import { di } from 'react-magnetic-di';
4
5
  import { messages } from '../../../../../messages';
5
6
  import Action from '../action';
6
7
  import AiIcon from '../../../../common/ai-icon';
7
8
  import { useAnalyticsEvents } from '../../../../../common/analytics/generated/use-analytics-events';
8
9
  import { useAISummary } from '../../../../../state/hooks/use-ai-summary';
10
+ import { getErrorMessage } from './utils';
9
11
  export const AISummaryActionComponent = ({
10
12
  onClick: onClickCallback,
13
+ onError: onErrorCallback,
11
14
  url = '',
12
15
  ari = '',
13
16
  product,
@@ -26,26 +29,31 @@ export const AISummaryActionComponent = ({
26
29
  ari,
27
30
  product
28
31
  });
32
+ const onCompleted = useCallback(state => {
33
+ if ((state === null || state === void 0 ? void 0 : state.status) === 'error') {
34
+ onErrorCallback === null || onErrorCallback === void 0 ? void 0 : onErrorCallback(getErrorMessage(state.error));
35
+ }
36
+ }, [onErrorCallback]);
29
37
  const handleActionClick = useCallback(() => {
38
+ var _summariseUrl;
30
39
  fireEvent('ui.button.clicked.aiSummary', {});
31
40
  fireEvent('track.aiInteraction.initiated', {
32
41
  aiFeatureName: 'Smart Links Summary',
33
42
  proactiveAIGenerated: 0,
34
43
  userGeneratedAI: 1
35
44
  });
36
- summariseUrl();
45
+ (_summariseUrl = summariseUrl()) === null || _summariseUrl === void 0 ? void 0 : _summariseUrl.then(onCompleted, onCompleted);
37
46
  onClickCallback === null || onClickCallback === void 0 ? void 0 : onClickCallback();
38
- }, [fireEvent, onClickCallback, summariseUrl]);
39
- if (status === 'ready' || status === 'error') {
40
- return /*#__PURE__*/React.createElement(Action, _extends({
41
- content: /*#__PURE__*/React.createElement(FormattedMessage, messages.ai_summary_action),
42
- icon: /*#__PURE__*/React.createElement(AiIcon, {
43
- label: "Summarise with AI"
44
- }),
45
- onClick: handleActionClick,
46
- testId: "smart-action-ai-summary-action",
47
- tooltipMessage: /*#__PURE__*/React.createElement(FormattedMessage, messages.ai_summary_action_description)
48
- }, props));
49
- }
47
+ }, [fireEvent, onClickCallback, onCompleted, summariseUrl]);
48
+ return /*#__PURE__*/React.createElement(Action, _extends({
49
+ content: /*#__PURE__*/React.createElement(FormattedMessage, messages.ai_summary_action),
50
+ icon: /*#__PURE__*/React.createElement(AiIcon, {
51
+ label: "Summarise with AI"
52
+ }),
53
+ isLoading: status === 'loading',
54
+ onClick: handleActionClick,
55
+ testId: "smart-action-ai-summary-action",
56
+ tooltipMessage: /*#__PURE__*/React.createElement(FormattedMessage, messages.ai_summary_action_description)
57
+ }, props));
50
58
  return null;
51
59
  };
@@ -0,0 +1,24 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import React from 'react';
3
+ import { FormattedMessage } from 'react-intl-next';
4
+ import { getAISummaryErrorMessage } from '../../../../../utils/ai-summary';
5
+ import AIEventErrorViewed from '../../common/ai-summary/ai-event-error-viewed';
6
+ import AILearnMoreAnchor from '../../common/ai-summary/ai-learn-more-anchor';
7
+ export const getErrorMessage = error => {
8
+ const {
9
+ message,
10
+ url
11
+ } = getAISummaryErrorMessage(error);
12
+ return {
13
+ appearance: 'error',
14
+ title: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AIEventErrorViewed, {
15
+ reason: error
16
+ }), /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, message, {
17
+ values: {
18
+ a: chunks => /*#__PURE__*/React.createElement(AILearnMoreAnchor, {
19
+ href: url
20
+ }, chunks)
21
+ }
22
+ })))
23
+ };
24
+ };
@@ -11,7 +11,7 @@ const GoalGlyph = props => /*#__PURE__*/React.createElement("svg", {
11
11
  fillRule: "evenodd",
12
12
  clipRule: "evenodd",
13
13
  d: "M12.6667 8C12.6667 10.5773 10.5773 12.6667 8 12.6667C5.42267 12.6667 3.33333 10.5773 3.33333 8C3.33333 5.42267 5.42267 3.33333 8 3.33333C10.5773 3.33333 12.6667 5.42267 12.6667 8ZM14 8C14 11.3137 11.3137 14 8 14C4.68629 14 2 11.3137 2 8C2 4.68629 4.68629 2 8 2C11.3137 2 14 4.68629 14 8ZM9.33333 8C9.33333 8.73638 8.73638 9.33333 8 9.33333C7.26362 9.33333 6.66667 8.73638 6.66667 8C6.66667 7.26362 7.26362 6.66667 8 6.66667C8.73638 6.66667 9.33333 7.26362 9.33333 8ZM10.6667 8C10.6667 9.47276 9.47276 10.6667 8 10.6667C6.52724 10.6667 5.33333 9.47276 5.33333 8C5.33333 6.52724 6.52724 5.33333 8 5.33333C9.47276 5.33333 10.6667 6.52724 10.6667 8Z",
14
- fill: "#0C66E4"
14
+ fill: "var(--ds-icon, #44546F)"
15
15
  }));
16
16
  export const GoalIcon = props => /*#__PURE__*/React.createElement(Icon, _extends({
17
17
  glyph: GoalGlyph
@@ -11,7 +11,7 @@ const ProjectsGlyph = props => /*#__PURE__*/React.createElement("svg", {
11
11
  fillRule: "evenodd",
12
12
  clipRule: "evenodd",
13
13
  d: "M9.88573 4.00002C9.70892 4.00002 9.53935 4.07026 9.41433 4.19528L6.97282 6.63678L4.20525 6.94429C4.05479 6.96101 3.91451 7.02844 3.80746 7.13548L3.60959 7.33335L4.35367 8.07743C4.6791 8.40287 4.6791 8.93051 4.35367 9.25594L3.47152 10.1381C3.21117 10.3984 2.78906 10.3984 2.52871 10.1381C2.26836 9.87774 2.26836 9.45563 2.52871 9.19528L3.0573 8.66669L2.43108 8.04046C2.04055 7.64993 2.04055 7.01677 2.43108 6.62625L2.86465 6.19267C3.18578 5.87154 3.60664 5.66927 4.05801 5.61911L6.36073 5.36326L8.47152 3.25247C8.84659 2.8774 9.3553 2.66669 9.88573 2.66669H12.0001C12.7365 2.66669 13.3334 3.26364 13.3334 4.00002V6.1144C13.3334 6.64483 13.1227 7.15354 12.7477 7.52862L10.6369 9.6394L10.381 11.9421C10.3309 12.3935 10.1286 12.8143 9.80746 13.1355L9.37389 13.5691C8.98336 13.9596 8.3502 13.9596 7.95967 13.5691L7.33345 12.9428L6.80485 13.4714C6.5445 13.7318 6.12239 13.7318 5.86204 13.4714C5.60169 13.2111 5.60169 12.789 5.86204 12.5286L6.74419 11.6465C7.06963 11.321 7.59726 11.321 7.9227 11.6465L8.66678 12.3905L8.86466 12.1927C8.9717 12.0856 9.03912 11.9453 9.05584 11.7949L9.36335 9.02731L11.8049 6.58581C11.9299 6.46078 12.0001 6.29121 12.0001 6.1144V4.00002H9.88573ZM5.80486 10.1953C6.06521 10.4556 6.06521 10.8777 5.80486 11.1381L3.80486 13.1381C3.54451 13.3984 3.1224 13.3984 2.86205 13.1381C2.6017 12.8777 2.6017 12.4556 2.86205 12.1953L4.86205 10.1953C5.1224 9.93493 5.54451 9.93493 5.80486 10.1953ZM10.0001 6.66669C10.3683 6.66669 10.6668 6.36821 10.6668 6.00002C10.6668 5.63183 10.3683 5.33335 10.0001 5.33335C9.63193 5.33335 9.33346 5.63183 9.33346 6.00002C9.33346 6.36821 9.63193 6.66669 10.0001 6.66669Z",
14
- fill: "#0C66E4"
14
+ fill: "var(--ds-icon, #44546F)"
15
15
  }));
16
16
  export const ProjectsIcon = props => /*#__PURE__*/React.createElement(Icon, _extends({
17
17
  glyph: ProjectsGlyph
@@ -0,0 +1,61 @@
1
+ import ErrorIcon from '@atlaskit/icon/glyph/error';
2
+ import { Box, Inline, xcss } from '@atlaskit/primitives';
3
+ import React from 'react';
4
+ import MotionWrapper from '../../../common/motion-wrapper';
5
+ const containerStyles = xcss({
6
+ all: 'unset',
7
+ borderRadius: 'border.radius',
8
+ margin: 'space.100',
9
+ lineHeight: '20px',
10
+ padding: 'space.050',
11
+ paddingInline: 'space.100',
12
+ width: '100%',
13
+ ':empty': {
14
+ display: 'none'
15
+ }
16
+ });
17
+ const errorStyles = xcss({
18
+ backgroundColor: 'color.background.danger'
19
+ });
20
+ const titleStyles = xcss({
21
+ color: 'color.text.subtle',
22
+ fontSize: '12px',
23
+ fontStyle: 'normal',
24
+ fontWeight: '400',
25
+ lineHeight: '16px'
26
+ });
27
+ const getIcon = appearance => {
28
+ switch (appearance) {
29
+ case 'error':
30
+ return /*#__PURE__*/React.createElement(ErrorIcon, {
31
+ primaryColor: "var(--ds-icon-danger, #C9372C)",
32
+ label: "Error",
33
+ size: "small",
34
+ testId: "action-error-icon"
35
+ });
36
+ default:
37
+ return null;
38
+ }
39
+ };
40
+ export const ActionFooter = ({
41
+ message,
42
+ testId
43
+ }) => {
44
+ if (!message) {
45
+ return null;
46
+ }
47
+ return /*#__PURE__*/React.createElement(Box, {
48
+ testId: `${testId}-footer`,
49
+ xcss: [containerStyles, message.appearance === 'error' && errorStyles]
50
+ }, /*#__PURE__*/React.createElement(MotionWrapper, {
51
+ isFadeIn: true,
52
+ show: true,
53
+ showTransition: true
54
+ }, /*#__PURE__*/React.createElement(Inline, {
55
+ alignBlock: "start",
56
+ grow: "fill",
57
+ space: "space.025"
58
+ }, message.icon || getIcon(message.appearance), /*#__PURE__*/React.createElement(Box, {
59
+ xcss: titleStyles
60
+ }, message.title))));
61
+ };
@@ -1,11 +1,13 @@
1
1
  /** @jsx jsx */
2
2
  import { css, jsx } from '@emotion/react';
3
3
  import { xcss } from '@atlaskit/primitives';
4
- import { useMemo } from 'react';
4
+ import { useCallback, useMemo, useState } from 'react';
5
5
  import { SmartLinkSize } from '../../../../../constants';
6
6
  import { useFlexibleUiContext, useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
7
7
  import * as Actions from '../../actions';
8
8
  import { getPrimitivesPaddingSpaceBySize } from '../../utils';
9
+ import { ActionFooter } from './action-footer';
10
+ import { di } from 'react-magnetic-di';
9
11
  const ignoreContainerPaddingStyles = css({
10
12
  display: 'flex',
11
13
  flexDirection: 'column',
@@ -38,7 +40,15 @@ const ActionBlock = ({
38
40
  }) => {
39
41
  const context = useFlexibleUiContext();
40
42
  const ui = useFlexibleUiOptionContext();
43
+ const [message, setMessage] = useState();
41
44
  const padding = !(ui !== null && ui !== void 0 && ui.hidePadding) ? getPrimitivesPaddingSpaceBySize((ui === null || ui === void 0 ? void 0 : ui.size) || SmartLinkSize.Medium) : undefined;
45
+ const onClick = useCallback(name => {
46
+ setMessage(undefined);
47
+ onClickCallback === null || onClickCallback === void 0 ? void 0 : onClickCallback(name);
48
+ }, [onClickCallback]);
49
+ const onError = useCallback(error => {
50
+ setMessage(error);
51
+ }, []);
42
52
  const actions = useMemo(() => {
43
53
  if (!(context !== null && context !== void 0 && context.actions)) {
44
54
  return;
@@ -51,18 +61,23 @@ const ActionBlock = ({
51
61
  as: "stack-item",
52
62
  spaceInline: spaceInline,
53
63
  key: name,
54
- onClick: () => onClickCallback === null || onClickCallback === void 0 ? void 0 : onClickCallback(name),
64
+ onClick: () => onClick(name),
65
+ onError: onError,
55
66
  size: size,
56
67
  xcss: xcss({
57
68
  paddingInline: padding
58
69
  })
59
70
  }) : null;
60
71
  });
61
- }, [context === null || context === void 0 ? void 0 : context.actions, onClickCallback, padding, size, spaceInline]);
72
+ }, [context === null || context === void 0 ? void 0 : context.actions, onClick, onError, padding, size, spaceInline]);
62
73
  return actions ? jsx("div", {
63
74
  css: ignoreContainerPaddingStyles,
64
75
  ref: blockRef,
65
76
  "data-testid": testId
66
- }, actions) : null;
77
+ }, actions, jsx(ActionFooter, {
78
+ message: message,
79
+ paddingInline: padding,
80
+ testId: testId
81
+ })) : null;
67
82
  };
68
83
  export default ActionBlock;
@@ -11,7 +11,7 @@ import { messages } from '../../../../../../messages';
11
11
  import AIIcon from '../../../../../common/ai-icon';
12
12
  import AIIndicatorTooltip from './ai-indicator-tooltip';
13
13
  import AIIndicatorContainer from './ai-indicator-container';
14
- import AILearnMoreAnchor from './ai-learn-more-anchor';
14
+ import AILearnMoreAnchor from '../../../common/ai-summary/ai-learn-more-anchor';
15
15
  const tooltipMsgStyles = xcss({
16
16
  color: 'color.text',
17
17
  fontSize: '14px',
@@ -3,10 +3,9 @@ import React from 'react';
3
3
  import { FormattedMessage } from 'react-intl-next';
4
4
  import ErrorIcon from '@atlaskit/icon/glyph/error';
5
5
  import { Box, xcss } from '@atlaskit/primitives';
6
- import { messages } from '../../../../../../messages';
6
+ import { getAISummaryErrorMessage } from '../../../../../../utils/ai-summary';
7
+ import AILearnMoreAnchor from '../../../common/ai-summary/ai-learn-more-anchor';
7
8
  import AIIndicatorContainer from './ai-indicator-container';
8
- import AILearnMoreAnchor from './ai-learn-more-anchor';
9
- import { CONTENT_URL_ACCEPTABLE_USE_POLICY, CONTENT_URL_AI_TROUBLESHOOTING } from '../../../../../../constants';
10
9
  const contentStyles = xcss({
11
10
  color: 'color.text.subtle',
12
11
  fontSize: '11px',
@@ -24,24 +23,6 @@ const FormattedErrorMessage = ({
24
23
  }, chunks)
25
24
  }
26
25
  }));
27
- const getErrorMesssageProps = error => {
28
- switch (error) {
29
- case 'ACCEPTABLE_USE_VIOLATIONS':
30
- return {
31
- message: messages.ai_summary_error_acceptable_use_violation,
32
- url: CONTENT_URL_ACCEPTABLE_USE_POLICY
33
- };
34
- case 'HIPAA_CONTENT_DETECTED':
35
- return {
36
- message: messages.ai_summary_error_hipaa_content_detected
37
- };
38
- default:
39
- return {
40
- message: messages.ai_summary_error_generic,
41
- url: CONTENT_URL_AI_TROUBLESHOOTING
42
- };
43
- }
44
- };
45
26
  const AIStateError = ({
46
27
  appearance,
47
28
  testId,
@@ -50,7 +31,7 @@ const AIStateError = ({
50
31
  const {
51
32
  message,
52
33
  url
53
- } = getErrorMesssageProps(error);
34
+ } = getAISummaryErrorMessage(error);
54
35
  switch (appearance) {
55
36
  case 'icon-only':
56
37
  return null;
@@ -6,7 +6,7 @@ import { ActionName, SmartLinkDirection, SmartLinkSize, SmartLinkWidth } from '.
6
6
  import ActionGroup from '../../action-group';
7
7
  import Block from '../../block';
8
8
  import ElementGroup from '../../element-group';
9
- import AIMotionWrapper from '../ai-motion-wrapper';
9
+ import MotionWrapper from '../../../common/motion-wrapper';
10
10
  import AIStateIndicator from '../ai-state-indicator';
11
11
  import { renderElementItems } from '../../utils';
12
12
  import { messages } from '../../../../../../messages';
@@ -15,7 +15,7 @@ import AIIcon from '../../../../../common/ai-icon';
15
15
  import AISummary from '../../../../../common/ai-summary';
16
16
  import { useAnalyticsEvents } from '../../../../../../common/analytics/generated/use-analytics-events';
17
17
  import AIEventSummaryViewed from '../ai-event-summary-viewed';
18
- import AIEventErrorViewed from '../ai-event-error-viewed';
18
+ import AIEventErrorViewed from '../../../common/ai-summary/ai-event-error-viewed';
19
19
  import { di } from 'react-magnetic-di';
20
20
  import { css } from '@emotion/react';
21
21
  import FeatureDiscovery from '../feature-discovery';
@@ -27,7 +27,7 @@ export const AISummaryBlockErrorIndicator = ({
27
27
  error,
28
28
  showTransition,
29
29
  testId
30
- }) => /*#__PURE__*/React.createElement(AIMotionWrapper, {
30
+ }) => /*#__PURE__*/React.createElement(MotionWrapper, {
31
31
  isFadeIn: true,
32
32
  show: showErrorIndicator,
33
33
  showTransition: showTransition
@@ -142,7 +142,7 @@ const AISummaryBlockResolvedView = props => {
142
142
  }, props.overrideCss)
143
143
  }), status === 'done' && /*#__PURE__*/React.createElement(AIEventSummaryViewed, {
144
144
  fromCache: isSummarisedOnMountRef.current
145
- }), /*#__PURE__*/React.createElement(AIMotionWrapper, {
145
+ }), /*#__PURE__*/React.createElement(MotionWrapper, {
146
146
  minHeight: aiSummaryMinHeight,
147
147
  show: showAISummary,
148
148
  showTransition: !isSummarisedOnMountRef.current
@@ -1,5 +1,5 @@
1
1
  import { useEffect } from 'react';
2
- import { useAnalyticsEvents } from '../../../../../../common/analytics/generated/use-analytics-events';
2
+ import { useAnalyticsEvents } from '../../../../../common/analytics/generated/use-analytics-events';
3
3
  const AIEventErrorViewed = ({
4
4
  reason
5
5
  }) => {
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import React from 'react';
3
- import { CONTENT_URL_AI } from '../../../../../../constants';
3
+ import { CONTENT_URL_AI } from '../../../../../constants';
4
4
  const AILearnMoreAnchor = ({
5
5
  children,
6
6
  ...props
@@ -1,6 +1,6 @@
1
1
  import { Box } from '@atlaskit/primitives';
2
2
  import React, { useEffect, useRef, useState } from 'react';
3
- export const AIMotionWrapper = ({
3
+ export const MotionWrapper = ({
4
4
  children,
5
5
  isFadeIn = false,
6
6
  minHeight = 0,
@@ -36,4 +36,4 @@ export const AIMotionWrapper = ({
36
36
  ref: ref
37
37
  }, children) : null;
38
38
  };
39
- export default AIMotionWrapper;
39
+ export default MotionWrapper;
@@ -20,7 +20,7 @@ import { fireLinkClickedEvent } from '../../../utils/analytics/click';
20
20
  import { useSmartCardState } from '../../../state/store';
21
21
  import HoverCardForbiddenView from './views/forbidden';
22
22
  import ContentContainer from './ContentContainer';
23
- import { getIsAISummaryEnabled } from '../../../utils/get-is-ai-summary-enabled';
23
+ import { getIsAISummaryEnabled } from '../../../utils/ai-summary';
24
24
  export const hoverCardClassName = 'smart-links-hover-preview';
25
25
  export const getCopyAction = url => ({
26
26
  name: ActionName.CustomAction,
@@ -181,13 +181,7 @@ const HoverCardResolvedView = ({
181
181
  }), isActionBlockEnabled && /*#__PURE__*/React.createElement(ActionBlock, {
182
182
  onClick: onActionClick,
183
183
  spaceInline: "space.150"
184
- }), isActionBlockEnabled && /*#__PURE__*/React.createElement(MetadataBlock, {
185
- secondary: [{
186
- name: ElementName.Provider,
187
- testId: 'smart-element-provider'
188
- }],
189
- testId: "smart-block-action-footer"
190
- }), !isAISummaryEnabled && !isActionBlockEnabled && /*#__PURE__*/React.createElement(FooterBlock, {
184
+ }), isActionBlockEnabled && /*#__PURE__*/React.createElement(FooterBlock, null), !isAISummaryEnabled && !isActionBlockEnabled && /*#__PURE__*/React.createElement(FooterBlock, {
191
185
  actions: footerActions,
192
186
  size: SmartLinkSize.Large,
193
187
  overrideCss: footerBlockCss
@@ -41,7 +41,7 @@ const getSimulatedBetterMetadata = (extensionKey, data) => {
41
41
  };
42
42
  case 'trello-object-provider':
43
43
  return {
44
- primary: [ElementName.AuthorGroup, ElementName.State, ElementName.DueOn],
44
+ primary: [ElementName.CollaboratorGroup, ElementName.State, ElementName.DueOn],
45
45
  secondary: [ElementName.ReactCount, ElementName.CommentCount, ElementName.AttachmentCount, ElementName.ChecklistProgress],
46
46
  subtitle: [ElementName.Location]
47
47
  };
@@ -7,7 +7,7 @@ import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-m
7
7
  import LinkWarningModal from './LinkWarningModal';
8
8
  const PACKAGE_DATA = {
9
9
  packageName: "@atlaskit/smart-card",
10
- packageVersion: "26.59.1",
10
+ packageVersion: "26.61.0",
11
11
  componentName: 'linkUrl'
12
12
  };
13
13
  const Link = withLinkClickedEvent('a');