@atlaskit/smart-card 45.6.8 → 45.6.10
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.
- package/CHANGELOG.md +16 -0
- package/dist/cjs/messages.js +45 -40
- package/dist/cjs/utils/analytics/analytics.js +1 -1
- package/dist/cjs/view/EmbedCard/components/carousel/CarouselSlide.compiled.css +52 -0
- package/dist/cjs/view/EmbedCard/components/carousel/CarouselSlide.js +124 -0
- package/dist/cjs/view/EmbedCard/components/carousel/index.compiled.css +12 -0
- package/dist/cjs/view/EmbedCard/components/carousel/index.js +122 -0
- package/dist/cjs/view/EmbedCard/components/carousel/types.js +5 -0
- package/dist/cjs/view/FlexibleCard/components/actions/rovo-chat-action/index.js +1 -2
- package/dist/cjs/view/FlexibleCard/components/blocks/action-block/index.js +4 -8
- package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/index.js +5 -16
- package/dist/cjs/view/HoverCard/components/HoverCardContent.js +7 -30
- package/dist/cjs/view/HoverCard/components/views/resolved/index.js +2 -11
- package/dist/cjs/view/LinkUrl/index.js +1 -1
- package/dist/cjs/view/common/rovo-chat-utils/index.js +4 -68
- package/dist/es2019/messages.js +45 -40
- package/dist/es2019/utils/analytics/analytics.js +1 -1
- package/dist/es2019/view/EmbedCard/components/carousel/CarouselSlide.compiled.css +52 -0
- package/dist/es2019/view/EmbedCard/components/carousel/CarouselSlide.js +114 -0
- package/dist/es2019/view/EmbedCard/components/carousel/index.compiled.css +12 -0
- package/dist/es2019/view/EmbedCard/components/carousel/index.js +101 -0
- package/dist/es2019/view/EmbedCard/components/carousel/types.js +1 -0
- package/dist/es2019/view/FlexibleCard/components/actions/rovo-chat-action/index.js +2 -3
- package/dist/es2019/view/FlexibleCard/components/blocks/action-block/index.js +3 -7
- package/dist/es2019/view/FlexibleCard/components/blocks/ai-summary-block/index.js +3 -12
- package/dist/es2019/view/HoverCard/components/HoverCardContent.js +7 -30
- package/dist/es2019/view/HoverCard/components/views/resolved/index.js +3 -12
- package/dist/es2019/view/LinkUrl/index.js +1 -1
- package/dist/es2019/view/common/rovo-chat-utils/index.js +4 -68
- package/dist/esm/messages.js +45 -40
- package/dist/esm/utils/analytics/analytics.js +1 -1
- package/dist/esm/view/EmbedCard/components/carousel/CarouselSlide.compiled.css +52 -0
- package/dist/esm/view/EmbedCard/components/carousel/CarouselSlide.js +117 -0
- package/dist/esm/view/EmbedCard/components/carousel/index.compiled.css +12 -0
- package/dist/esm/view/EmbedCard/components/carousel/index.js +113 -0
- package/dist/esm/view/EmbedCard/components/carousel/types.js +1 -0
- package/dist/esm/view/FlexibleCard/components/actions/rovo-chat-action/index.js +2 -3
- package/dist/esm/view/FlexibleCard/components/blocks/action-block/index.js +4 -8
- package/dist/esm/view/FlexibleCard/components/blocks/ai-summary-block/index.js +5 -14
- package/dist/esm/view/HoverCard/components/HoverCardContent.js +7 -30
- package/dist/esm/view/HoverCard/components/views/resolved/index.js +3 -12
- package/dist/esm/view/LinkUrl/index.js +1 -1
- package/dist/esm/view/common/rovo-chat-utils/index.js +4 -68
- package/dist/types/messages.d.ts +2 -2
- package/dist/types/view/EmbedCard/components/carousel/CarouselSlide.d.ts +39 -0
- package/dist/types/view/EmbedCard/components/carousel/index.d.ts +22 -0
- package/dist/types/view/EmbedCard/components/carousel/types.d.ts +26 -0
- package/dist/types/view/FlexibleCard/components/actions/rovo-chat-action/index.d.ts +1 -1
- package/dist/types/view/FlexibleCard/components/blocks/action-block/index.d.ts +1 -1
- package/dist/types/view/FlexibleCard/components/blocks/action-block/types.d.ts +0 -4
- package/dist/types/view/FlexibleCard/components/blocks/ai-summary-block/index.d.ts +1 -1
- package/dist/types/view/HoverCard/components/views/resolved/index.d.ts +1 -1
- package/dist/types/view/HoverCard/components/views/resolved/types.d.ts +0 -1
- package/dist/types/view/HoverCard/types.d.ts +0 -1
- package/dist/types/view/common/rovo-chat-utils/index.d.ts +0 -3
- package/package.json +2 -2
- package/dist/cjs/__tests__/vr-tests/__snapshots__/hover-card/hover-card-with-google-rovo-chat-action--default.png +0 -3
- package/dist/es2019/__tests__/vr-tests/__snapshots__/hover-card/hover-card-with-google-rovo-chat-action--default.png +0 -3
- package/dist/esm/__tests__/vr-tests/__snapshots__/hover-card/hover-card-with-google-rovo-chat-action--default.png +0 -3
|
@@ -5,10 +5,9 @@ import { ActionName } from '../../../../../constants';
|
|
|
5
5
|
import { useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
|
|
6
6
|
import useInvokeClientAction from '../../../../../state/hooks/use-invoke-client-action';
|
|
7
7
|
import useRovoChat from '../../../../../state/hooks/use-rovo-chat';
|
|
8
|
-
import { getPromptAction
|
|
8
|
+
import { getPromptAction } from '../../../../common/rovo-chat-utils';
|
|
9
9
|
import Action from '../action';
|
|
10
|
-
const
|
|
11
|
-
const DEFAULT_PROMPTS = GOOGLE_PROMPTS;
|
|
10
|
+
const DEFAULT_PROMPTS = [];
|
|
12
11
|
const RovoChatAction = ({
|
|
13
12
|
onClick: onClickCallback,
|
|
14
13
|
prompts,
|
|
@@ -4,7 +4,6 @@ import * as React from 'react';
|
|
|
4
4
|
import { ax, ix } from "@compiled/react/runtime";
|
|
5
5
|
import { useCallback, useMemo, useState } from 'react';
|
|
6
6
|
import { di } from 'react-magnetic-di';
|
|
7
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
7
|
import { ActionName, SmartLinkSize } from '../../../../../constants';
|
|
9
8
|
import { useFlexibleUiContext, useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
|
|
10
9
|
import * as Actions from '../../actions';
|
|
@@ -46,13 +45,10 @@ const ActionBlock = ({
|
|
|
46
45
|
size,
|
|
47
46
|
spaceInline,
|
|
48
47
|
className,
|
|
49
|
-
testId = 'smart-block-action'
|
|
50
|
-
isAny3pRovoActionsExperimentOn
|
|
48
|
+
testId = 'smart-block-action'
|
|
51
49
|
}) => {
|
|
52
|
-
var _context$actions;
|
|
53
50
|
const context = useFlexibleUiContext();
|
|
54
51
|
const ui = useFlexibleUiOptionContext();
|
|
55
|
-
const isRovoChatActionAvailable = isAny3pRovoActionsExperimentOn && fg('platform_sl_3p_auth_rovo_action_kill_switch') ? (context === null || context === void 0 ? void 0 : (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[ActionName.RovoChatAction]) !== undefined : undefined;
|
|
56
52
|
const [message, setMessage] = useState();
|
|
57
53
|
const [isLoading, setIsLoading] = useState(false);
|
|
58
54
|
const onLoadingChange = useCallback(isLoading => {
|
|
@@ -70,7 +66,7 @@ const ActionBlock = ({
|
|
|
70
66
|
if (!(context !== null && context !== void 0 && context.actions)) {
|
|
71
67
|
return;
|
|
72
68
|
}
|
|
73
|
-
const arr =
|
|
69
|
+
const arr = Object.keys(context.actions).filter(name => name !== ActionName.RovoChatAction);
|
|
74
70
|
arr.sort(sort);
|
|
75
71
|
const renderAction = name => {
|
|
76
72
|
const Action = name in Actions ? Actions[name] : undefined;
|
|
@@ -94,7 +90,7 @@ const ActionBlock = ({
|
|
|
94
90
|
});
|
|
95
91
|
};
|
|
96
92
|
return arr.map(name => renderAction(name));
|
|
97
|
-
}, [context === null || context === void 0 ? void 0 : context.actions,
|
|
93
|
+
}, [context === null || context === void 0 ? void 0 : context.actions, spaceInline, onError, onLoadingChange, size, ui === null || ui === void 0 ? void 0 : ui.size, padding, isLoading, onClick]);
|
|
98
94
|
if (!actions) {
|
|
99
95
|
return null;
|
|
100
96
|
}
|
|
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { InternalActionName, SmartLinkStatus } from '../../../../../constants';
|
|
4
4
|
import { useFlexibleCardContext, useFlexibleUiContext } from '../../../../../state/flexible-ui-context';
|
|
5
|
-
import AISummaryBlockResolvedView
|
|
5
|
+
import AISummaryBlockResolvedView from './resolved';
|
|
6
6
|
/**
|
|
7
7
|
* Represents an AISummaryBlock, designed to summarising link resource
|
|
8
8
|
* content using AI.
|
|
@@ -11,11 +11,10 @@ import AISummaryBlockResolvedView, { RovoSummaryBlockResolvedView } from './reso
|
|
|
11
11
|
* @see Block
|
|
12
12
|
*/
|
|
13
13
|
const AISummaryBlock = ({
|
|
14
|
-
isAny3pRovoActionsExperimentOn,
|
|
15
14
|
testId = 'smart-ai-summary-block',
|
|
16
15
|
...props
|
|
17
16
|
}) => {
|
|
18
|
-
var _context$actions, _props$
|
|
17
|
+
var _context$actions, _props$size, _cardContext$ui;
|
|
19
18
|
const cardContext = useFlexibleCardContext();
|
|
20
19
|
const context = useFlexibleUiContext();
|
|
21
20
|
const actionData = context === null || context === void 0 ? void 0 : (_context$actions = context.actions) === null || _context$actions === void 0 ? void 0 : _context$actions[InternalActionName.AISummaryAction];
|
|
@@ -25,16 +24,8 @@ const AISummaryBlock = ({
|
|
|
25
24
|
if (!(actionData !== null && actionData !== void 0 && actionData.url)) {
|
|
26
25
|
return null;
|
|
27
26
|
}
|
|
28
|
-
if (isAny3pRovoActionsExperimentOn) {
|
|
29
|
-
var _props$size, _cardContext$ui;
|
|
30
|
-
return /*#__PURE__*/React.createElement(RovoSummaryBlockResolvedView, _extends({}, props, {
|
|
31
|
-
size: (_props$size = props.size) !== null && _props$size !== void 0 ? _props$size : cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$ui = cardContext.ui) === null || _cardContext$ui === void 0 ? void 0 : _cardContext$ui.size,
|
|
32
|
-
testId: testId,
|
|
33
|
-
url: actionData.url
|
|
34
|
-
}));
|
|
35
|
-
}
|
|
36
27
|
return /*#__PURE__*/React.createElement(AISummaryBlockResolvedView, _extends({}, props, {
|
|
37
|
-
size: (_props$
|
|
28
|
+
size: (_props$size = props.size) !== null && _props$size !== void 0 ? _props$size : cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$ui = cardContext.ui) === null || _cardContext$ui === void 0 ? void 0 : _cardContext$ui.size,
|
|
38
29
|
testId: testId,
|
|
39
30
|
url: actionData.url
|
|
40
31
|
}));
|
|
@@ -5,10 +5,8 @@ import { useSmartLinkContext } from '@atlaskit/link-provider';
|
|
|
5
5
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
6
6
|
import { componentWithCondition, functionUnionWithCondition } from '@atlaskit/platform-feature-flags-react';
|
|
7
7
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
8
|
-
import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
|
|
9
8
|
import { useAnalyticsEvents } from '../../../common/analytics/generated/use-analytics-events';
|
|
10
9
|
import { CardDisplay, SmartLinkPosition, SmartLinkSize } from '../../../constants';
|
|
11
|
-
import extractRovoChatAction from '../../../extractors/flexible/actions/extract-rovo-chat-action';
|
|
12
10
|
import { getClickUrl, getDefinitionId, getExtensionKey, getServices } from '../../../state/helpers';
|
|
13
11
|
import useRovoConfig from '../../../state/hooks/use-rovo-config';
|
|
14
12
|
import { useSmartLinkCrossProductUrlWrapperGated } from '../../../state/hooks/use-smart-link-cross-product-url-wrapper';
|
|
@@ -68,8 +66,7 @@ const HoverCardContent = ({
|
|
|
68
66
|
onMouseLeave,
|
|
69
67
|
onDismiss,
|
|
70
68
|
actionOptions,
|
|
71
|
-
hoverPreviewOptions
|
|
72
|
-
showRovoResolvedView
|
|
69
|
+
hoverPreviewOptions
|
|
73
70
|
}) => {
|
|
74
71
|
var _linkState$status, _cardState$details;
|
|
75
72
|
const {
|
|
@@ -262,8 +259,7 @@ const HoverCardContent = ({
|
|
|
262
259
|
}
|
|
263
260
|
if (isResolved) {
|
|
264
261
|
return /*#__PURE__*/React.createElement(HoverCardResolvedView, _extends({}, fg('platform_sl_3p_auth_rovo_action_kill_switch') ? {
|
|
265
|
-
actionOptions
|
|
266
|
-
showRovoResolvedView
|
|
262
|
+
actionOptions
|
|
267
263
|
} : undefined, {
|
|
268
264
|
cardState: cardState,
|
|
269
265
|
extensionKey: extensionKey,
|
|
@@ -314,8 +310,7 @@ const HoverCardContent = ({
|
|
|
314
310
|
}
|
|
315
311
|
if (cardState.status === 'resolved') {
|
|
316
312
|
return /*#__PURE__*/React.createElement(HoverCardResolvedView, _extends({}, fg('platform_sl_3p_auth_rovo_action_kill_switch') ? {
|
|
317
|
-
actionOptions
|
|
318
|
-
showRovoResolvedView
|
|
313
|
+
actionOptions
|
|
319
314
|
} : undefined, {
|
|
320
315
|
cardState: cardState,
|
|
321
316
|
extensionKey: extensionKey,
|
|
@@ -338,23 +333,10 @@ const HoverCardContent = ({
|
|
|
338
333
|
}
|
|
339
334
|
};
|
|
340
335
|
const HoverCardContentWithViewVariant = props => {
|
|
341
|
-
const {
|
|
342
|
-
cardState,
|
|
343
|
-
actionOptions
|
|
344
|
-
} = props;
|
|
345
|
-
const rovoConfig = useRovoConfig();
|
|
346
|
-
const isResolved = useIsResolvedView(props);
|
|
347
336
|
const showPreauthBetterHovercard = useIsShowPreauthBetterHovercard(props);
|
|
348
|
-
const showRovoResolvedView = useMemo(() => isResolved && cardState.details && extractRovoChatAction({
|
|
349
|
-
response: cardState.details,
|
|
350
|
-
rovoConfig,
|
|
351
|
-
actionOptions
|
|
352
|
-
}) !== undefined, [actionOptions, cardState.details, rovoConfig, isResolved]);
|
|
353
337
|
const data = useMemo(() => {
|
|
354
338
|
let viewVariant = 'default';
|
|
355
|
-
if (
|
|
356
|
-
viewVariant = 'rovo-resolved-view';
|
|
357
|
-
} else if (showPreauthBetterHovercard) {
|
|
339
|
+
if (showPreauthBetterHovercard) {
|
|
358
340
|
viewVariant = 'rovo-unauthorised-view';
|
|
359
341
|
}
|
|
360
342
|
return {
|
|
@@ -362,17 +344,12 @@ const HoverCardContentWithViewVariant = props => {
|
|
|
362
344
|
viewVariant
|
|
363
345
|
}
|
|
364
346
|
};
|
|
365
|
-
}, [
|
|
347
|
+
}, [showPreauthBetterHovercard]);
|
|
366
348
|
return /*#__PURE__*/React.createElement(AnalyticsContext, {
|
|
367
349
|
data: data
|
|
368
|
-
}, /*#__PURE__*/React.createElement(HoverCardContent,
|
|
369
|
-
showRovoResolvedView: showRovoResolvedView
|
|
370
|
-
})));
|
|
350
|
+
}, /*#__PURE__*/React.createElement(HoverCardContent, props));
|
|
371
351
|
};
|
|
372
352
|
const _default_1 = componentWithCondition(() => {
|
|
373
|
-
|
|
374
|
-
const flagA = fg('platform_sl_3p_preauth_better_hovercard_killswitch');
|
|
375
|
-
const flagB = fg('platform_sl_3p_auth_rovo_action_kill_switch');
|
|
376
|
-
return flagA || flagB;
|
|
353
|
+
return fg('platform_sl_3p_preauth_better_hovercard_killswitch');
|
|
377
354
|
}, HoverCardContentWithViewVariant, HoverCardContent);
|
|
378
355
|
export default _default_1;
|
|
@@ -4,13 +4,12 @@ import "./index.compiled.css";
|
|
|
4
4
|
import { ax, ix } from "@compiled/react/runtime";
|
|
5
5
|
import React, { useCallback, useEffect, useMemo, useRef } from 'react';
|
|
6
6
|
import { di } from 'react-magnetic-di';
|
|
7
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
8
7
|
import { useAnalyticsEvents } from '../../../../../common/analytics/generated/use-analytics-events';
|
|
9
8
|
import { CardDisplay, SmartLinkPosition, SmartLinkSize } from '../../../../../constants';
|
|
10
9
|
import { succeedUfoExperience } from '../../../../../state/analytics';
|
|
11
10
|
import useAISummaryAction from '../../../../../state/hooks/use-ai-summary-action';
|
|
12
11
|
import FlexibleCard from '../../../../FlexibleCard';
|
|
13
|
-
import { ActionBlock, AIFooterBlock, AISummaryBlock,
|
|
12
|
+
import { ActionBlock, AIFooterBlock, AISummaryBlock, MetadataBlock, SnippetBlock, TitleBlock } from '../../../../FlexibleCard/components/blocks';
|
|
14
13
|
import { getMetadata } from '../../../utils';
|
|
15
14
|
import ImagePreview from '../../ImagePreview';
|
|
16
15
|
const hiddenSnippetStyles = null;
|
|
@@ -23,7 +22,6 @@ const HoverCardResolvedView = ({
|
|
|
23
22
|
flexibleCardProps,
|
|
24
23
|
isAISummaryEnabled,
|
|
25
24
|
onActionClick,
|
|
26
|
-
showRovoResolvedView,
|
|
27
25
|
titleBlockProps,
|
|
28
26
|
id
|
|
29
27
|
}) => {
|
|
@@ -31,9 +29,6 @@ const HoverCardResolvedView = ({
|
|
|
31
29
|
const {
|
|
32
30
|
fireEvent
|
|
33
31
|
} = useAnalyticsEvents();
|
|
34
|
-
// We want to fire exposure event only for those cases when user otherwise can see the experiment which would be controlled
|
|
35
|
-
// by all the other condition defined above as a result of what was defined in actionOptions as well as in CardContext.
|
|
36
|
-
const is3PAuthRovoActionsExperimentOn = showRovoResolvedView && expValEquals('platform_sl_3p_auth_rovo_action', 'isEnabled', true);
|
|
37
32
|
useEffect(() => {
|
|
38
33
|
// Since this hover view is only rendered on resolved status,
|
|
39
34
|
// there is no need to check for statuses.
|
|
@@ -81,8 +76,7 @@ const HoverCardResolvedView = ({
|
|
|
81
76
|
size: SmartLinkSize.Medium
|
|
82
77
|
}), isAISummaryEnabled ? /*#__PURE__*/React.createElement(AISummaryBlock, {
|
|
83
78
|
aiSummaryMinHeight: aiSummaryMinHeight,
|
|
84
|
-
placeholder: snippet
|
|
85
|
-
isAny3pRovoActionsExperimentOn: is3PAuthRovoActionsExperimentOn
|
|
79
|
+
placeholder: snippet
|
|
86
80
|
}) : snippet, /*#__PURE__*/React.createElement(SnippetBlock, {
|
|
87
81
|
testId: "hidden-snippet",
|
|
88
82
|
onRender: onSnippetRender,
|
|
@@ -92,10 +86,7 @@ const HoverCardResolvedView = ({
|
|
|
92
86
|
}), /*#__PURE__*/React.createElement(ActionBlock, {
|
|
93
87
|
onClick: onActionClick,
|
|
94
88
|
spaceInline: "space.100",
|
|
95
|
-
isAny3pRovoActionsExperimentOn: is3PAuthRovoActionsExperimentOn,
|
|
96
89
|
className: ax(["_n3td1b66"])
|
|
97
|
-
}),
|
|
98
|
-
onActionClick: onActionClick
|
|
99
|
-
}) : /*#__PURE__*/React.createElement(AIFooterBlock, null));
|
|
90
|
+
}), /*#__PURE__*/React.createElement(AIFooterBlock, null));
|
|
100
91
|
};
|
|
101
92
|
export default HoverCardResolvedView;
|
|
@@ -9,7 +9,7 @@ import LinkWarningModal from './LinkWarningModal';
|
|
|
9
9
|
import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
|
|
10
10
|
const PACKAGE_DATA = {
|
|
11
11
|
packageName: "@atlaskit/smart-card",
|
|
12
|
-
packageVersion: "45.6.
|
|
12
|
+
packageVersion: "45.6.9",
|
|
13
13
|
componentName: 'linkUrl'
|
|
14
14
|
};
|
|
15
15
|
const LinkUrl = ({
|
|
@@ -7,13 +7,9 @@ import { RovoIcon } from '@atlaskit/logo';
|
|
|
7
7
|
import { CardDisplay } from '../../../constants';
|
|
8
8
|
import { messages } from '../../../messages';
|
|
9
9
|
import AiChapterIcon from '../../FlexibleCard/assets/ai-chapter-icon';
|
|
10
|
-
import AIEditIcon from '../../FlexibleCard/assets/ai-edit-icon';
|
|
11
10
|
import AISearchIcon from '../../FlexibleCard/assets/ai-search-icon';
|
|
12
11
|
import htmlToAdf from '../../FlexibleCard/components/actions/rovo-chat-action/html-to-adf';
|
|
13
12
|
export let RovoChatPromptKey = /*#__PURE__*/function (RovoChatPromptKey) {
|
|
14
|
-
RovoChatPromptKey["RECOMMEND_OTHER_SOURCES"] = "recommend-other-sources";
|
|
15
|
-
RovoChatPromptKey["SHOW_OTHER_MENTIONS"] = "show-other-mentions";
|
|
16
|
-
RovoChatPromptKey["SUGGEST_IMPROVEMENT"] = "suggest-improvement";
|
|
17
13
|
RovoChatPromptKey["SUMMARIZE_LINK"] = "summarize-link";
|
|
18
14
|
RovoChatPromptKey["KEY_HIGHLIGHTS"] = "key-highlights";
|
|
19
15
|
RovoChatPromptKey["ASK_ROVO_ANYTHING"] = "ask-rovo-anything";
|
|
@@ -35,16 +31,14 @@ const getContext = (intl, product) => {
|
|
|
35
31
|
switch (product) {
|
|
36
32
|
case 'CONFLUENCE':
|
|
37
33
|
return {
|
|
38
|
-
contextLong: intl.formatMessage(messages.rovo_prompt_context_confluence_page)
|
|
39
|
-
contextShort: intl.formatMessage(messages.rovo_prompt_context_confluence_page_short)
|
|
34
|
+
contextLong: intl.formatMessage(messages.rovo_prompt_context_confluence_page)
|
|
40
35
|
};
|
|
41
36
|
case 'JSW':
|
|
42
37
|
case 'JWM':
|
|
43
38
|
case 'JSM':
|
|
44
39
|
case 'JPD':
|
|
45
40
|
return {
|
|
46
|
-
contextLong: intl.formatMessage(messages.rovo_prompt_context_jira_work_item)
|
|
47
|
-
contextShort: intl.formatMessage(messages.rovo_prompt_context_jira_work_item_short)
|
|
41
|
+
contextLong: intl.formatMessage(messages.rovo_prompt_context_jira_work_item)
|
|
48
42
|
};
|
|
49
43
|
}
|
|
50
44
|
};
|
|
@@ -59,69 +53,11 @@ export const getPromptAction = ({
|
|
|
59
53
|
}) => {
|
|
60
54
|
var _getContext;
|
|
61
55
|
const {
|
|
62
|
-
contextLong
|
|
63
|
-
contextShort
|
|
56
|
+
contextLong
|
|
64
57
|
} = (_getContext = getContext(intl, product)) !== null && _getContext !== void 0 ? _getContext : {
|
|
65
|
-
contextLong: intl.formatMessage(messages.rovo_prompt_context_generic)
|
|
66
|
-
contextShort: intl.formatMessage(messages.rovo_prompt_context_generic)
|
|
58
|
+
contextLong: intl.formatMessage(messages.rovo_prompt_context_generic)
|
|
67
59
|
};
|
|
68
60
|
switch (promptKey) {
|
|
69
|
-
case RovoChatPromptKey.RECOMMEND_OTHER_SOURCES:
|
|
70
|
-
const label_recommend = intl.formatMessage(messages.rovo_prompt_button_recommend_other_sources);
|
|
71
|
-
const html_recommend = intl.formatMessage(messages.rovo_prompt_message_recommend_other_sources, {
|
|
72
|
-
context: contextLong,
|
|
73
|
-
url
|
|
74
|
-
}, {
|
|
75
|
-
ignoreTag: true
|
|
76
|
-
});
|
|
77
|
-
return {
|
|
78
|
-
icon: /*#__PURE__*/React.createElement(AIEditIcon, null),
|
|
79
|
-
content: label_recommend,
|
|
80
|
-
tooltipMessage: label_recommend,
|
|
81
|
-
data: {
|
|
82
|
-
name: label_recommend,
|
|
83
|
-
dialogues: [],
|
|
84
|
-
prompt: htmlToAdf(html_recommend)
|
|
85
|
-
}
|
|
86
|
-
};
|
|
87
|
-
case RovoChatPromptKey.SHOW_OTHER_MENTIONS:
|
|
88
|
-
const label_other_mentions = intl.formatMessage(messages.rovo_prompt_button_show_other_mentions);
|
|
89
|
-
const html_other_mentions = intl.formatMessage(messages.rovo_prompt_message_show_other_mentions, {
|
|
90
|
-
context: contextLong,
|
|
91
|
-
url
|
|
92
|
-
}, {
|
|
93
|
-
ignoreTag: true
|
|
94
|
-
});
|
|
95
|
-
return {
|
|
96
|
-
icon: /*#__PURE__*/React.createElement(AiChapterIcon, null),
|
|
97
|
-
content: label_other_mentions,
|
|
98
|
-
tooltipMessage: label_other_mentions,
|
|
99
|
-
data: {
|
|
100
|
-
name: label_other_mentions,
|
|
101
|
-
dialogues: [],
|
|
102
|
-
prompt: htmlToAdf(html_other_mentions)
|
|
103
|
-
}
|
|
104
|
-
};
|
|
105
|
-
case RovoChatPromptKey.SUGGEST_IMPROVEMENT:
|
|
106
|
-
const label_improvement = intl.formatMessage(messages.rovo_prompt_button_suggest_improvement, {
|
|
107
|
-
context: contextShort
|
|
108
|
-
});
|
|
109
|
-
const html_improvement = intl.formatMessage(messages.rovo_prompt_message_suggest_improvement, {
|
|
110
|
-
context: contextLong,
|
|
111
|
-
url
|
|
112
|
-
}, {
|
|
113
|
-
ignoreTag: true
|
|
114
|
-
});
|
|
115
|
-
return {
|
|
116
|
-
icon: /*#__PURE__*/React.createElement(AISearchIcon, null),
|
|
117
|
-
content: label_improvement,
|
|
118
|
-
tooltipMessage: label_improvement,
|
|
119
|
-
data: {
|
|
120
|
-
name: label_improvement,
|
|
121
|
-
dialogues: [],
|
|
122
|
-
prompt: htmlToAdf(html_improvement)
|
|
123
|
-
}
|
|
124
|
-
};
|
|
125
61
|
case RovoChatPromptKey.SUMMARIZE_LINK:
|
|
126
62
|
const label_summarize = intl.formatMessage(messages.ai_summarize);
|
|
127
63
|
const html_summarize = intl.formatMessage(messages.rovo_prompt_message_summarize, {
|
package/dist/esm/messages.js
CHANGED
|
@@ -160,6 +160,51 @@ export var messages = defineMessages({
|
|
|
160
160
|
defaultMessage: 'To show a preview of this link, connect your {context} account.',
|
|
161
161
|
description: 'Shown when a user does not have access to a link, but can connect their external account to view the link on card view. Displayed in byline.'
|
|
162
162
|
},
|
|
163
|
+
connect_link_account_embed_teaser_dot_label: {
|
|
164
|
+
id: 'fabric.linking.connect_link_account_embed_teaser_dot_label.non-final',
|
|
165
|
+
defaultMessage: 'Go to slide {index} of {total}',
|
|
166
|
+
description: 'Accessible label for a dot indicator button in the teaser carousel, describing which slide it navigates to'
|
|
167
|
+
},
|
|
168
|
+
connect_link_account_embed_teaser_dot_row_label: {
|
|
169
|
+
id: 'fabric.linking.connect_link_account_embed_teaser_dot_row_label.non-final',
|
|
170
|
+
defaultMessage: 'Slides',
|
|
171
|
+
description: 'Accessible label for the group of dot indicator buttons in the teaser carousel'
|
|
172
|
+
},
|
|
173
|
+
connect_link_account_embed_teaser_button_next: {
|
|
174
|
+
id: 'fabric.linking.connect_link_account_embed_teaser_button_next.non-final',
|
|
175
|
+
defaultMessage: 'Next',
|
|
176
|
+
description: 'A button to view next teaser on benefit of connecting account on Smart Link embed'
|
|
177
|
+
},
|
|
178
|
+
connect_link_account_embed_teaser_slide_1_description: {
|
|
179
|
+
id: 'fabric.linking.connect_link_account_embed_teaser_slide_1_description.non-final',
|
|
180
|
+
defaultMessage: 'Connect your account to preview {context} files and documents directly inside Atlassian. No more context switching.',
|
|
181
|
+
description: 'A description on a teaser slide 1 on benefit of connecting account on Smart Link embed'
|
|
182
|
+
},
|
|
183
|
+
connect_link_account_embed_teaser_slide_1_title: {
|
|
184
|
+
id: 'fabric.linking.connect_link_account_embed_teaser_slide_1_title.non-final',
|
|
185
|
+
defaultMessage: 'See your {context} work without leaving Atlassian',
|
|
186
|
+
description: 'A title on a teaser slide 1 on benefit of connecting account on Smart Link embed'
|
|
187
|
+
},
|
|
188
|
+
connect_link_account_embed_teaser_slide_2_title: {
|
|
189
|
+
id: 'fabric.linking.connect_link_account_embed_teaser_slide_2_title.non-final',
|
|
190
|
+
defaultMessage: 'Search once, find it everywhere',
|
|
191
|
+
description: 'A title on a teaser slide 2 on benefit of connecting account on Smart Link embed'
|
|
192
|
+
},
|
|
193
|
+
connect_link_account_embed_teaser_slide_2_description: {
|
|
194
|
+
id: 'fabric.linking.connect_link_account_embed_teaser_slide_2_description.non-final',
|
|
195
|
+
defaultMessage: 'Search relevant {context} files alongside your Confluence pages and Jira issues, always respecting your {context} permissions.',
|
|
196
|
+
description: 'A description on a teaser slide 2 on benefit of connecting account on Smart Link embed'
|
|
197
|
+
},
|
|
198
|
+
connect_link_account_embed_teaser_slide_3_title: {
|
|
199
|
+
id: 'fabric.linking.connect_link_account_embed_teaser_slide_3_title.non-final',
|
|
200
|
+
defaultMessage: 'Get help from Rovo',
|
|
201
|
+
description: 'A title on a teaser slide 3 on benefit of connecting account on Smart Link embed'
|
|
202
|
+
},
|
|
203
|
+
connect_link_account_embed_teaser_slide_3_description: {
|
|
204
|
+
id: 'fabric.linking.connect_link_account_embed_teaser_slide_3_description.non-final',
|
|
205
|
+
defaultMessage: "Rovo uses your {context} content to answer questions, summarise docs, and draft updates using the work you've already done.",
|
|
206
|
+
description: 'A description on a teaser slide 3 on benefit of connecting account on Smart Link embed'
|
|
207
|
+
},
|
|
163
208
|
connect_link_account_success_flag_description: {
|
|
164
209
|
id: 'fabric.linking.connect_link_account_success_flag_description',
|
|
165
210
|
defaultMessage: 'Shared links now display rich previews.',
|
|
@@ -941,51 +986,11 @@ export var messages = defineMessages({
|
|
|
941
986
|
defaultMessage: 'Confluence page',
|
|
942
987
|
description: 'The Confluence page the user see Smart Link in, to be used as the {context} for Rovo prompt message'
|
|
943
988
|
},
|
|
944
|
-
rovo_prompt_context_confluence_page_short: {
|
|
945
|
-
id: 'fabric.linking.rovo_prompt_context_confluence_page_short.non-final',
|
|
946
|
-
defaultMessage: 'page',
|
|
947
|
-
description: 'The Confluence page the user see Smart Link in, to be used as the {context} for Rovo prompt message'
|
|
948
|
-
},
|
|
949
989
|
rovo_prompt_context_jira_work_item: {
|
|
950
990
|
id: 'fabric.linking.rovo_prompt_context_jira_work_item.non-final',
|
|
951
991
|
defaultMessage: 'Jira work item',
|
|
952
992
|
description: 'The Jira work item the user see Smart Link in, to be used as the {context} for Rovo prompt message'
|
|
953
993
|
},
|
|
954
|
-
rovo_prompt_context_jira_work_item_short: {
|
|
955
|
-
id: 'fabric.linking.rovo_prompt_context_jira_work_item_short.non-final',
|
|
956
|
-
defaultMessage: 'work item',
|
|
957
|
-
description: 'The Jira work item the user see Smart Link in, to be used as the {context} for Rovo prompt message'
|
|
958
|
-
},
|
|
959
|
-
rovo_prompt_button_recommend_other_sources: {
|
|
960
|
-
id: 'fabric.linking.rovo_prompt_button_recommend_other_sources.non-final',
|
|
961
|
-
defaultMessage: 'Recommend other sources',
|
|
962
|
-
description: 'The name of the action to send prompt message to Rovo Chat in relation to current Smart Link'
|
|
963
|
-
},
|
|
964
|
-
rovo_prompt_message_recommend_other_sources: {
|
|
965
|
-
id: 'fabric.linking.rovo_prompt_message_recommend_other_sources.non-final',
|
|
966
|
-
defaultMessage: '<p>From this <a>{url}</a> and the {context} I’m viewing now as context:</p><ul><li><p>Search across all sources I can access for items that discuss <b>similar concepts, themes, or problems</b>, or that <b>reference similar or closely related sources</b> (including links to the same or related pages, issues, or docs).</p></li><li><p>Return the results as a list or table with columns: <code>Item</code>, <code>Type</code>, <code>Short summary</code>, and <code>Why it’s similar</code>.</p></li><li><p>For each result, give a one‑sentence <b>Short summary</b> of what the item is about.</p></li><li><p>In <b>Why it’s similar</b>, briefly explain (in a phrase or short sentence) what makes it related to this Smart Link and/or the item I’m viewing (for example: same project, similar decision, shared requirements, overlapping stakeholders, similar metrics, or referencing related docs).</p></li><li><p>Order the list from <b>most to least relevant</b> based on Rovo’s assessment of semantic similarity to both the Smart Link target and the current item. Prioritize items that I do not own or have not contributed to.</p></li><li><p>If there are more than 5 results, show the <b>5 most relevant</b> and state how many additional items you found.</p></li></ul>',
|
|
967
|
-
description: 'The prompt message to send to Rovo Chat. {context} refers to the content the user triggered from, e.g. Confluence page or Jira work item. {url} refers to Smart Link that the user triggers this action from. (Please make sure all html tags remain the same.)'
|
|
968
|
-
},
|
|
969
|
-
rovo_prompt_button_show_other_mentions: {
|
|
970
|
-
id: 'fabric.linking.rovo_prompt_button_show_other_mentions.non-final',
|
|
971
|
-
defaultMessage: 'Show other mentions',
|
|
972
|
-
description: 'The name of the action to send prompt message to Rovo Chat in relation to current Smart Link'
|
|
973
|
-
},
|
|
974
|
-
rovo_prompt_message_show_other_mentions: {
|
|
975
|
-
id: 'fabric.linking.rovo_prompt_message_show_other_mentions.non-final',
|
|
976
|
-
defaultMessage: '<p>From <a>{url}</a> and the {context} I’m viewing now:</p><ul><li><p>Search across all Confluence pages and Jira work items I can access for other items that contain this exact Smart Link (same underlying URL/resource).</p></li><li><p>List all matching items in a table with columns: <code>Item</code>, <code>Type</code>, <code>Short summary</code>, <code>How this item uses the link</code>, and <code>Relevance to current item</code>.</p></li><li><p>For <code>Short summary</code>, give a one‑sentence description of what the {context} is about.</p></li><li><p>For <code>How this item uses the link</code>, briefly explain the role this link plays there (e.g., decision doc, background context, implementation details, status update).</p></li><li><p>For <code>Relevance to current item</code>, compare each item to the {context} I’m viewing now and label it <code>High</code>, <code>Medium</code>, or <code>Low</code> relevance, with a short reason (a phrase or single clause).</p></li><li><p>If there are more than 15 matches, show the 15 most relevant and tell me how many additional matches exist.</p></li></ul>',
|
|
977
|
-
description: 'The prompt message to send to Rovo Chat. {context} refers to the content the user triggered from, e.g. Confluence page or Jira work item. {url} refers to Smart Link that the user triggers this action from. (Please make sure all html tags remain the same.)'
|
|
978
|
-
},
|
|
979
|
-
rovo_prompt_button_suggest_improvement: {
|
|
980
|
-
id: 'fabric.linking.rovo_prompt_button_suggest_improvement.non-final',
|
|
981
|
-
defaultMessage: 'Suggest {context} improvement',
|
|
982
|
-
description: 'The name of the action to send prompt message to Rovo Chat in relation to current Smart Link'
|
|
983
|
-
},
|
|
984
|
-
rovo_prompt_message_suggest_improvement: {
|
|
985
|
-
id: 'fabric.linking.rovo_prompt_message_suggest_improvement.non-final',
|
|
986
|
-
defaultMessage: '<p>Using the {context} I’m viewing now, plus all files and links referenced in it (including <a>{url}</a>):</p><ul><li><p>Identify unclear reasoning, missing context, or contradictions between the item and its linked files.</p></li><li><p>Call out any places where assumptions are not backed up by data or prior docs.</p></li><li><p>Stay concise: summarize your findings in <b>no more than three short paragraphs of content listed as bullets</b> of no more than a couple of sentences long focused only on the two points above.</p></li><li><p>After presenting that summary, <b>ask me explicitly</b> if I want you to go deeper. Only if I say yes, then:</p><ul><li><p>Suggest concrete rewrites (bullets or short paragraphs) to make the argument clearer, more concise, and better aligned with the supporting files.</p></li><li><p>Propose 3–5 follow‑up edits or additions that would make this item and its linked docs “share‑ready” for stakeholders.</p></li></ul></li></ul>',
|
|
987
|
-
description: 'The prompt message to send to Rovo Chat. {context} refers to the content the user triggered from, e.g. Confluence page or Jira work item. {url} refers to Smart Link that the user triggers this action from. (Please make sure all html tags remain the same.)'
|
|
988
|
-
},
|
|
989
994
|
rovo_prompt_message_summarize: {
|
|
990
995
|
id: 'fabric.linking.rovo_prompt_message_summarize.non-final',
|
|
991
996
|
defaultMessage: '<p>Summarize the main ideas and key points of <a>{url}</a> in 3-5 clear, complete bullet points (markdown list).</p><p>Preserve important details such as names, dates, and key decisions.</p>',
|
|
@@ -4,7 +4,7 @@ export var ANALYTICS_CHANNEL = 'media';
|
|
|
4
4
|
export var context = {
|
|
5
5
|
componentName: 'smart-cards',
|
|
6
6
|
packageName: "@atlaskit/smart-card" || '',
|
|
7
|
-
packageVersion: "45.6.
|
|
7
|
+
packageVersion: "45.6.9" || ''
|
|
8
8
|
};
|
|
9
9
|
export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
|
|
10
10
|
TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
|
|
2
|
+
._2rko1rr0{border-radius:var(--ds-radius-full,9999px)}
|
|
3
|
+
._zulp1ejb{gap:var(--ds-space-300,24px)}
|
|
4
|
+
._zulpu2gc{gap:var(--ds-space-100,8px)}
|
|
5
|
+
._zulpze3t{gap:var(--ds-space-0,0)}._16jlkb7n{flex-grow:1}
|
|
6
|
+
._18m91wug{overflow-y:auto}
|
|
7
|
+
._19bv1jfw{padding-left:var(--ds-space-500,40px)}
|
|
8
|
+
._19bvpxbi{padding-left:var(--ds-space-200,1pc)}
|
|
9
|
+
._19bvze3t{padding-left:var(--ds-space-0,0)}
|
|
10
|
+
._1bah1h6o{justify-content:center}
|
|
11
|
+
._1bsb1osq{width:100%}
|
|
12
|
+
._1bsb1tcg{width:24px}
|
|
13
|
+
._1bsb7vkz{width:1pc}
|
|
14
|
+
._1bsbi2wt{width:6px}
|
|
15
|
+
._1e0c1txw{display:flex}
|
|
16
|
+
._1e0c1ule{display:block}
|
|
17
|
+
._1n261g80{flex-wrap:wrap}
|
|
18
|
+
._1o9zidpf{flex-shrink:0}
|
|
19
|
+
._1o9zkb7n{flex-shrink:1}
|
|
20
|
+
._1oecfnf5{transition-duration:.2s}
|
|
21
|
+
._1reo1wug{overflow-x:auto}
|
|
22
|
+
._2lx21bp4{flex-direction:column}
|
|
23
|
+
._2lx2vrvc{flex-direction:row}
|
|
24
|
+
._4cvr1fhb{align-items:stretch}
|
|
25
|
+
._4cvr1h6o{align-items:center}
|
|
26
|
+
._4cvr1y6m{align-items:flex-start}
|
|
27
|
+
._4t3i1osq{height:100%}
|
|
28
|
+
._4t3i1tcg{height:24px}
|
|
29
|
+
._4t3i7vkz{height:1pc}
|
|
30
|
+
._4t3ii2wt{height:6px}
|
|
31
|
+
._5ral1f51{object-fit:contain}
|
|
32
|
+
._6fl45ucs{transition-timing-function:ease}
|
|
33
|
+
._bfhk1dy8{background-color:var(--ds-background-accent-blue-subtler,#cfe1fd)}
|
|
34
|
+
._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
|
|
35
|
+
._bfhkjmqp{background-color:var(--ds-background-selected-bold,#1868db)}
|
|
36
|
+
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
37
|
+
._c71l1wdt{max-height:220px}
|
|
38
|
+
._ca0q1jfw{padding-top:var(--ds-space-500,40px)}
|
|
39
|
+
._ca0qpxbi{padding-top:var(--ds-space-200,1pc)}
|
|
40
|
+
._ca0qze3t{padding-top:var(--ds-space-0,0)}
|
|
41
|
+
._i0dlghg7{flex-basis:240px}
|
|
42
|
+
._i0dluuw1{flex-basis:200px}
|
|
43
|
+
._k8m01k61{transition-property:background-color}
|
|
44
|
+
._lcxvglyw{pointer-events:none}
|
|
45
|
+
._n3td1jfw{padding-bottom:var(--ds-space-500,40px)}
|
|
46
|
+
._n3tdpxbi{padding-bottom:var(--ds-space-200,1pc)}
|
|
47
|
+
._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
|
|
48
|
+
._rsufaqso{object-position:center center}
|
|
49
|
+
._u5f31jfw{padding-right:var(--ds-space-500,40px)}
|
|
50
|
+
._u5f3pxbi{padding-right:var(--ds-space-200,1pc)}
|
|
51
|
+
._u5f3ze3t{padding-right:var(--ds-space-0,0)}
|
|
52
|
+
._vchhusvi{box-sizing:border-box}
|
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
/* CarouselSlide.tsx generated by @compiled/babel-plugin v0.39.1 */
|
|
2
|
+
import "./CarouselSlide.compiled.css";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import { useIntl } from 'react-intl';
|
|
6
|
+
import Button from '@atlaskit/button/new';
|
|
7
|
+
import { cx } from '@atlaskit/css';
|
|
8
|
+
import Heading from '@atlaskit/heading';
|
|
9
|
+
import Image from '@atlaskit/image';
|
|
10
|
+
import { Box, Pressable, Text } from '@atlaskit/primitives/compiled';
|
|
11
|
+
import { messages } from '../../../../messages';
|
|
12
|
+
var styles = {
|
|
13
|
+
columnImage: "_16jlkb7n _1o9zkb7n _i0dlghg7 _1e0c1txw _4cvr1h6o _1bah1h6o _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _bfhk1dy8",
|
|
14
|
+
columnContent: "_zulp1ejb _16jlkb7n _1o9zkb7n _i0dluuw1 _1e0c1txw _2lx21bp4 _ca0q1jfw _u5f31jfw _n3td1jfw _19bv1jfw _4cvr1y6m _1bah1h6o",
|
|
15
|
+
columnContentCompact: "_ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi",
|
|
16
|
+
dot: "_2rko1rr0 _1bsbi2wt _4t3ii2wt _bfhki8nm _1oecfnf5 _k8m01k61 _6fl45ucs _lcxvglyw",
|
|
17
|
+
dotActive: "_bfhkjmqp",
|
|
18
|
+
dotPassable: "_2rko1rr0 _1e0c1txw _4cvr1h6o _1bah1h6o _1bsb7vkz _4t3i7vkz _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t",
|
|
19
|
+
icon: "_1o9zidpf _1bsb1tcg _4t3i1tcg _1e0c1txw _4cvr1h6o _1bah1h6o",
|
|
20
|
+
iconImage: "_1bsb1osq _4t3i1osq _5ral1f51",
|
|
21
|
+
image: "_1bsb1osq _c71l1wdt _5ral1f51 _rsufaqso _1e0c1ule",
|
|
22
|
+
rowButton: "_zulpu2gc _1e0c1txw _2lx2vrvc _1n261g80 _4cvr1h6o",
|
|
23
|
+
rowButtonCompact: "_1bsb1osq",
|
|
24
|
+
rowDot: "_zulpze3t _1e0c1txw _2lx2vrvc _4cvr1h6o",
|
|
25
|
+
rowIcon: "_zulpu2gc _1e0c1txw _4cvr1h6o",
|
|
26
|
+
slide: "_1reo1wug _18m91wug _1e0c1txw _1n261g80 _1bsb1osq _4t3i1osq _4cvr1fhb _vchhusvi"
|
|
27
|
+
};
|
|
28
|
+
var CarouselSlide = function CarouselSlide(_ref) {
|
|
29
|
+
var icon = _ref.icon,
|
|
30
|
+
iconLabel = _ref.iconLabel,
|
|
31
|
+
title = _ref.title,
|
|
32
|
+
description = _ref.description,
|
|
33
|
+
image = _ref.image,
|
|
34
|
+
primaryButtonLabel = _ref.primaryButtonLabel,
|
|
35
|
+
onPrimaryButtonClick = _ref.onPrimaryButtonClick,
|
|
36
|
+
onDotClick = _ref.onDotClick,
|
|
37
|
+
onNextClick = _ref.onNextClick,
|
|
38
|
+
slideIndex = _ref.slideIndex,
|
|
39
|
+
totalSlides = _ref.totalSlides,
|
|
40
|
+
size = _ref.size,
|
|
41
|
+
_ref$testId = _ref.testId,
|
|
42
|
+
testId = _ref$testId === void 0 ? 'embed-card-teaser-slide' : _ref$testId;
|
|
43
|
+
var _useIntl = useIntl(),
|
|
44
|
+
formatMessage = _useIntl.formatMessage;
|
|
45
|
+
var isCompact = size !== 'full';
|
|
46
|
+
var showNavigation = totalSlides > 1;
|
|
47
|
+
var renderedIcon = icon == null ? null : typeof icon === 'string' ? /*#__PURE__*/React.createElement(Box, {
|
|
48
|
+
xcss: styles.icon
|
|
49
|
+
}, /*#__PURE__*/React.createElement(Image, {
|
|
50
|
+
src: icon,
|
|
51
|
+
alt: iconLabel,
|
|
52
|
+
className: ax([styles.iconImage])
|
|
53
|
+
})) : /*#__PURE__*/React.createElement(Box, {
|
|
54
|
+
xcss: styles.icon
|
|
55
|
+
}, icon);
|
|
56
|
+
var renderedImage = image == null ? null : typeof image === 'string' ? /*#__PURE__*/React.createElement(Image, {
|
|
57
|
+
src: image,
|
|
58
|
+
alt: title,
|
|
59
|
+
className: ax([styles.image])
|
|
60
|
+
}) : image;
|
|
61
|
+
return /*#__PURE__*/React.createElement(Box, {
|
|
62
|
+
xcss: styles.slide,
|
|
63
|
+
testId: testId
|
|
64
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
65
|
+
xcss: cx(styles.columnContent, isCompact && styles.columnContentCompact)
|
|
66
|
+
}, isCompact && /*#__PURE__*/React.createElement(Box, {
|
|
67
|
+
xcss: cx(styles.rowButton, styles.rowButtonCompact)
|
|
68
|
+
}, /*#__PURE__*/React.createElement(Button, {
|
|
69
|
+
appearance: "primary",
|
|
70
|
+
onClick: onPrimaryButtonClick,
|
|
71
|
+
shouldFitContainer: true,
|
|
72
|
+
testId: "".concat(testId, "-connect-compact")
|
|
73
|
+
}, primaryButtonLabel)), renderedIcon && /*#__PURE__*/React.createElement(Box, {
|
|
74
|
+
xcss: styles.rowIcon
|
|
75
|
+
}, renderedIcon), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Heading, {
|
|
76
|
+
size: "medium",
|
|
77
|
+
testId: "".concat(testId, "-title")
|
|
78
|
+
}, title)), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Text, {
|
|
79
|
+
testId: "".concat(testId, "-description")
|
|
80
|
+
}, description)), /*#__PURE__*/React.createElement(Box, {
|
|
81
|
+
xcss: styles.rowButton
|
|
82
|
+
}, !isCompact && /*#__PURE__*/React.createElement(Button, {
|
|
83
|
+
appearance: "primary",
|
|
84
|
+
onClick: onPrimaryButtonClick,
|
|
85
|
+
testId: "".concat(testId, "-connect")
|
|
86
|
+
}, primaryButtonLabel), showNavigation && onNextClick && /*#__PURE__*/React.createElement(Button, {
|
|
87
|
+
appearance: "subtle",
|
|
88
|
+
onClick: onNextClick,
|
|
89
|
+
testId: "".concat(testId, "-next")
|
|
90
|
+
}, formatMessage(messages.connect_link_account_embed_teaser_button_next)), showNavigation && /*#__PURE__*/React.createElement(Box, {
|
|
91
|
+
xcss: styles.rowDot,
|
|
92
|
+
role: "group",
|
|
93
|
+
"aria-label": formatMessage(messages.connect_link_account_embed_teaser_dot_row_label)
|
|
94
|
+
}, Array.from({
|
|
95
|
+
length: totalSlides
|
|
96
|
+
}, function (_, i) {
|
|
97
|
+
return /*#__PURE__*/React.createElement(Pressable, {
|
|
98
|
+
key: i,
|
|
99
|
+
xcss: styles.dotPassable,
|
|
100
|
+
onClick: function onClick() {
|
|
101
|
+
return onDotClick === null || onDotClick === void 0 ? void 0 : onDotClick(i);
|
|
102
|
+
},
|
|
103
|
+
"aria-label": formatMessage(messages.connect_link_account_embed_teaser_dot_label, {
|
|
104
|
+
index: i + 1,
|
|
105
|
+
total: totalSlides
|
|
106
|
+
}),
|
|
107
|
+
"aria-current": i === slideIndex ? 'true' : undefined,
|
|
108
|
+
testId: "".concat(testId, "-dot-").concat(i)
|
|
109
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
110
|
+
xcss: cx(styles.dot, i === slideIndex && styles.dotActive)
|
|
111
|
+
}));
|
|
112
|
+
})))), !isCompact && /*#__PURE__*/React.createElement(Box, {
|
|
113
|
+
xcss: styles.columnImage,
|
|
114
|
+
testId: "".concat(testId, "-image-panel")
|
|
115
|
+
}, renderedImage));
|
|
116
|
+
};
|
|
117
|
+
export default CarouselSlide;
|