@atlaskit/smart-card 26.52.2 → 26.52.3
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 +7 -0
- package/dist/cjs/extractors/flexible/actions/index.js +1 -1
- package/dist/cjs/messages.js +5 -0
- package/dist/cjs/state/hooks/use-ai-summary/ai-summary-service/index.js +72 -102
- package/dist/cjs/utils/analytics/analytics.js +1 -1
- package/dist/cjs/view/FlexibleCard/components/actions/action/action-icon/index.js +23 -6
- package/dist/cjs/view/FlexibleCard/components/actions/action/action-stack-item/index.js +94 -0
- package/dist/cjs/view/FlexibleCard/components/actions/action/action-stack-item/types.js +5 -0
- package/dist/cjs/view/FlexibleCard/components/actions/action/index.js +36 -20
- package/dist/cjs/view/FlexibleCard/components/actions/preview-action/index.js +6 -2
- package/dist/cjs/view/FlexibleCard/components/actions/preview-action/preview-icon/index.js +19 -0
- package/dist/cjs/view/FlexibleCard/components/blocks/action-block/index.js +72 -0
- package/dist/cjs/view/FlexibleCard/components/blocks/action-block/types.js +5 -0
- package/dist/cjs/view/FlexibleCard/components/blocks/index.js +8 -1
- package/dist/cjs/view/FlexibleCard/components/blocks/utils.js +6 -0
- package/dist/cjs/view/FlexibleCard/components/container/index.js +26 -5
- package/dist/cjs/view/FlexibleCard/components/utils.js +76 -8
- package/dist/cjs/view/HoverCard/components/views/resolved/index.js +2 -0
- package/dist/cjs/view/LinkUrl/index.js +1 -1
- package/dist/es2019/extractors/flexible/actions/index.js +2 -2
- package/dist/es2019/messages.js +5 -0
- package/dist/es2019/state/hooks/use-ai-summary/ai-summary-service/index.js +4 -4
- package/dist/es2019/utils/analytics/analytics.js +1 -1
- package/dist/es2019/view/FlexibleCard/components/actions/action/action-icon/index.js +21 -6
- package/dist/es2019/view/FlexibleCard/components/actions/action/action-stack-item/index.js +83 -0
- package/dist/es2019/view/FlexibleCard/components/actions/action/action-stack-item/types.js +1 -0
- package/dist/es2019/view/FlexibleCard/components/actions/action/index.js +34 -17
- package/dist/es2019/view/FlexibleCard/components/actions/preview-action/index.js +6 -2
- package/dist/es2019/view/FlexibleCard/components/actions/preview-action/preview-icon/index.js +10 -0
- package/dist/es2019/view/FlexibleCard/components/blocks/action-block/index.js +61 -0
- package/dist/es2019/view/FlexibleCard/components/blocks/action-block/types.js +1 -0
- package/dist/es2019/view/FlexibleCard/components/blocks/index.js +2 -1
- package/dist/es2019/view/FlexibleCard/components/blocks/utils.js +6 -0
- package/dist/es2019/view/FlexibleCard/components/container/index.js +23 -24
- package/dist/es2019/view/FlexibleCard/components/utils.js +73 -38
- package/dist/es2019/view/HoverCard/components/views/resolved/index.js +3 -1
- package/dist/es2019/view/LinkUrl/index.js +1 -1
- package/dist/esm/extractors/flexible/actions/index.js +1 -1
- package/dist/esm/messages.js +5 -0
- package/dist/esm/state/hooks/use-ai-summary/ai-summary-service/index.js +72 -102
- package/dist/esm/utils/analytics/analytics.js +1 -1
- package/dist/esm/view/FlexibleCard/components/actions/action/action-icon/index.js +22 -6
- package/dist/esm/view/FlexibleCard/components/actions/action/action-stack-item/index.js +84 -0
- package/dist/esm/view/FlexibleCard/components/actions/action/action-stack-item/types.js +1 -0
- package/dist/esm/view/FlexibleCard/components/actions/action/index.js +35 -18
- package/dist/esm/view/FlexibleCard/components/actions/preview-action/index.js +6 -2
- package/dist/esm/view/FlexibleCard/components/actions/preview-action/preview-icon/index.js +12 -0
- package/dist/esm/view/FlexibleCard/components/blocks/action-block/index.js +63 -0
- package/dist/esm/view/FlexibleCard/components/blocks/action-block/types.js +1 -0
- package/dist/esm/view/FlexibleCard/components/blocks/index.js +2 -1
- package/dist/esm/view/FlexibleCard/components/blocks/utils.js +6 -0
- package/dist/esm/view/FlexibleCard/components/container/index.js +26 -5
- package/dist/esm/view/FlexibleCard/components/utils.js +75 -7
- package/dist/esm/view/HoverCard/components/views/resolved/index.js +3 -1
- package/dist/esm/view/LinkUrl/index.js +1 -1
- package/dist/types/messages.d.ts +1 -1
- package/dist/types/state/hooks/use-ai-summary/ai-summary-service/index.d.ts +2 -2
- package/dist/types/state/hooks/use-ai-summary/ai-summary-service/types.d.ts +4 -4
- package/dist/types/view/FlexibleCard/components/actions/action/action-icon/types.d.ts +4 -3
- package/dist/types/view/FlexibleCard/components/actions/action/action-stack-item/index.d.ts +4 -0
- package/dist/types/view/FlexibleCard/components/actions/action/action-stack-item/types.d.ts +10 -0
- package/dist/types/view/FlexibleCard/components/actions/action/index.d.ts +3 -6
- package/dist/types/view/FlexibleCard/components/actions/action/types.d.ts +24 -16
- package/dist/types/view/FlexibleCard/components/actions/preview-action/preview-icon/index.d.ts +4 -0
- package/dist/types/view/FlexibleCard/components/blocks/action-block/index.d.ts +4 -0
- package/dist/types/view/FlexibleCard/components/blocks/action-block/types.d.ts +17 -0
- package/dist/types/view/FlexibleCard/components/blocks/index.d.ts +1 -0
- package/dist/types/view/FlexibleCard/components/blocks/utils.d.ts +5 -0
- package/dist/types/view/FlexibleCard/components/utils.d.ts +11 -0
- package/dist/types-ts4.5/messages.d.ts +1 -1
- package/dist/types-ts4.5/state/hooks/use-ai-summary/ai-summary-service/index.d.ts +2 -2
- package/dist/types-ts4.5/state/hooks/use-ai-summary/ai-summary-service/types.d.ts +4 -4
- package/dist/types-ts4.5/view/FlexibleCard/components/actions/action/action-icon/types.d.ts +4 -3
- package/dist/types-ts4.5/view/FlexibleCard/components/actions/action/action-stack-item/index.d.ts +4 -0
- package/dist/types-ts4.5/view/FlexibleCard/components/actions/action/action-stack-item/types.d.ts +10 -0
- package/dist/types-ts4.5/view/FlexibleCard/components/actions/action/index.d.ts +3 -6
- package/dist/types-ts4.5/view/FlexibleCard/components/actions/action/types.d.ts +24 -16
- package/dist/types-ts4.5/view/FlexibleCard/components/actions/preview-action/preview-icon/index.d.ts +4 -0
- package/dist/types-ts4.5/view/FlexibleCard/components/blocks/action-block/index.d.ts +4 -0
- package/dist/types-ts4.5/view/FlexibleCard/components/blocks/action-block/types.d.ts +17 -0
- package/dist/types-ts4.5/view/FlexibleCard/components/blocks/index.d.ts +1 -0
- package/dist/types-ts4.5/view/FlexibleCard/components/blocks/utils.d.ts +5 -0
- package/dist/types-ts4.5/view/FlexibleCard/components/utils.d.ts +11 -0
- package/package.json +4 -1
|
@@ -8,6 +8,7 @@ import { useFlexibleUiAnalyticsContext, useFlexibleUiContext } from '../../../..
|
|
|
8
8
|
import useInvokeClientAction from '../../../../../state/hooks/use-invoke-client-action';
|
|
9
9
|
import { openEmbedModalWithFlexibleUiIcon } from '../../utils';
|
|
10
10
|
import Action from '../action';
|
|
11
|
+
import PreviewIcon from './preview-icon';
|
|
11
12
|
const PreviewAction = ({
|
|
12
13
|
onClick: onClickCallback,
|
|
13
14
|
...props
|
|
@@ -39,14 +40,17 @@ const PreviewAction = ({
|
|
|
39
40
|
onClickCallback();
|
|
40
41
|
}
|
|
41
42
|
}, [analytics, data, invoke, onClickCallback]);
|
|
43
|
+
const isStackItem = props.as === 'stack-item';
|
|
44
|
+
const Icon = isStackItem ? PreviewIcon : VidFullScreenOnIcon;
|
|
45
|
+
const tooltipMessage = isStackItem ? messages.preview_description : messages.preview_improved;
|
|
42
46
|
return data ? /*#__PURE__*/React.createElement(Action, _extends({
|
|
43
47
|
content: /*#__PURE__*/React.createElement(FormattedMessage, messages.preview_improved),
|
|
44
|
-
icon: /*#__PURE__*/React.createElement(
|
|
48
|
+
icon: /*#__PURE__*/React.createElement(Icon, {
|
|
45
49
|
label: "Open preview"
|
|
46
50
|
}),
|
|
47
51
|
onClick: onClick,
|
|
48
52
|
testId: "smart-action-preview-action",
|
|
49
|
-
tooltipMessage: /*#__PURE__*/React.createElement(FormattedMessage,
|
|
53
|
+
tooltipMessage: /*#__PURE__*/React.createElement(FormattedMessage, tooltipMessage)
|
|
50
54
|
}, data, props)) : null;
|
|
51
55
|
};
|
|
52
56
|
export default PreviewAction;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import EditorExpandIcon from '@atlaskit/icon/glyph/editor/expand';
|
|
2
|
+
import { Box, xcss } from '@atlaskit/primitives';
|
|
3
|
+
import React from 'react';
|
|
4
|
+
const iconStyles = xcss({
|
|
5
|
+
transform: 'rotate(-45deg)'
|
|
6
|
+
});
|
|
7
|
+
const PreviewIcon = props => /*#__PURE__*/React.createElement(Box, {
|
|
8
|
+
xcss: iconStyles
|
|
9
|
+
}, /*#__PURE__*/React.createElement(EditorExpandIcon, props));
|
|
10
|
+
export default PreviewIcon;
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { Stack, xcss } from '@atlaskit/primitives';
|
|
2
|
+
import React, { useMemo } from 'react';
|
|
3
|
+
import { SmartLinkSize } from '../../../../../constants';
|
|
4
|
+
import { useFlexibleUiContext, useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
|
|
5
|
+
import * as Actions from '../../actions';
|
|
6
|
+
import { getPrimitivesPaddingSpaceBySize } from '../../utils';
|
|
7
|
+
// We have to find a better way to ignore container padding
|
|
8
|
+
// This has become more and more of a common use case.
|
|
9
|
+
const ignoreContainerPaddingStyles = xcss({
|
|
10
|
+
marginLeft: 'calc(var(--container-gap-left) * -1)',
|
|
11
|
+
marginRight: 'calc(var(--container-gap-right) * -1)'
|
|
12
|
+
});
|
|
13
|
+
const ActionBlock = ({
|
|
14
|
+
blockRef,
|
|
15
|
+
onClick: onClickCallback,
|
|
16
|
+
size,
|
|
17
|
+
sort,
|
|
18
|
+
spaceInline,
|
|
19
|
+
testId = 'smart-block-action'
|
|
20
|
+
}) => {
|
|
21
|
+
const context = useFlexibleUiContext();
|
|
22
|
+
const ui = useFlexibleUiOptionContext();
|
|
23
|
+
const padding = !(ui !== null && ui !== void 0 && ui.hidePadding) ? getPrimitivesPaddingSpaceBySize((ui === null || ui === void 0 ? void 0 : ui.size) || SmartLinkSize.Medium) : undefined;
|
|
24
|
+
const actions = useMemo(() => {
|
|
25
|
+
if (!(context !== null && context !== void 0 && context.actions)) {
|
|
26
|
+
return;
|
|
27
|
+
}
|
|
28
|
+
const arr = Object.keys(context.actions);
|
|
29
|
+
if (sort) {
|
|
30
|
+
arr.sort(sort);
|
|
31
|
+
}
|
|
32
|
+
return arr.map(name => {
|
|
33
|
+
const Action = Actions[name];
|
|
34
|
+
return Action ? /*#__PURE__*/React.createElement(Action, {
|
|
35
|
+
as: "stack-item",
|
|
36
|
+
spaceInline: spaceInline,
|
|
37
|
+
key: name,
|
|
38
|
+
onClick: () => onClickCallback === null || onClickCallback === void 0 ? void 0 : onClickCallback(name),
|
|
39
|
+
size: size
|
|
40
|
+
// Remove url once ViewAction is retired.
|
|
41
|
+
// This seems to be a typescript workaround
|
|
42
|
+
// because ViewAction marks it as required,
|
|
43
|
+
// which does not reflect actual implementation as the url
|
|
44
|
+
// came from data context and not all actions require url.
|
|
45
|
+
// https://product-fabric.atlassian.net/browse/EDM-9547
|
|
46
|
+
,
|
|
47
|
+
url: "",
|
|
48
|
+
xcss: xcss({
|
|
49
|
+
paddingInline: padding
|
|
50
|
+
})
|
|
51
|
+
}) : null;
|
|
52
|
+
});
|
|
53
|
+
}, [context === null || context === void 0 ? void 0 : context.actions, onClickCallback, padding, size, sort, spaceInline]);
|
|
54
|
+
return actions ? /*#__PURE__*/React.createElement(Stack, {
|
|
55
|
+
grow: "fill",
|
|
56
|
+
xcss: ignoreContainerPaddingStyles,
|
|
57
|
+
ref: blockRef,
|
|
58
|
+
testId: testId
|
|
59
|
+
}, actions) : null;
|
|
60
|
+
};
|
|
61
|
+
export default ActionBlock;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -8,4 +8,5 @@ export { default as CustomBlock } from './block';
|
|
|
8
8
|
// Internal components to be used within @atlaskit/smart-card only.
|
|
9
9
|
export { default as InternalFooterBlock } from './footer-block/resolved';
|
|
10
10
|
export { default as RelatedUrlsBlock } from './related-urls-block';
|
|
11
|
-
export { default as AISummaryBlock } from './ai-summary-block';
|
|
11
|
+
export { default as AISummaryBlock } from './ai-summary-block';
|
|
12
|
+
export { default as ActionBlock } from './action-block';
|
|
@@ -60,6 +60,12 @@ const getDirectionStyles = direction => {
|
|
|
60
60
|
});
|
|
61
61
|
}
|
|
62
62
|
};
|
|
63
|
+
|
|
64
|
+
/**
|
|
65
|
+
* Get gap size between elements inside a block
|
|
66
|
+
* Equivalent version for DS primitives space token is getPrimitivesInlineSpaceBySize()
|
|
67
|
+
* at view/FlexibleCard/components/utils.tsx
|
|
68
|
+
*/
|
|
63
69
|
export const getGapSize = size => {
|
|
64
70
|
switch (size) {
|
|
65
71
|
case SmartLinkSize.XLarge:
|
|
@@ -9,11 +9,11 @@ import HoverCardControl from './hover-card-control';
|
|
|
9
9
|
import { isFlexUiPreviewPresent } from '../../../../state/flexible-ui-context/utils';
|
|
10
10
|
import { N40 } from '@atlaskit/theme/colors';
|
|
11
11
|
import { di } from 'react-magnetic-di';
|
|
12
|
-
const elevationStyles = css
|
|
13
|
-
border: 1px solid ${`var(--ds-border, ${N40})`}
|
|
14
|
-
|
|
15
|
-
margin:
|
|
16
|
-
|
|
12
|
+
const elevationStyles = css({
|
|
13
|
+
border: `1px solid ${`var(--ds-border, ${N40})`}`,
|
|
14
|
+
borderRadius: "var(--ds-border-radius-200, 8px)",
|
|
15
|
+
margin: "var(--ds-space-025, 2px)"
|
|
16
|
+
});
|
|
17
17
|
const getGap = size => {
|
|
18
18
|
switch (size) {
|
|
19
19
|
case SmartLinkSize.XLarge:
|
|
@@ -27,6 +27,12 @@ const getGap = size => {
|
|
|
27
27
|
return '.25rem';
|
|
28
28
|
}
|
|
29
29
|
};
|
|
30
|
+
|
|
31
|
+
/**
|
|
32
|
+
* Get container padding based on smart link size
|
|
33
|
+
* Equivalent version for DS primitives space token is getPrimitivesPaddingSpaceBySize()
|
|
34
|
+
* at view/FlexibleCard/components/utils.tsx
|
|
35
|
+
*/
|
|
30
36
|
const getPadding = size => {
|
|
31
37
|
switch (size) {
|
|
32
38
|
case SmartLinkSize.XLarge:
|
|
@@ -40,15 +46,12 @@ const getPadding = size => {
|
|
|
40
46
|
return '.5rem';
|
|
41
47
|
}
|
|
42
48
|
};
|
|
43
|
-
const clickableContainerStyles = css
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
.has-action {
|
|
48
|
-
position: relative;
|
|
49
|
-
z-index: 1;
|
|
49
|
+
const clickableContainerStyles = css({
|
|
50
|
+
'a, button, .has-action': {
|
|
51
|
+
position: 'relative',
|
|
52
|
+
zIndex: 1
|
|
50
53
|
}
|
|
51
|
-
|
|
54
|
+
});
|
|
52
55
|
const getContainerPaddingStyles = (size, hidePadding, childrenOptions) => {
|
|
53
56
|
const padding = hidePadding ? '0rem' : getPadding(size);
|
|
54
57
|
const gap = getGap(size);
|
|
@@ -56,17 +59,13 @@ const getContainerPaddingStyles = (size, hidePadding, childrenOptions) => {
|
|
|
56
59
|
previewOnLeft,
|
|
57
60
|
previewOnRight
|
|
58
61
|
} = childrenOptions;
|
|
59
|
-
return css
|
|
60
|
-
|
|
61
|
-
--container-
|
|
62
|
-
--container-gap-
|
|
63
|
-
--
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
padding: ${padding};
|
|
67
|
-
${previewOnLeft ? `padding-left: calc(var(--preview-block-width) + ${gap});` : ''}
|
|
68
|
-
${previewOnRight ? `padding-right: calc(var(--preview-block-width) + ${gap});` : ''}
|
|
69
|
-
`;
|
|
62
|
+
return css({
|
|
63
|
+
'--container-padding': padding,
|
|
64
|
+
'--container-gap-left': previewOnLeft ? gap : padding,
|
|
65
|
+
'--container-gap-right': previewOnRight ? gap : padding,
|
|
66
|
+
'--preview-block-width': '30%',
|
|
67
|
+
padding: padding
|
|
68
|
+
}, previewOnLeft ? `padding-left: calc(var(--preview-block-width) + ${gap});` : '', previewOnRight ? `padding-right: calc(var(--preview-block-width) + ${gap});` : '');
|
|
70
69
|
};
|
|
71
70
|
const getChildrenOptions = (children, context) => {
|
|
72
71
|
let options = {};
|
|
@@ -30,14 +30,14 @@ export const getFormattedMessageAsString = (intl, message, context) => {
|
|
|
30
30
|
context
|
|
31
31
|
}) : '';
|
|
32
32
|
};
|
|
33
|
-
const getIconDimensionStyles = value => css
|
|
34
|
-
height:
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
width:
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
33
|
+
const getIconDimensionStyles = value => css({
|
|
34
|
+
height: value,
|
|
35
|
+
minHeight: value,
|
|
36
|
+
maxHeight: value,
|
|
37
|
+
width: value,
|
|
38
|
+
minWidth: value,
|
|
39
|
+
maxWidth: value
|
|
40
|
+
});
|
|
41
41
|
export const getIconSizeStyles = width => {
|
|
42
42
|
const sizeStyles = getIconDimensionStyles(width);
|
|
43
43
|
return css`
|
|
@@ -80,28 +80,28 @@ export const getLinkLineHeight = size => {
|
|
|
80
80
|
export const getLinkSizeStyles = size => {
|
|
81
81
|
switch (size) {
|
|
82
82
|
case SmartLinkSize.XLarge:
|
|
83
|
-
return css
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
83
|
+
return css({
|
|
84
|
+
fontSize: '1.25rem',
|
|
85
|
+
fontWeight: 400,
|
|
86
|
+
letterSpacing: '-0.008em',
|
|
87
|
+
lineHeight: getLinkLineHeight(size)
|
|
88
|
+
});
|
|
89
89
|
case SmartLinkSize.Large:
|
|
90
90
|
case SmartLinkSize.Medium:
|
|
91
|
-
return css
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
91
|
+
return css({
|
|
92
|
+
fontSize: '0.875rem',
|
|
93
|
+
fontWeight: 400,
|
|
94
|
+
letterSpacing: '-0.003em',
|
|
95
|
+
lineHeight: getLinkLineHeight(size)
|
|
96
|
+
});
|
|
97
97
|
case SmartLinkSize.Small:
|
|
98
98
|
default:
|
|
99
|
-
return css
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
99
|
+
return css({
|
|
100
|
+
fontSize: '0.75rem',
|
|
101
|
+
fontWeight: 400,
|
|
102
|
+
letterSpacing: '0em',
|
|
103
|
+
lineHeight: getLinkLineHeight(size)
|
|
104
|
+
});
|
|
105
105
|
}
|
|
106
106
|
};
|
|
107
107
|
export const getMaxLineHeight = size => {
|
|
@@ -126,18 +126,53 @@ export const getMaxLines = (value, defaultValue, max, min) => {
|
|
|
126
126
|
}
|
|
127
127
|
return value;
|
|
128
128
|
};
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
129
|
+
|
|
130
|
+
/**
|
|
131
|
+
* A space between element based on smart link size
|
|
132
|
+
* To replace blocks/utils.tsz getGapSize() with space token for primitives
|
|
133
|
+
*/
|
|
134
|
+
export const getPrimitivesInlineSpaceBySize = size => {
|
|
135
|
+
switch (size) {
|
|
136
|
+
case SmartLinkSize.XLarge:
|
|
137
|
+
return 'space.250';
|
|
138
|
+
case SmartLinkSize.Large:
|
|
139
|
+
return 'space.200';
|
|
140
|
+
case SmartLinkSize.Medium:
|
|
141
|
+
return 'space.100';
|
|
142
|
+
case SmartLinkSize.Small:
|
|
143
|
+
default:
|
|
144
|
+
return 'space.050';
|
|
145
|
+
}
|
|
146
|
+
};
|
|
147
|
+
|
|
148
|
+
/**
|
|
149
|
+
* Get container padding based on smart link size
|
|
150
|
+
* To replace container/index.tsx getPadding() with space token for primitives
|
|
151
|
+
*/
|
|
152
|
+
export const getPrimitivesPaddingSpaceBySize = size => {
|
|
153
|
+
switch (size) {
|
|
154
|
+
case SmartLinkSize.XLarge:
|
|
155
|
+
return 'space.300';
|
|
156
|
+
case SmartLinkSize.Large:
|
|
157
|
+
return 'space.250';
|
|
158
|
+
case SmartLinkSize.Medium:
|
|
159
|
+
return 'space.200';
|
|
160
|
+
case SmartLinkSize.Small:
|
|
161
|
+
default:
|
|
162
|
+
return 'space.100';
|
|
163
|
+
}
|
|
164
|
+
};
|
|
165
|
+
export const getTruncateStyles = (maxLines, lineHeight = '1rem', wordBreak = 'break-word') => css({
|
|
166
|
+
display: '-webkit-box',
|
|
167
|
+
overflow: 'hidden',
|
|
168
|
+
textOverflow: 'ellipsis',
|
|
169
|
+
wordBreak: wordBreak,
|
|
170
|
+
WebkitLineClamp: maxLines,
|
|
171
|
+
WebkitBoxOrient: 'vertical',
|
|
172
|
+
'@supports not (-webkit-line-clamp: 1)': {
|
|
173
|
+
maxHeight: `calc(${maxLines} * ${lineHeight})`
|
|
174
|
+
}
|
|
175
|
+
});
|
|
141
176
|
export const hasWhiteSpace = str => {
|
|
142
177
|
return str.search(/\s/) >= 0;
|
|
143
178
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import React, { useCallback, useEffect, useMemo, useRef } from 'react';
|
|
3
3
|
import { ActionName, CardDisplay, ElementName, SmartLinkPosition, SmartLinkSize, SmartLinkDirection } from '../../../../../constants';
|
|
4
|
-
import { FooterBlock, MetadataBlock, RelatedUrlsBlock, SnippetBlock, TitleBlock, AISummaryBlock, CustomBlock } from '../../../../FlexibleCard/components/blocks';
|
|
4
|
+
import { FooterBlock, MetadataBlock, RelatedUrlsBlock, SnippetBlock, TitleBlock, AISummaryBlock, CustomBlock, ActionBlock } from '../../../../FlexibleCard/components/blocks';
|
|
5
5
|
import { footerBlockCss, hiddenSnippetStyles, metadataBlockCss } from './styled';
|
|
6
6
|
import FlexibleCard from '../../../../FlexibleCard';
|
|
7
7
|
import { getSimulatedBetterMetadata } from '../../../utils';
|
|
@@ -184,6 +184,8 @@ const HoverCardResolvedView = ({
|
|
|
184
184
|
actions: footerActions,
|
|
185
185
|
size: SmartLinkSize.Large,
|
|
186
186
|
overrideCss: footerBlockCss
|
|
187
|
+
}), getBooleanFF('platform.linking-platform.smart-card.hover-card-action-redesign') && /*#__PURE__*/React.createElement(ActionBlock, {
|
|
188
|
+
spaceInline: "space.150"
|
|
187
189
|
}));
|
|
188
190
|
};
|
|
189
191
|
export default HoverCardResolvedView;
|
|
@@ -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.52.
|
|
10
|
+
packageVersion: "26.52.3",
|
|
11
11
|
componentName: 'linkUrl'
|
|
12
12
|
};
|
|
13
13
|
const Link = withLinkClickedEvent('a');
|
|
@@ -5,7 +5,7 @@ import { extractPreviewAction } from './extract-preview-action';
|
|
|
5
5
|
import extractFollowAction from './extract-follow-action';
|
|
6
6
|
var extractActions = function extractActions(response, data, actionOptions, id) {
|
|
7
7
|
var _action;
|
|
8
|
-
var action = (_action = {}, _defineProperty(_action, ActionName.
|
|
8
|
+
var action = (_action = {}, _defineProperty(_action, ActionName.DownloadAction, extractDownloadAction(data, actionOptions)), _defineProperty(_action, ActionName.FollowAction, extractFollowAction(response, actionOptions, id)), _defineProperty(_action, ActionName.PreviewAction, extractPreviewAction(response, actionOptions)), _action);
|
|
9
9
|
return Object.values(action).some(function (value) {
|
|
10
10
|
return Boolean(value);
|
|
11
11
|
}) ? action : undefined;
|
package/dist/esm/messages.js
CHANGED
|
@@ -255,6 +255,11 @@ export var messages = defineMessages({
|
|
|
255
255
|
defaultMessage: 'Owned by {context}',
|
|
256
256
|
description: 'Indicates the person or entity that owns or maintains the resource.'
|
|
257
257
|
},
|
|
258
|
+
preview_description: {
|
|
259
|
+
id: 'fabric.linking.preview_description.nonfinal',
|
|
260
|
+
defaultMessage: 'Open a full screen preview of this link',
|
|
261
|
+
description: 'Description on what Preview does'
|
|
262
|
+
},
|
|
258
263
|
preview_improved: {
|
|
259
264
|
id: 'fabric.linking.preview_improved',
|
|
260
265
|
defaultMessage: 'Open preview',
|
|
@@ -22,49 +22,44 @@ export var AISummaryService = /*#__PURE__*/function () {
|
|
|
22
22
|
status: 'ready'
|
|
23
23
|
});
|
|
24
24
|
_defineProperty(this, "subscribedStateSetters", new Set());
|
|
25
|
-
_defineProperty(this, "fetchStream", /*#__PURE__*/function () {
|
|
26
|
-
var
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
summary_output_mimetype: 'text/markdown'
|
|
38
|
-
}
|
|
39
|
-
};
|
|
40
|
-
options = {
|
|
41
|
-
method: 'POST',
|
|
42
|
-
headers: _this.config.headers,
|
|
43
|
-
body: JSON.stringify(payload)
|
|
44
|
-
};
|
|
45
|
-
path = 'chat/v1/invoke_agent/stream';
|
|
46
|
-
requestUrl = addPath(_this.config.baseUrl, path);
|
|
47
|
-
_context.next = 6;
|
|
48
|
-
return fetch(requestUrl, options);
|
|
49
|
-
case 6:
|
|
50
|
-
response = _context.sent;
|
|
51
|
-
if (!(!response.ok || response.status >= 400)) {
|
|
52
|
-
_context.next = 11;
|
|
53
|
-
break;
|
|
25
|
+
_defineProperty(this, "fetchStream", /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
|
|
26
|
+
var payload, options, path, requestUrl, response;
|
|
27
|
+
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
28
|
+
while (1) switch (_context.prev = _context.next) {
|
|
29
|
+
case 0:
|
|
30
|
+
payload = {
|
|
31
|
+
recipient_agent_named_id: 'summary_agent',
|
|
32
|
+
agent_input_context: {
|
|
33
|
+
content_url: _this.url,
|
|
34
|
+
content_ari: _this.ari,
|
|
35
|
+
prompt_id: 'smart_links',
|
|
36
|
+
summary_output_mimetype: 'text/markdown'
|
|
54
37
|
}
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
38
|
+
};
|
|
39
|
+
options = {
|
|
40
|
+
method: 'POST',
|
|
41
|
+
headers: _this.config.headers,
|
|
42
|
+
body: JSON.stringify(payload)
|
|
43
|
+
};
|
|
44
|
+
path = 'chat/v1/invoke_agent/stream';
|
|
45
|
+
requestUrl = addPath(_this.config.baseUrl, path);
|
|
46
|
+
_context.next = 6;
|
|
47
|
+
return fetch(requestUrl, options);
|
|
48
|
+
case 6:
|
|
49
|
+
response = _context.sent;
|
|
50
|
+
if (!(!response.ok || response.status >= 400)) {
|
|
51
|
+
_context.next = 11;
|
|
52
|
+
break;
|
|
53
|
+
}
|
|
54
|
+
throw new Error("Status: ".concat(response.status, "\n URL: ").concat(_this.url, "\n StatusText ").concat(response.statusText));
|
|
55
|
+
case 11:
|
|
56
|
+
return _context.abrupt("return", readStream(response));
|
|
57
|
+
case 12:
|
|
58
|
+
case "end":
|
|
59
|
+
return _context.stop();
|
|
60
|
+
}
|
|
61
|
+
}, _callee);
|
|
62
|
+
})));
|
|
68
63
|
var defaultConfig = {
|
|
69
64
|
baseUrl: '/gateway/api/assist',
|
|
70
65
|
headers: {
|
|
@@ -88,35 +83,10 @@ export var AISummaryService = /*#__PURE__*/function () {
|
|
|
88
83
|
key: "summariseUrl",
|
|
89
84
|
value: function () {
|
|
90
85
|
var _summariseUrl = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
|
|
91
|
-
var
|
|
92
|
-
_iterator2,
|
|
93
|
-
_step2,
|
|
94
|
-
_subscriber,
|
|
95
|
-
id,
|
|
96
|
-
_this$onStart,
|
|
97
|
-
_this$onSuccess,
|
|
98
|
-
stream,
|
|
99
|
-
bufferContent,
|
|
100
|
-
_iteratorAbruptCompletion,
|
|
101
|
-
_didIteratorError,
|
|
102
|
-
_iteratorError,
|
|
103
|
-
_iterator,
|
|
104
|
-
_step,
|
|
105
|
-
chunk,
|
|
106
|
-
_iterator3,
|
|
107
|
-
_step3,
|
|
108
|
-
subscriber,
|
|
109
|
-
_chunk$message,
|
|
110
|
-
_this$onError,
|
|
111
|
-
message,
|
|
112
|
-
_iterator4,
|
|
113
|
-
_step4,
|
|
114
|
-
_subscriber2,
|
|
115
|
-
_args2 = arguments;
|
|
86
|
+
var _iterator2, _step2, _subscriber, id, _this$onStart, _this$onSuccess, stream, bufferContent, _iteratorAbruptCompletion, _didIteratorError, _iteratorError, _iterator, _step, chunk, _iterator3, _step3, subscriber, _chunk$message, _this$onError, message, _iterator4, _step4, _subscriber2;
|
|
116
87
|
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
|
|
117
88
|
while (1) switch (_context2.prev = _context2.next) {
|
|
118
89
|
case 0:
|
|
119
|
-
summaryStyle = _args2.length > 0 && _args2[0] !== undefined ? _args2[0] : 'medium';
|
|
120
90
|
this.state = {
|
|
121
91
|
status: 'loading',
|
|
122
92
|
content: ''
|
|
@@ -133,23 +103,23 @@ export var AISummaryService = /*#__PURE__*/function () {
|
|
|
133
103
|
_iterator2.f();
|
|
134
104
|
}
|
|
135
105
|
id = uuid();
|
|
136
|
-
_context2.prev =
|
|
106
|
+
_context2.prev = 4;
|
|
137
107
|
(_this$onStart = this.onStart) === null || _this$onStart === void 0 || _this$onStart.call(this, id);
|
|
138
|
-
_context2.next =
|
|
139
|
-
return this.fetchStream(
|
|
140
|
-
case
|
|
108
|
+
_context2.next = 8;
|
|
109
|
+
return this.fetchStream();
|
|
110
|
+
case 8:
|
|
141
111
|
stream = _context2.sent;
|
|
142
112
|
bufferContent = '';
|
|
143
113
|
_iteratorAbruptCompletion = false;
|
|
144
114
|
_didIteratorError = false;
|
|
145
|
-
_context2.prev =
|
|
115
|
+
_context2.prev = 12;
|
|
146
116
|
_iterator = _asyncIterator(stream);
|
|
147
|
-
case
|
|
148
|
-
_context2.next =
|
|
117
|
+
case 14:
|
|
118
|
+
_context2.next = 16;
|
|
149
119
|
return _iterator.next();
|
|
150
|
-
case
|
|
120
|
+
case 16:
|
|
151
121
|
if (!(_iteratorAbruptCompletion = !(_step = _context2.sent).done)) {
|
|
152
|
-
_context2.next =
|
|
122
|
+
_context2.next = 25;
|
|
153
123
|
break;
|
|
154
124
|
}
|
|
155
125
|
chunk = _step.value;
|
|
@@ -175,53 +145,53 @@ export var AISummaryService = /*#__PURE__*/function () {
|
|
|
175
145
|
bufferContent = chunk.message.message.content;
|
|
176
146
|
}
|
|
177
147
|
if (!(chunk.type === 'ERROR')) {
|
|
178
|
-
_context2.next =
|
|
148
|
+
_context2.next = 22;
|
|
179
149
|
break;
|
|
180
150
|
}
|
|
181
151
|
throw new Error(chunk === null || chunk === void 0 || (_chunk$message = chunk.message) === null || _chunk$message === void 0 ? void 0 : _chunk$message.message_template);
|
|
182
|
-
case
|
|
152
|
+
case 22:
|
|
183
153
|
_iteratorAbruptCompletion = false;
|
|
184
|
-
_context2.next =
|
|
154
|
+
_context2.next = 14;
|
|
185
155
|
break;
|
|
186
|
-
case
|
|
187
|
-
_context2.next =
|
|
156
|
+
case 25:
|
|
157
|
+
_context2.next = 31;
|
|
188
158
|
break;
|
|
189
|
-
case
|
|
190
|
-
_context2.prev =
|
|
191
|
-
_context2.t0 = _context2["catch"](
|
|
159
|
+
case 27:
|
|
160
|
+
_context2.prev = 27;
|
|
161
|
+
_context2.t0 = _context2["catch"](12);
|
|
192
162
|
_didIteratorError = true;
|
|
193
163
|
_iteratorError = _context2.t0;
|
|
194
|
-
case
|
|
164
|
+
case 31:
|
|
165
|
+
_context2.prev = 31;
|
|
195
166
|
_context2.prev = 32;
|
|
196
|
-
_context2.prev = 33;
|
|
197
167
|
if (!(_iteratorAbruptCompletion && _iterator.return != null)) {
|
|
198
|
-
_context2.next =
|
|
168
|
+
_context2.next = 36;
|
|
199
169
|
break;
|
|
200
170
|
}
|
|
201
|
-
_context2.next =
|
|
171
|
+
_context2.next = 36;
|
|
202
172
|
return _iterator.return();
|
|
203
|
-
case
|
|
204
|
-
_context2.prev =
|
|
173
|
+
case 36:
|
|
174
|
+
_context2.prev = 36;
|
|
205
175
|
if (!_didIteratorError) {
|
|
206
|
-
_context2.next =
|
|
176
|
+
_context2.next = 39;
|
|
207
177
|
break;
|
|
208
178
|
}
|
|
209
179
|
throw _iteratorError;
|
|
180
|
+
case 39:
|
|
181
|
+
return _context2.finish(36);
|
|
210
182
|
case 40:
|
|
211
|
-
return _context2.finish(
|
|
183
|
+
return _context2.finish(31);
|
|
212
184
|
case 41:
|
|
213
|
-
return _context2.finish(32);
|
|
214
|
-
case 42:
|
|
215
185
|
(_this$onSuccess = this.onSuccess) === null || _this$onSuccess === void 0 || _this$onSuccess.call(this, id);
|
|
216
186
|
this.state = {
|
|
217
187
|
status: 'done',
|
|
218
188
|
content: bufferContent
|
|
219
189
|
};
|
|
220
|
-
_context2.next =
|
|
190
|
+
_context2.next = 50;
|
|
221
191
|
break;
|
|
222
|
-
case
|
|
223
|
-
_context2.prev =
|
|
224
|
-
_context2.t1 = _context2["catch"](
|
|
192
|
+
case 45:
|
|
193
|
+
_context2.prev = 45;
|
|
194
|
+
_context2.t1 = _context2["catch"](4);
|
|
225
195
|
message = _context2.t1 instanceof Error && this.isExpectedError(_context2.t1.message) ? _context2.t1.message : 'UNEXPECTED';
|
|
226
196
|
(_this$onError = this.onError) === null || _this$onError === void 0 || _this$onError.call(this, id, message);
|
|
227
197
|
this.state = {
|
|
@@ -229,7 +199,7 @@ export var AISummaryService = /*#__PURE__*/function () {
|
|
|
229
199
|
content: '',
|
|
230
200
|
error: message
|
|
231
201
|
};
|
|
232
|
-
case
|
|
202
|
+
case 50:
|
|
233
203
|
_iterator4 = _createForOfIteratorHelper(this.subscribedStateSetters);
|
|
234
204
|
try {
|
|
235
205
|
for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
|
|
@@ -241,11 +211,11 @@ export var AISummaryService = /*#__PURE__*/function () {
|
|
|
241
211
|
} finally {
|
|
242
212
|
_iterator4.f();
|
|
243
213
|
}
|
|
244
|
-
case
|
|
214
|
+
case 52:
|
|
245
215
|
case "end":
|
|
246
216
|
return _context2.stop();
|
|
247
217
|
}
|
|
248
|
-
}, _callee2, this, [[
|
|
218
|
+
}, _callee2, this, [[4, 45], [12, 27, 31, 41], [32,, 36, 40]]);
|
|
249
219
|
}));
|
|
250
220
|
function summariseUrl() {
|
|
251
221
|
return _summariseUrl.apply(this, arguments);
|
|
@@ -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.52.
|
|
18
|
+
packageVersion: "26.52.3"
|
|
19
19
|
};
|
|
20
20
|
export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
|
|
21
21
|
TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
|