@atlaskit/smart-card 25.6.1 → 25.7.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +17 -0
- package/dist/cjs/messages.js +20 -0
- package/dist/cjs/state/flexible-ui-context/index.js +13 -2
- package/dist/cjs/state/hooks/use-invoke/types.js +1 -17
- package/dist/cjs/version.json +1 -1
- package/dist/cjs/view/CardWithUrl/component.js +2 -1
- package/dist/cjs/view/FlexibleCard/components/blocks/action-group/index.js +4 -2
- package/dist/cjs/view/FlexibleCard/components/common/lozenge-action/index.js +42 -31
- package/dist/cjs/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/index.js +33 -12
- package/dist/cjs/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/styled.js +21 -0
- package/dist/cjs/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/types.js +15 -1
- package/dist/cjs/view/FlexibleCard/components/container/index.js +7 -3
- package/dist/cjs/view/FlexibleCard/components/elements/lozenge/index.js +4 -1
- package/dist/cjs/view/FlexibleCard/index.js +5 -2
- package/dist/cjs/view/HoverCard/components/HoverCardComponent.js +6 -3
- package/dist/cjs/view/HoverCard/components/HoverCardContent.js +3 -1
- package/dist/cjs/view/HoverCard/styled.js +6 -2
- package/dist/cjs/view/InlineCard/ResolvedView/index.js +4 -1
- package/dist/cjs/view/InlineCard/index.js +3 -1
- package/dist/es2019/messages.js +20 -0
- package/dist/es2019/state/flexible-ui-context/index.js +8 -1
- package/dist/es2019/state/hooks/use-invoke/types.js +1 -15
- package/dist/es2019/version.json +1 -1
- package/dist/es2019/view/CardWithUrl/component.js +2 -1
- package/dist/es2019/view/FlexibleCard/components/blocks/action-group/index.js +5 -3
- package/dist/es2019/view/FlexibleCard/components/common/lozenge-action/index.js +22 -13
- package/dist/es2019/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/index.js +30 -7
- package/dist/es2019/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/styled.js +41 -0
- package/dist/es2019/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/types.js +12 -1
- package/dist/es2019/view/FlexibleCard/components/container/index.js +5 -2
- package/dist/es2019/view/FlexibleCard/components/elements/lozenge/index.js +4 -1
- package/dist/es2019/view/FlexibleCard/index.js +6 -3
- package/dist/es2019/view/HoverCard/components/HoverCardComponent.js +6 -4
- package/dist/es2019/view/HoverCard/components/HoverCardContent.js +3 -1
- package/dist/es2019/view/HoverCard/styled.js +4 -1
- package/dist/es2019/view/InlineCard/ResolvedView/index.js +3 -1
- package/dist/es2019/view/InlineCard/index.js +3 -1
- package/dist/esm/messages.js +20 -0
- package/dist/esm/state/flexible-ui-context/index.js +9 -0
- package/dist/esm/state/hooks/use-invoke/types.js +1 -15
- package/dist/esm/version.json +1 -1
- package/dist/esm/view/CardWithUrl/component.js +2 -1
- package/dist/esm/view/FlexibleCard/components/blocks/action-group/index.js +5 -3
- package/dist/esm/view/FlexibleCard/components/common/lozenge-action/index.js +42 -31
- package/dist/esm/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/index.js +30 -8
- package/dist/esm/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/styled.js +11 -0
- package/dist/esm/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/types.js +12 -1
- package/dist/esm/view/FlexibleCard/components/container/index.js +7 -3
- package/dist/esm/view/FlexibleCard/components/elements/lozenge/index.js +4 -1
- package/dist/esm/view/FlexibleCard/index.js +6 -3
- package/dist/esm/view/HoverCard/components/HoverCardComponent.js +7 -4
- package/dist/esm/view/HoverCard/components/HoverCardContent.js +3 -1
- package/dist/esm/view/HoverCard/styled.js +4 -1
- package/dist/esm/view/InlineCard/ResolvedView/index.js +4 -1
- package/dist/esm/view/InlineCard/index.js +3 -1
- package/dist/types/__fixtures__/bitbucket-pull-request.d.ts +73 -0
- package/dist/types/__fixtures__/confluence-blog.d.ts +49 -0
- package/dist/types/__fixtures__/confluence-page.d.ts +49 -0
- package/dist/types/__fixtures__/confluence-space.d.ts +36 -0
- package/dist/types/__fixtures__/confluence-template.d.ts +31 -0
- package/dist/types/__fixtures__/figma.d.ts +43 -0
- package/dist/types/__fixtures__/jira-roadmap.d.ts +35 -0
- package/dist/types/__fixtures__/jira-task.d.ts +78 -0
- package/dist/types/__fixtures__/youtube-video.d.ts +44 -0
- package/dist/types/messages.d.ts +1 -1
- package/dist/types/state/flexible-ui-context/index.d.ts +7 -0
- package/dist/types/state/hooks/use-invoke/types.d.ts +0 -4
- package/dist/types/view/Card/index.d.ts +1 -1
- package/dist/types/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/styled.d.ts +3 -0
- package/dist/types/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/types.d.ts +14 -2
- package/dist/types/view/FlexibleCard/components/common/lozenge-action/types.d.ts +1 -0
- package/dist/types/view/FlexibleCard/components/container/types.d.ts +2 -13
- package/dist/types/view/FlexibleCard/types.d.ts +8 -3
- package/dist/types/view/HoverCard/index.d.ts +1 -1
- package/dist/types/view/HoverCard/styled.d.ts +1 -0
- package/dist/types/view/HoverCard/types.d.ts +5 -0
- package/dist/types/view/InlineCard/ResolvedView/index.d.ts +2 -0
- package/dist/types/view/InlineCard/types.d.ts +1 -0
- package/package.json +2 -2
- package/report.api.md +2 -1
- package/tmp/api-report-tmp.d.ts +2 -1
|
@@ -13,10 +13,10 @@ import LozengeActionError from './lozenge-action-error';
|
|
|
13
13
|
import withErrorBoundary from './error-boundary';
|
|
14
14
|
import { dropdownItemGroupStyles } from './styled';
|
|
15
15
|
import useInvoke from '../../../../../state/hooks/use-invoke';
|
|
16
|
-
import { InvokeActionError } from '../../../../../state/hooks/use-invoke/types';
|
|
17
16
|
import extractLozengeActionItems from '../../../../../extractors/action/extract-lozenge-action-items';
|
|
18
17
|
import createStatusUpdateRequest from '../../../../../utils/actions/create-status-update-request';
|
|
19
18
|
import useResolve from '../../../../../state/hooks/use-resolve';
|
|
19
|
+
import { LozengeActionErrorMessages } from './lozenge-action-error/types';
|
|
20
20
|
var validateItems = function validateItems() {
|
|
21
21
|
var items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
22
22
|
var text = arguments.length > 1 ? arguments[1] : undefined;
|
|
@@ -24,12 +24,16 @@ var validateItems = function validateItems() {
|
|
|
24
24
|
return item.text !== text;
|
|
25
25
|
});
|
|
26
26
|
};
|
|
27
|
+
var isInvokeCustomError = function isInvokeCustomError(err) {
|
|
28
|
+
return err.message !== undefined && err.errorCode !== undefined;
|
|
29
|
+
};
|
|
27
30
|
var LozengeAction = function LozengeAction(_ref) {
|
|
28
31
|
var action = _ref.action,
|
|
29
32
|
appearance = _ref.appearance,
|
|
30
33
|
_ref$testId = _ref.testId,
|
|
31
34
|
testId = _ref$testId === void 0 ? 'smart-element-lozenge-action' : _ref$testId,
|
|
32
|
-
text = _ref.text
|
|
35
|
+
text = _ref.text,
|
|
36
|
+
zIndex = _ref.zIndex;
|
|
33
37
|
var _useState = useState(false),
|
|
34
38
|
_useState2 = _slicedToArray(_useState, 2),
|
|
35
39
|
isLoaded = _useState2[0],
|
|
@@ -48,8 +52,8 @@ var LozengeAction = function LozengeAction(_ref) {
|
|
|
48
52
|
setItems = _useState8[1];
|
|
49
53
|
var _useState9 = useState(),
|
|
50
54
|
_useState10 = _slicedToArray(_useState9, 2),
|
|
51
|
-
|
|
52
|
-
|
|
55
|
+
errorMessage = _useState10[0],
|
|
56
|
+
setErrorMessage = _useState10[1];
|
|
53
57
|
var invoke = useInvoke();
|
|
54
58
|
var reload = useResolve();
|
|
55
59
|
var handleOpenChange = useCallback( /*#__PURE__*/function () {
|
|
@@ -61,7 +65,7 @@ var LozengeAction = function LozengeAction(_ref) {
|
|
|
61
65
|
case 0:
|
|
62
66
|
setIsOpen(args.isOpen);
|
|
63
67
|
if (!(args.isOpen && !isLoaded && action !== null && action !== void 0 && action.read)) {
|
|
64
|
-
_context.next =
|
|
68
|
+
_context.next = 20;
|
|
65
69
|
break;
|
|
66
70
|
}
|
|
67
71
|
_context.prev = 2;
|
|
@@ -74,29 +78,30 @@ var LozengeAction = function LozengeAction(_ref) {
|
|
|
74
78
|
setItems(validItems);
|
|
75
79
|
setIsLoaded(true);
|
|
76
80
|
if ((validItems === null || validItems === void 0 ? void 0 : validItems.length) === 0) {
|
|
77
|
-
|
|
81
|
+
setErrorMessage(LozengeActionErrorMessages.noData);
|
|
82
|
+
setIsLoaded(false);
|
|
78
83
|
}
|
|
79
|
-
_context.next =
|
|
84
|
+
_context.next = 17;
|
|
80
85
|
break;
|
|
81
86
|
case 13:
|
|
82
87
|
_context.prev = 13;
|
|
83
88
|
_context.t0 = _context["catch"](2);
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
case
|
|
87
|
-
_context.prev =
|
|
89
|
+
setErrorMessage(LozengeActionErrorMessages.unknown);
|
|
90
|
+
setIsLoaded(false);
|
|
91
|
+
case 17:
|
|
92
|
+
_context.prev = 17;
|
|
88
93
|
setIsLoading(false);
|
|
89
|
-
return _context.finish(
|
|
90
|
-
case
|
|
94
|
+
return _context.finish(17);
|
|
95
|
+
case 20:
|
|
91
96
|
if (!args.isOpen) {
|
|
92
|
-
|
|
97
|
+
setErrorMessage(undefined);
|
|
93
98
|
}
|
|
94
|
-
case
|
|
99
|
+
case 21:
|
|
95
100
|
case "end":
|
|
96
101
|
return _context.stop();
|
|
97
102
|
}
|
|
98
103
|
}
|
|
99
|
-
}, _callee, null, [[2, 13,
|
|
104
|
+
}, _callee, null, [[2, 13, 17, 20]]);
|
|
100
105
|
}));
|
|
101
106
|
return function (_x) {
|
|
102
107
|
return _ref2.apply(this, arguments);
|
|
@@ -119,7 +124,7 @@ var LozengeAction = function LozengeAction(_ref) {
|
|
|
119
124
|
_context2.prev = 0;
|
|
120
125
|
updateAction = action === null || action === void 0 ? void 0 : action.update;
|
|
121
126
|
if (!(updateAction && id)) {
|
|
122
|
-
_context2.next =
|
|
127
|
+
_context2.next = 15;
|
|
123
128
|
break;
|
|
124
129
|
}
|
|
125
130
|
setIsLoading(true);
|
|
@@ -128,38 +133,43 @@ var LozengeAction = function LozengeAction(_ref) {
|
|
|
128
133
|
return invoke(request);
|
|
129
134
|
case 7:
|
|
130
135
|
setIsLoading(false);
|
|
136
|
+
setIsLoaded(false);
|
|
131
137
|
setIsOpen(false);
|
|
138
|
+
setItems([]);
|
|
132
139
|
_ref4 = updateAction.details || {}, url = _ref4.url, linkId = _ref4.id;
|
|
133
140
|
if (!url) {
|
|
134
|
-
_context2.next =
|
|
141
|
+
_context2.next = 15;
|
|
135
142
|
break;
|
|
136
143
|
}
|
|
137
|
-
_context2.next =
|
|
144
|
+
_context2.next = 15;
|
|
138
145
|
return reload(url, true, undefined, linkId);
|
|
139
|
-
case 13:
|
|
140
|
-
_context2.next = 19;
|
|
141
|
-
break;
|
|
142
146
|
case 15:
|
|
143
|
-
_context2.
|
|
147
|
+
_context2.next = 21;
|
|
148
|
+
break;
|
|
149
|
+
case 17:
|
|
150
|
+
_context2.prev = 17;
|
|
144
151
|
_context2.t0 = _context2["catch"](0);
|
|
145
|
-
// TODO: EDM-6261: Error state
|
|
146
152
|
setIsLoading(false);
|
|
147
|
-
|
|
148
|
-
|
|
153
|
+
if (isInvokeCustomError(_context2.t0)) {
|
|
154
|
+
setErrorMessage(_context2.t0.message);
|
|
155
|
+
} else {
|
|
156
|
+
setErrorMessage(LozengeActionErrorMessages.updateFailed);
|
|
157
|
+
}
|
|
158
|
+
case 21:
|
|
149
159
|
case "end":
|
|
150
160
|
return _context2.stop();
|
|
151
161
|
}
|
|
152
162
|
}
|
|
153
|
-
}, _callee2, null, [[0,
|
|
163
|
+
}, _callee2, null, [[0, 17]]);
|
|
154
164
|
}));
|
|
155
165
|
return function (_x2) {
|
|
156
166
|
return _ref3.apply(this, arguments);
|
|
157
167
|
};
|
|
158
168
|
}(), [action === null || action === void 0 ? void 0 : action.update, invoke, reload]);
|
|
159
169
|
var dropdownItemGroup = useMemo(function () {
|
|
160
|
-
if (
|
|
170
|
+
if (errorMessage) {
|
|
161
171
|
return jsx(LozengeActionError, {
|
|
162
|
-
|
|
172
|
+
errorMessage: errorMessage,
|
|
163
173
|
testId: testId
|
|
164
174
|
});
|
|
165
175
|
}
|
|
@@ -175,13 +185,14 @@ var LozengeAction = function LozengeAction(_ref) {
|
|
|
175
185
|
}));
|
|
176
186
|
})));
|
|
177
187
|
}
|
|
178
|
-
}, [
|
|
188
|
+
}, [errorMessage, handleItemClick, items, testId]);
|
|
179
189
|
return jsx(DropdownMenu, {
|
|
180
190
|
isLoading: isLoading,
|
|
181
191
|
isOpen: isOpen,
|
|
182
192
|
onOpenChange: handleOpenChange,
|
|
183
193
|
testId: testId,
|
|
184
|
-
trigger: trigger
|
|
194
|
+
trigger: trigger,
|
|
195
|
+
zIndex: zIndex
|
|
185
196
|
}, dropdownItemGroup);
|
|
186
197
|
};
|
|
187
198
|
export default withErrorBoundary(LozengeAction);
|
package/dist/esm/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/index.js
CHANGED
|
@@ -1,14 +1,36 @@
|
|
|
1
|
-
|
|
1
|
+
/** @jsx jsx */
|
|
2
|
+
import { jsx } from '@emotion/react';
|
|
3
|
+
import { Fragment, useMemo } from 'react';
|
|
2
4
|
import { DropdownItem, DropdownItemGroup } from '@atlaskit/dropdown-menu';
|
|
5
|
+
import { R50, R500 } from '@atlaskit/theme/colors';
|
|
6
|
+
import ErrorIcon from '@atlaskit/icon/glyph/error';
|
|
7
|
+
import { dropdownItemGroupStyles, contentStyles, textStyles } from './styled';
|
|
8
|
+
import { getFormattedMessage } from '../../../utils';
|
|
9
|
+
var MAX_LINE_NUMBER = 8;
|
|
3
10
|
var LozengeActionError = function LozengeActionError(_ref) {
|
|
4
|
-
var
|
|
5
|
-
testId = _ref.testId
|
|
6
|
-
|
|
11
|
+
var errorMessage = _ref.errorMessage,
|
|
12
|
+
testId = _ref.testId,
|
|
13
|
+
_ref$maxLineNumber = _ref.maxLineNumber,
|
|
14
|
+
maxLineNumber = _ref$maxLineNumber === void 0 ? MAX_LINE_NUMBER : _ref$maxLineNumber;
|
|
7
15
|
var content = useMemo(function () {
|
|
8
|
-
return
|
|
9
|
-
|
|
10
|
-
|
|
16
|
+
return jsx(Fragment, null, jsx("div", {
|
|
17
|
+
css: contentStyles
|
|
18
|
+
}, jsx(ErrorIcon, {
|
|
19
|
+
testId: "".concat(testId, "-icon"),
|
|
20
|
+
size: "medium",
|
|
21
|
+
primaryColor: "var(--ds-icon-danger, ".concat(R500, ")"),
|
|
22
|
+
secondaryColor: "var(--ds-background-danger, ".concat(R50, ")"),
|
|
23
|
+
label: 'error'
|
|
24
|
+
}), jsx("span", {
|
|
25
|
+
css: textStyles(maxLineNumber),
|
|
26
|
+
"data-testid": "".concat(testId, "-error-message")
|
|
27
|
+
}, typeof errorMessage === 'string' ? errorMessage : getFormattedMessage(errorMessage))));
|
|
28
|
+
}, [errorMessage, maxLineNumber, testId]);
|
|
29
|
+
return jsx("span", {
|
|
30
|
+
css: dropdownItemGroupStyles,
|
|
31
|
+
"data-testid": "".concat(testId, "-error-item-group")
|
|
32
|
+
}, jsx(DropdownItemGroup, null, jsx(DropdownItem, {
|
|
11
33
|
testId: "".concat(testId, "-error")
|
|
12
|
-
}, content));
|
|
34
|
+
}, content)));
|
|
13
35
|
};
|
|
14
36
|
export default LozengeActionError;
|
package/dist/esm/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/styled.js
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
|
|
2
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
3
|
+
import { css } from '@emotion/react';
|
|
4
|
+
import { N800 } from '@atlaskit/theme/colors';
|
|
5
|
+
import { getTruncateStyles } from '../../../utils';
|
|
6
|
+
export var dropdownItemGroupStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n button {\n width: 220px;\n\n &:hover {\n background-color: inherit;\n cursor: default;\n }\n }\n"])));
|
|
7
|
+
var sharedBlockStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n gap: 0.5rem;\n line-height: 1rem;\n min-width: 0;\n overflow: hidden;\n flex-direction: row;\n align-items: center;\n"])));
|
|
8
|
+
export var contentStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n ", ";\n\n margin-top: 2px;\n align-items: flex-start;\n\n > span,\n > div {\n &[data-smart-element-text] {\n font-size: 0.875rem;\n color: ", ";\n }\n }\n"])), sharedBlockStyles, "var(--ds-text, ".concat(N800, ")"));
|
|
9
|
+
export var textStyles = function textStyles(maxLines) {
|
|
10
|
+
return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n line-height: 1rem;\n white-space: normal;\n ", ";\n"])), getTruncateStyles(maxLines));
|
|
11
|
+
};
|
package/dist/esm/view/FlexibleCard/components/common/lozenge-action/lozenge-action-error/types.js
CHANGED
|
@@ -1 +1,12 @@
|
|
|
1
|
-
|
|
1
|
+
import { messages } from '../../../../../../messages';
|
|
2
|
+
export var LozengeActionErrorMessages = {
|
|
3
|
+
noData: {
|
|
4
|
+
descriptor: messages['status_change_permission_error']
|
|
5
|
+
},
|
|
6
|
+
unknown: {
|
|
7
|
+
descriptor: messages['status_change_load_error']
|
|
8
|
+
},
|
|
9
|
+
updateFailed: {
|
|
10
|
+
descriptor: messages['status_change_update_error']
|
|
11
|
+
}
|
|
12
|
+
};
|
|
@@ -71,6 +71,7 @@ export var getContainerStyles = function getContainerStyles(size, hideBackground
|
|
|
71
71
|
};
|
|
72
72
|
var renderChildren = function renderChildren(children, containerSize, containerTheme, status, retry, onClick, onActionMenuOpenChange) {
|
|
73
73
|
return React.Children.map(children, function (child) {
|
|
74
|
+
// TODO: EDM-6468: Use useFlexibleUiOptionContext for rendering options inside block/element instead
|
|
74
75
|
if ( /*#__PURE__*/React.isValidElement(child) && isFlexibleUiBlock(child)) {
|
|
75
76
|
var blockSize = child.props.size;
|
|
76
77
|
var size = blockSize || containerSize;
|
|
@@ -141,10 +142,12 @@ var Container = function Container(_ref3) {
|
|
|
141
142
|
hideHoverCardPreviewButton = _ref3$hideHoverCardPr === void 0 ? false : _ref3$hideHoverCardPr,
|
|
142
143
|
_ref3$hidePadding = _ref3.hidePadding,
|
|
143
144
|
hidePadding = _ref3$hidePadding === void 0 ? false : _ref3$hidePadding,
|
|
144
|
-
_ref3$showHoverPrevie = _ref3.showHoverPreview,
|
|
145
|
-
showHoverPreview = _ref3$showHoverPrevie === void 0 ? false : _ref3$showHoverPrevie,
|
|
146
145
|
onClick = _ref3.onClick,
|
|
147
146
|
retry = _ref3.retry,
|
|
147
|
+
_ref3$showHoverPrevie = _ref3.showHoverPreview,
|
|
148
|
+
showHoverPreview = _ref3$showHoverPrevie === void 0 ? false : _ref3$showHoverPrevie,
|
|
149
|
+
_ref3$showServerActio = _ref3.showServerActions,
|
|
150
|
+
showServerActions = _ref3$showServerActio === void 0 ? false : _ref3$showServerActio,
|
|
148
151
|
_ref3$size = _ref3.size,
|
|
149
152
|
size = _ref3$size === void 0 ? SmartLinkSize.Medium : _ref3$size,
|
|
150
153
|
status = _ref3.status,
|
|
@@ -171,7 +174,8 @@ var Container = function Container(_ref3) {
|
|
|
171
174
|
url: context === null || context === void 0 ? void 0 : context.url,
|
|
172
175
|
canOpen: hoverCardCanOpen,
|
|
173
176
|
closeOnChildClick: true,
|
|
174
|
-
hidePreviewButton: hideHoverCardPreviewButton
|
|
177
|
+
hidePreviewButton: hideHoverCardPreviewButton,
|
|
178
|
+
showServerActions: showServerActions
|
|
175
179
|
}, containerContent);
|
|
176
180
|
}
|
|
177
181
|
return containerContent;
|
|
@@ -6,6 +6,7 @@ import React, { useCallback, useState } from 'react';
|
|
|
6
6
|
import { css, jsx } from '@emotion/react';
|
|
7
7
|
import AtlaskitLozenge from '@atlaskit/lozenge';
|
|
8
8
|
import LozengeAction from '../../common/lozenge-action';
|
|
9
|
+
import { useFlexibleUiOptionContext } from '../../../../../state/flexible-ui-context';
|
|
9
10
|
var styles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: inline-flex;\n line-height: inherit;\n"])));
|
|
10
11
|
var actionStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n overflow: visible;\n"])));
|
|
11
12
|
|
|
@@ -25,6 +26,7 @@ var Lozenge = function Lozenge(_ref) {
|
|
|
25
26
|
text = _ref.text,
|
|
26
27
|
_ref$testId = _ref.testId,
|
|
27
28
|
testId = _ref$testId === void 0 ? 'smart-element-lozenge' : _ref$testId;
|
|
29
|
+
var ui = useFlexibleUiOptionContext();
|
|
28
30
|
var _useState = useState(false),
|
|
29
31
|
_useState2 = _slicedToArray(_useState, 2),
|
|
30
32
|
isBold = _useState2[0],
|
|
@@ -47,7 +49,8 @@ var Lozenge = function Lozenge(_ref) {
|
|
|
47
49
|
action: action,
|
|
48
50
|
appearance: appearance,
|
|
49
51
|
testId: testId,
|
|
50
|
-
text: text
|
|
52
|
+
text: text,
|
|
53
|
+
zIndex: ui === null || ui === void 0 ? void 0 : ui.zIndex
|
|
51
54
|
}) : jsx(AtlaskitLozenge, {
|
|
52
55
|
appearance: appearance,
|
|
53
56
|
isBold: isBold,
|
|
@@ -3,7 +3,7 @@ import React, { useEffect, useMemo } from 'react';
|
|
|
3
3
|
import { useFeatureFlag } from '@atlaskit/link-provider';
|
|
4
4
|
import { SmartLinkStatus } from '../../constants';
|
|
5
5
|
import Container from './components/container';
|
|
6
|
-
import { FlexibleUiAnalyticsContext, FlexibleUiContext } from '../../state/flexible-ui-context';
|
|
6
|
+
import { FlexibleUiAnalyticsContext, FlexibleUiContext, FlexibleUiOptionContext } from '../../state/flexible-ui-context';
|
|
7
7
|
import { getContextByStatus, getRetryOptions } from './utils';
|
|
8
8
|
|
|
9
9
|
/**
|
|
@@ -76,15 +76,18 @@ var FlexibleCard = function FlexibleCard(_ref) {
|
|
|
76
76
|
}, [onError, onResolve, status, title, url]);
|
|
77
77
|
return /*#__PURE__*/React.createElement(FlexibleUiAnalyticsContext.Provider, {
|
|
78
78
|
value: analytics
|
|
79
|
+
}, /*#__PURE__*/React.createElement(FlexibleUiOptionContext.Provider, {
|
|
80
|
+
value: ui
|
|
79
81
|
}, /*#__PURE__*/React.createElement(FlexibleUiContext.Provider, {
|
|
80
82
|
value: context
|
|
81
83
|
}, /*#__PURE__*/React.createElement(Container, _extends({
|
|
82
84
|
testId: testId
|
|
83
85
|
}, ui, {
|
|
84
|
-
showHoverPreview: showHoverPreview,
|
|
85
86
|
onClick: onClick,
|
|
86
87
|
retry: retry,
|
|
88
|
+
showHoverPreview: showHoverPreview,
|
|
89
|
+
showServerActions: showServerActions,
|
|
87
90
|
status: status
|
|
88
|
-
}), children)));
|
|
91
|
+
}), children))));
|
|
89
92
|
};
|
|
90
93
|
export default FlexibleCard;
|
|
@@ -8,7 +8,7 @@ import { useSmartLinkActions } from '../../../state/hooks-external/useSmartLinkA
|
|
|
8
8
|
import { useSmartLinkRenderers } from '../../../state/renderers';
|
|
9
9
|
import { useSmartCardState as useLinkState } from '../../../state/store';
|
|
10
10
|
import HoverCardContent from '../components/HoverCardContent';
|
|
11
|
-
import { CARD_GAP_PX } from '../styled';
|
|
11
|
+
import { CARD_GAP_PX, HOVER_CARD_Z_INDEX } from '../styled';
|
|
12
12
|
import { CardDisplay } from '../../../constants';
|
|
13
13
|
export var HoverCardComponent = function HoverCardComponent(_ref) {
|
|
14
14
|
var children = _ref.children,
|
|
@@ -20,7 +20,9 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
|
|
|
20
20
|
_ref$closeOnChildClic = _ref.closeOnChildClick,
|
|
21
21
|
closeOnChildClick = _ref$closeOnChildClic === void 0 ? false : _ref$closeOnChildClic,
|
|
22
22
|
_ref$hidePreviewButto = _ref.hidePreviewButton,
|
|
23
|
-
hidePreviewButton = _ref$hidePreviewButto === void 0 ? false : _ref$hidePreviewButto
|
|
23
|
+
hidePreviewButton = _ref$hidePreviewButto === void 0 ? false : _ref$hidePreviewButto,
|
|
24
|
+
_ref$showServerAction = _ref.showServerActions,
|
|
25
|
+
showServerActions = _ref$showServerAction === void 0 ? false : _ref$showServerAction;
|
|
24
26
|
var delay = 300;
|
|
25
27
|
var _React$useState = React.useState(false),
|
|
26
28
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
@@ -129,9 +131,10 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
|
|
|
129
131
|
onActionClick: onActionClick,
|
|
130
132
|
onResolve: update,
|
|
131
133
|
renderers: renderers,
|
|
134
|
+
showServerActions: showServerActions,
|
|
132
135
|
url: url
|
|
133
136
|
});
|
|
134
|
-
}, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, url]);
|
|
137
|
+
}, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url]);
|
|
135
138
|
var trigger = useCallback(function (triggerProps) {
|
|
136
139
|
return jsx("span", {
|
|
137
140
|
ref: parentSpan
|
|
@@ -152,6 +155,6 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
|
|
|
152
155
|
autoFocus: false,
|
|
153
156
|
content: content,
|
|
154
157
|
trigger: trigger,
|
|
155
|
-
zIndex:
|
|
158
|
+
zIndex: HOVER_CARD_Z_INDEX
|
|
156
159
|
});
|
|
157
160
|
};
|
|
@@ -89,7 +89,8 @@ var HoverCardContent = function HoverCardContent(_ref) {
|
|
|
89
89
|
renderers = _ref.renderers,
|
|
90
90
|
url = _ref.url,
|
|
91
91
|
onMouseEnter = _ref.onMouseEnter,
|
|
92
|
-
onMouseLeave = _ref.onMouseLeave
|
|
92
|
+
onMouseLeave = _ref.onMouseLeave,
|
|
93
|
+
showServerActions = _ref.showServerActions;
|
|
93
94
|
var _useAnalyticsEvents = useAnalyticsEvents(),
|
|
94
95
|
createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
|
|
95
96
|
var extensionKey = useMemo(function () {
|
|
@@ -130,6 +131,7 @@ var HoverCardContent = function HoverCardContent(_ref) {
|
|
|
130
131
|
onClick: onClick,
|
|
131
132
|
onResolve: onResolve,
|
|
132
133
|
renderers: renderers,
|
|
134
|
+
showServerActions: showServerActions,
|
|
133
135
|
ui: flexibleUiOptions,
|
|
134
136
|
url: url,
|
|
135
137
|
children: {}
|
|
@@ -3,6 +3,8 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
|
3
3
|
import { css } from '@emotion/react';
|
|
4
4
|
import { loadingPlaceholderClassName } from '../../index';
|
|
5
5
|
import { SmartLinkSize, SmartLinkTheme } from '../../constants';
|
|
6
|
+
// Temporary fix for Confluence inline comment on editor mod has z-index of 500, Jira issue view has z-index of 510
|
|
7
|
+
export var HOVER_CARD_Z_INDEX = 511;
|
|
6
8
|
export var flexibleUiOptions = {
|
|
7
9
|
hideBackground: true,
|
|
8
10
|
hideElevation: true,
|
|
@@ -10,7 +12,8 @@ export var flexibleUiOptions = {
|
|
|
10
12
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
11
13
|
theme: SmartLinkTheme.Black,
|
|
12
14
|
hidePadding: true,
|
|
13
|
-
hideHoverCardPreviewButton: false
|
|
15
|
+
hideHoverCardPreviewButton: false,
|
|
16
|
+
zIndex: HOVER_CARD_Z_INDEX + 1
|
|
14
17
|
};
|
|
15
18
|
export var CARD_WIDTH_REM = 24;
|
|
16
19
|
// gap between mouse cursor and hover card
|
|
@@ -47,7 +47,9 @@ export var InlineCardResolvedView = /*#__PURE__*/function (_React$Component) {
|
|
|
47
47
|
titleTextColor = _this$props.titleTextColor,
|
|
48
48
|
titlePrefix = _this$props.titlePrefix,
|
|
49
49
|
_this$props$showHover = _this$props.showHoverPreview,
|
|
50
|
-
showHoverPreview = _this$props$showHover === void 0 ? false : _this$props$showHover
|
|
50
|
+
showHoverPreview = _this$props$showHover === void 0 ? false : _this$props$showHover,
|
|
51
|
+
_this$props$showServe = _this$props.showServerActions,
|
|
52
|
+
showServerActions = _this$props$showServe === void 0 ? false : _this$props$showServe;
|
|
51
53
|
var inlineCardResolvedView = /*#__PURE__*/React.createElement(Frame, {
|
|
52
54
|
testId: testId,
|
|
53
55
|
link: link,
|
|
@@ -62,6 +64,7 @@ export var InlineCardResolvedView = /*#__PURE__*/function (_React$Component) {
|
|
|
62
64
|
if (showHoverPreview && link) {
|
|
63
65
|
return /*#__PURE__*/React.createElement(HoverCard, {
|
|
64
66
|
id: id,
|
|
67
|
+
showServerActions: showServerActions,
|
|
65
68
|
url: link
|
|
66
69
|
}, inlineCardResolvedView);
|
|
67
70
|
}
|
|
@@ -28,7 +28,8 @@ export var InlineCard = function InlineCard(_ref) {
|
|
|
28
28
|
testId = _ref.testId,
|
|
29
29
|
inlinePreloaderStyle = _ref.inlinePreloaderStyle,
|
|
30
30
|
showHoverPreview = _ref.showHoverPreview,
|
|
31
|
-
showAuthTooltip = _ref.showAuthTooltip
|
|
31
|
+
showAuthTooltip = _ref.showAuthTooltip,
|
|
32
|
+
showServerActions = _ref.showServerActions;
|
|
32
33
|
var status = cardState.status,
|
|
33
34
|
details = cardState.details;
|
|
34
35
|
var cardDetails = details && details.data || getEmptyJsonLd();
|
|
@@ -59,6 +60,7 @@ export var InlineCard = function InlineCard(_ref) {
|
|
|
59
60
|
return /*#__PURE__*/React.createElement(InlineCardResolvedView, _extends({}, resolvedProps, {
|
|
60
61
|
id: id,
|
|
61
62
|
showHoverPreview: showHoverPreview,
|
|
63
|
+
showServerActions: showServerActions,
|
|
62
64
|
link: url,
|
|
63
65
|
isSelected: isSelected,
|
|
64
66
|
onClick: handleFrameClick,
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
declare const _default: {
|
|
2
|
+
meta: {
|
|
3
|
+
visibility: string;
|
|
4
|
+
access: string;
|
|
5
|
+
resourceType: string;
|
|
6
|
+
key: string;
|
|
7
|
+
};
|
|
8
|
+
data: {
|
|
9
|
+
'@id': string;
|
|
10
|
+
'@context': {
|
|
11
|
+
'@vocab': string;
|
|
12
|
+
atlassian: string;
|
|
13
|
+
schema: string;
|
|
14
|
+
};
|
|
15
|
+
'@type': string[];
|
|
16
|
+
url: string;
|
|
17
|
+
attributedTo: {
|
|
18
|
+
'@type': string;
|
|
19
|
+
name: string;
|
|
20
|
+
icon: string;
|
|
21
|
+
};
|
|
22
|
+
'schema:dateCreated': string;
|
|
23
|
+
generator: {
|
|
24
|
+
'@type': string;
|
|
25
|
+
name: string;
|
|
26
|
+
icon: {
|
|
27
|
+
'@type': string;
|
|
28
|
+
url: string;
|
|
29
|
+
};
|
|
30
|
+
};
|
|
31
|
+
icon: {
|
|
32
|
+
'@type': string;
|
|
33
|
+
url: string;
|
|
34
|
+
};
|
|
35
|
+
name: string;
|
|
36
|
+
summary: string;
|
|
37
|
+
'atlassian:mergeSource': {
|
|
38
|
+
'@type': string;
|
|
39
|
+
href: string;
|
|
40
|
+
name: string;
|
|
41
|
+
};
|
|
42
|
+
'atlassian:mergeDestination': {
|
|
43
|
+
'@type': string;
|
|
44
|
+
href: string;
|
|
45
|
+
name: string;
|
|
46
|
+
};
|
|
47
|
+
updated: string;
|
|
48
|
+
'atlassian:internalId': string;
|
|
49
|
+
'atlassian:isMerged': boolean;
|
|
50
|
+
'atlassian:state': string;
|
|
51
|
+
'atlassian:reviewer': {
|
|
52
|
+
'@type': string;
|
|
53
|
+
name: string;
|
|
54
|
+
icon: string;
|
|
55
|
+
}[];
|
|
56
|
+
'atlassian:updatedBy': {
|
|
57
|
+
'@type': string;
|
|
58
|
+
name: string;
|
|
59
|
+
icon: string;
|
|
60
|
+
};
|
|
61
|
+
audience: {
|
|
62
|
+
'@type': string;
|
|
63
|
+
name: string;
|
|
64
|
+
icon: string;
|
|
65
|
+
}[];
|
|
66
|
+
context: {
|
|
67
|
+
'@type': string;
|
|
68
|
+
name: string;
|
|
69
|
+
url: string;
|
|
70
|
+
};
|
|
71
|
+
};
|
|
72
|
+
};
|
|
73
|
+
export default _default;
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
declare const _default: {
|
|
2
|
+
meta: {
|
|
3
|
+
auth: never[];
|
|
4
|
+
definitionId: string;
|
|
5
|
+
visibility: string;
|
|
6
|
+
access: string;
|
|
7
|
+
resourceType: string;
|
|
8
|
+
key: string;
|
|
9
|
+
};
|
|
10
|
+
data: {
|
|
11
|
+
'@context': {
|
|
12
|
+
'@vocab': string;
|
|
13
|
+
atlassian: string;
|
|
14
|
+
schema: string;
|
|
15
|
+
};
|
|
16
|
+
generator: {
|
|
17
|
+
'@type': string;
|
|
18
|
+
'@id': string;
|
|
19
|
+
name: string;
|
|
20
|
+
};
|
|
21
|
+
'@type': string[];
|
|
22
|
+
url: string;
|
|
23
|
+
name: string;
|
|
24
|
+
'atlassian:state': string;
|
|
25
|
+
summary: string;
|
|
26
|
+
'schema:commentCount': number;
|
|
27
|
+
'atlassian:subscriberCount': number;
|
|
28
|
+
'atlassian:titlePrefix': {
|
|
29
|
+
text: string;
|
|
30
|
+
'@type': string;
|
|
31
|
+
};
|
|
32
|
+
'atlassian:attributedTo': {
|
|
33
|
+
'@type': string;
|
|
34
|
+
name: string;
|
|
35
|
+
icon: string;
|
|
36
|
+
};
|
|
37
|
+
'atlassian:ownedBy': {
|
|
38
|
+
'@type': string;
|
|
39
|
+
name: string;
|
|
40
|
+
icon: string;
|
|
41
|
+
};
|
|
42
|
+
preview: {
|
|
43
|
+
'@type': string;
|
|
44
|
+
href: string;
|
|
45
|
+
'atlassian:supportedPlatforms': string[];
|
|
46
|
+
};
|
|
47
|
+
};
|
|
48
|
+
};
|
|
49
|
+
export default _default;
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
declare const _default: {
|
|
2
|
+
meta: {
|
|
3
|
+
auth: never[];
|
|
4
|
+
definitionId: string;
|
|
5
|
+
visibility: string;
|
|
6
|
+
access: string;
|
|
7
|
+
resourceType: string;
|
|
8
|
+
key: string;
|
|
9
|
+
};
|
|
10
|
+
data: {
|
|
11
|
+
'@context': {
|
|
12
|
+
'@vocab': string;
|
|
13
|
+
atlassian: string;
|
|
14
|
+
schema: string;
|
|
15
|
+
};
|
|
16
|
+
generator: {
|
|
17
|
+
'@type': string;
|
|
18
|
+
'@id': string;
|
|
19
|
+
name: string;
|
|
20
|
+
};
|
|
21
|
+
'@type': string[];
|
|
22
|
+
url: string;
|
|
23
|
+
name: string;
|
|
24
|
+
'atlassian:state': string;
|
|
25
|
+
summary: string;
|
|
26
|
+
'schema:commentCount': number;
|
|
27
|
+
'atlassian:subscriberCount': number;
|
|
28
|
+
'atlassian:titlePrefix': {
|
|
29
|
+
text: string;
|
|
30
|
+
'@type': string;
|
|
31
|
+
};
|
|
32
|
+
'atlassian:attributedTo': {
|
|
33
|
+
'@type': string;
|
|
34
|
+
name: string;
|
|
35
|
+
icon: string;
|
|
36
|
+
};
|
|
37
|
+
'atlassian:ownedBy': {
|
|
38
|
+
'@type': string;
|
|
39
|
+
name: string;
|
|
40
|
+
icon: string;
|
|
41
|
+
};
|
|
42
|
+
preview: {
|
|
43
|
+
'@type': string;
|
|
44
|
+
href: string;
|
|
45
|
+
'atlassian:supportedPlatforms': string[];
|
|
46
|
+
};
|
|
47
|
+
};
|
|
48
|
+
};
|
|
49
|
+
export default _default;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
declare const _default: {
|
|
2
|
+
meta: {
|
|
3
|
+
auth: never[];
|
|
4
|
+
definitionId: string;
|
|
5
|
+
visibility: string;
|
|
6
|
+
access: string;
|
|
7
|
+
resourceType: string;
|
|
8
|
+
key: string;
|
|
9
|
+
};
|
|
10
|
+
data: {
|
|
11
|
+
'@context': {
|
|
12
|
+
'@vocab': string;
|
|
13
|
+
atlassian: string;
|
|
14
|
+
schema: string;
|
|
15
|
+
};
|
|
16
|
+
generator: {
|
|
17
|
+
'@type': string;
|
|
18
|
+
'@id': string;
|
|
19
|
+
name: string;
|
|
20
|
+
};
|
|
21
|
+
'@type': string[];
|
|
22
|
+
url: string;
|
|
23
|
+
icon: {
|
|
24
|
+
'@type': string;
|
|
25
|
+
url: string;
|
|
26
|
+
};
|
|
27
|
+
name: string;
|
|
28
|
+
'atlassian:state': string;
|
|
29
|
+
summary: string;
|
|
30
|
+
'atlassian:titlePrefix': {
|
|
31
|
+
text: string;
|
|
32
|
+
'@type': string;
|
|
33
|
+
};
|
|
34
|
+
};
|
|
35
|
+
};
|
|
36
|
+
export default _default;
|