@atlaskit/smart-card 25.9.0 → 25.9.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 +7 -0
- package/dist/cjs/state/actions/index.js +11 -27
- package/dist/cjs/state/hooks/use-resolve/index.js +12 -21
- package/dist/cjs/version.json +1 -1
- package/dist/cjs/view/CardWithUrl/component.js +3 -12
- package/dist/cjs/view/FlexibleCard/components/elements/link/index.js +3 -1
- package/dist/cjs/view/HoverCard/components/HoverCardComponent.js +4 -11
- package/dist/es2019/state/actions/index.js +12 -32
- package/dist/es2019/state/hooks/use-resolve/index.js +12 -21
- package/dist/es2019/version.json +1 -1
- package/dist/es2019/view/CardWithUrl/component.js +2 -8
- package/dist/es2019/view/FlexibleCard/components/elements/link/index.js +11 -4
- package/dist/es2019/view/HoverCard/components/HoverCardComponent.js +3 -10
- package/dist/esm/state/actions/index.js +11 -27
- package/dist/esm/state/hooks/use-resolve/index.js +12 -21
- package/dist/esm/version.json +1 -1
- package/dist/esm/view/CardWithUrl/component.js +2 -10
- package/dist/esm/view/FlexibleCard/components/elements/link/index.js +3 -1
- package/dist/esm/view/HoverCard/components/HoverCardComponent.js +4 -11
- package/dist/types/view/CardWithUrl/component.d.ts +1 -1
- package/package.json +1 -2
- package/dist/cjs/utils/analytics/SmartLinkAnalyticsContext.js +0 -47
- package/dist/es2019/utils/analytics/SmartLinkAnalyticsContext.js +0 -35
- package/dist/esm/utils/analytics/SmartLinkAnalyticsContext.js +0 -36
- package/dist/types/utils/analytics/SmartLinkAnalyticsContext.d.ts +0 -9
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,12 @@
|
|
|
1
1
|
# @atlaskit/smart-card
|
|
2
2
|
|
|
3
|
+
## 25.9.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`b76602c1619`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b76602c1619) - Revert 25.8.0 changes "Include additional attributes (urlHash, display, id) and resolved attributes for link clicked analytics events" due to regression
|
|
8
|
+
- [`1aedc244e41`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1aedc244e41) - [ux] Smart Links Internal Grey theme is now more specific to prevent Confluence override
|
|
9
|
+
|
|
3
10
|
## 25.9.0
|
|
4
11
|
|
|
5
12
|
### Minor Changes
|
|
@@ -25,20 +25,13 @@ var useSmartCardActions = function useSmartCardActions(id, url, analytics) {
|
|
|
25
25
|
connections = _useSmartLinkContext.connections;
|
|
26
26
|
var getState = store.getState,
|
|
27
27
|
dispatch = store.dispatch;
|
|
28
|
-
var
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
metadataStatus = _ref.metadataStatus;
|
|
36
|
-
return {
|
|
37
|
-
details: details,
|
|
38
|
-
status: status,
|
|
39
|
-
metadataStatus: metadataStatus
|
|
40
|
-
};
|
|
41
|
-
}, [getState, url]);
|
|
28
|
+
var _ref = getState()[url] || {
|
|
29
|
+
status: _constants.SmartLinkStatus.Pending,
|
|
30
|
+
details: undefined
|
|
31
|
+
},
|
|
32
|
+
details = _ref.details,
|
|
33
|
+
status = _ref.status,
|
|
34
|
+
metadataStatus = _ref.metadataStatus;
|
|
42
35
|
var setMetadataStatus = (0, _react.useCallback)(function (metadataStatus) {
|
|
43
36
|
dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_UPDATE_METADATA_STATUS, {
|
|
44
37
|
url: url
|
|
@@ -65,8 +58,6 @@ var useSmartCardActions = function useSmartCardActions(id, url, analytics) {
|
|
|
65
58
|
}, _callee);
|
|
66
59
|
})), [id, resolveUrl, url]);
|
|
67
60
|
var register = (0, _react.useCallback)(function () {
|
|
68
|
-
var _getSmartLinkState = getSmartLinkState(),
|
|
69
|
-
details = _getSmartLinkState.details;
|
|
70
61
|
if (!details) {
|
|
71
62
|
dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_RESOLVING, {
|
|
72
63
|
url: url
|
|
@@ -74,10 +65,8 @@ var useSmartCardActions = function useSmartCardActions(id, url, analytics) {
|
|
|
74
65
|
setMetadataStatus('pending');
|
|
75
66
|
}
|
|
76
67
|
return resolve();
|
|
77
|
-
}, [
|
|
68
|
+
}, [details, resolve, dispatch, url, setMetadataStatus]);
|
|
78
69
|
var reload = (0, _react.useCallback)(function () {
|
|
79
|
-
var _getSmartLinkState2 = getSmartLinkState(),
|
|
80
|
-
details = _getSmartLinkState2.details;
|
|
81
70
|
var definitionId = (0, _helpers.getDefinitionId)(details);
|
|
82
71
|
if (definitionId) {
|
|
83
72
|
(0, _helpers.getByDefinitionId)(definitionId, getState()).map(function (url) {
|
|
@@ -86,20 +75,15 @@ var useSmartCardActions = function useSmartCardActions(id, url, analytics) {
|
|
|
86
75
|
} else {
|
|
87
76
|
resolve(url, true);
|
|
88
77
|
}
|
|
89
|
-
}, [
|
|
78
|
+
}, [details, url, getState, resolve]);
|
|
90
79
|
var loadMetadata = (0, _react.useCallback)(function () {
|
|
91
|
-
var _getSmartLinkState3 = getSmartLinkState(),
|
|
92
|
-
metadataStatus = _getSmartLinkState3.metadataStatus;
|
|
93
80
|
//metadataStatus will be undefined for SSR links only
|
|
94
81
|
if (metadataStatus === undefined) {
|
|
95
82
|
setMetadataStatus('pending');
|
|
96
83
|
return resolve(url, false, true);
|
|
97
84
|
}
|
|
98
|
-
}, [
|
|
85
|
+
}, [metadataStatus, resolve, setMetadataStatus, url]);
|
|
99
86
|
var authorize = (0, _react.useCallback)(function (appearance) {
|
|
100
|
-
var _getSmartLinkState4 = getSmartLinkState(),
|
|
101
|
-
details = _getSmartLinkState4.details,
|
|
102
|
-
status = _getSmartLinkState4.status;
|
|
103
87
|
var definitionId = (0, _helpers.getDefinitionId)(details);
|
|
104
88
|
var extensionKey = (0, _helpers.getExtensionKey)(details);
|
|
105
89
|
var services = (0, _helpers.getServices)(details);
|
|
@@ -151,7 +135,7 @@ var useSmartCardActions = function useSmartCardActions(id, url, analytics) {
|
|
|
151
135
|
reload();
|
|
152
136
|
});
|
|
153
137
|
}
|
|
154
|
-
}, [
|
|
138
|
+
}, [analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload, details, status]);
|
|
155
139
|
var invoke = (0, _react.useCallback)( /*#__PURE__*/function () {
|
|
156
140
|
var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(opts, appearance) {
|
|
157
141
|
var key, action, source, markName, response;
|
|
@@ -8,7 +8,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
8
8
|
exports.default = void 0;
|
|
9
9
|
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
10
10
|
var _react = require("react");
|
|
11
|
-
var _reactDom = require("react-dom");
|
|
12
11
|
var _analytics = require("../../analytics");
|
|
13
12
|
var _helpers = require("../../helpers");
|
|
14
13
|
var _linkingCommon = require("@atlaskit/linking-common");
|
|
@@ -107,26 +106,18 @@ var useResolve = function useResolve() {
|
|
|
107
106
|
return;
|
|
108
107
|
}
|
|
109
108
|
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
url: resourceUrl
|
|
123
|
-
}, response));
|
|
124
|
-
} else {
|
|
125
|
-
dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_RESOLVED, {
|
|
126
|
-
url: resourceUrl
|
|
127
|
-
}, response, undefined, undefined, isMetadataRequest));
|
|
128
|
-
}
|
|
129
|
-
});
|
|
109
|
+
//if a link resolves normally, metadata will also always be resolved
|
|
110
|
+
setMetadataStatus(resourceUrl, 'resolved');
|
|
111
|
+
// Dispatch Analytics and resolved card action - including unauthorized states.
|
|
112
|
+
if (isReloading) {
|
|
113
|
+
dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_RELOADING, {
|
|
114
|
+
url: resourceUrl
|
|
115
|
+
}, response));
|
|
116
|
+
} else {
|
|
117
|
+
dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_RESOLVED, {
|
|
118
|
+
url: resourceUrl
|
|
119
|
+
}, response, undefined, undefined, isMetadataRequest));
|
|
120
|
+
}
|
|
130
121
|
}, [dispatch, handleResolvedLinkError, hasAuthFlowSupported, setMetadataStatus]);
|
|
131
122
|
return (0, _react.useCallback)( /*#__PURE__*/function () {
|
|
132
123
|
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(url) {
|
package/dist/cjs/version.json
CHANGED
|
@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
-
exports.CardWithUrlContent =
|
|
8
|
+
exports.CardWithUrlContent = CardWithUrlContent;
|
|
9
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
10
|
var _analyticsNext = require("@atlaskit/analytics-next");
|
|
11
11
|
var _linkProvider = require("@atlaskit/link-provider");
|
|
@@ -20,10 +20,9 @@ var _flexible = require("../../utils/flexible");
|
|
|
20
20
|
var _FlexibleCard = _interopRequireDefault(require("../FlexibleCard"));
|
|
21
21
|
var _constants = require("../../constants");
|
|
22
22
|
var _click = require("../../utils/analytics/click");
|
|
23
|
-
var _SmartLinkAnalyticsContext = require("../../utils/analytics/SmartLinkAnalyticsContext");
|
|
24
23
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
25
24
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
26
|
-
function
|
|
25
|
+
function CardWithUrlContent(_ref) {
|
|
27
26
|
var id = _ref.id,
|
|
28
27
|
url = _ref.url,
|
|
29
28
|
isSelected = _ref.isSelected,
|
|
@@ -268,12 +267,4 @@ function Component(_ref) {
|
|
|
268
267
|
onIframeFocus: onIframeFocus
|
|
269
268
|
});
|
|
270
269
|
}
|
|
271
|
-
}
|
|
272
|
-
var CardWithUrlContent = function CardWithUrlContent(props) {
|
|
273
|
-
return /*#__PURE__*/_react.default.createElement(_SmartLinkAnalyticsContext.SmartLinkAnalyticsContext, {
|
|
274
|
-
url: props.url,
|
|
275
|
-
appearance: props.appearance,
|
|
276
|
-
id: props.id
|
|
277
|
-
}, /*#__PURE__*/_react.default.createElement(Component, props));
|
|
278
|
-
};
|
|
279
|
-
exports.CardWithUrlContent = CardWithUrlContent;
|
|
270
|
+
}
|
|
@@ -25,7 +25,9 @@ var containerStyles = (0, _react2.css)(_templateObject || (_templateObject = (0,
|
|
|
25
25
|
var getThemeStyles = function getThemeStyles(theme) {
|
|
26
26
|
switch (theme) {
|
|
27
27
|
case _constants.SmartLinkInternalTheme.Grey:
|
|
28
|
-
|
|
28
|
+
// We are being specifc with the CSS selectors to ensure that Confluence overrides
|
|
29
|
+
// do not affect our internal Smart Card styles
|
|
30
|
+
return (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n a& {\n color: ", ";\n &:active,\n &:visited,\n &:focus,\n &:hover {\n color: ", ";\n text-decoration: underline;\n }\n font-size: 12px;\n }\n "])), "var(--ds-text-subtlest, #626F86)", "var(--ds-text-subtlest, #626F86)");
|
|
29
31
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
30
32
|
case _constants.SmartLinkTheme.Black:
|
|
31
33
|
return (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n color: ", ";\n :active {\n color: ", ";\n }\n :hover {\n color: ", ";\n text-decoration: underline;\n }\n "])), _token.tokens.blackLink, _token.tokens.blackLinkPressed, _token.tokens.blackLink);
|
|
@@ -17,7 +17,6 @@ var _store = require("../../../state/store");
|
|
|
17
17
|
var _HoverCardContent = _interopRequireDefault(require("../components/HoverCardContent"));
|
|
18
18
|
var _styled = require("../styled");
|
|
19
19
|
var _constants = require("../../../constants");
|
|
20
|
-
var _SmartLinkAnalyticsContext = require("../../../utils/analytics/SmartLinkAnalyticsContext");
|
|
21
20
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
22
21
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
23
22
|
/** @jsx jsx */
|
|
@@ -25,7 +24,6 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
25
24
|
var HoverCardComponent = function HoverCardComponent(_ref) {
|
|
26
25
|
var children = _ref.children,
|
|
27
26
|
url = _ref.url,
|
|
28
|
-
id = _ref.id,
|
|
29
27
|
analyticsHandler = _ref.analyticsHandler,
|
|
30
28
|
analytics = _ref.analytics,
|
|
31
29
|
_ref$canOpen = _ref.canOpen,
|
|
@@ -135,11 +133,7 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
|
|
|
135
133
|
}, [closeOnChildClick, hideCard]);
|
|
136
134
|
var content = (0, _react2.useCallback)(function (_ref2) {
|
|
137
135
|
var update = _ref2.update;
|
|
138
|
-
return (0, _react.jsx)(
|
|
139
|
-
url: url,
|
|
140
|
-
appearance: _constants.CardDisplay.HoverCardPreview,
|
|
141
|
-
id: id
|
|
142
|
-
}, (0, _react.jsx)(_HoverCardContent.default, {
|
|
136
|
+
return (0, _react.jsx)(_HoverCardContent.default, {
|
|
143
137
|
onMouseEnter: initShowCard,
|
|
144
138
|
onMouseLeave: initHideCard,
|
|
145
139
|
analytics: analytics,
|
|
@@ -149,10 +143,9 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
|
|
|
149
143
|
onResolve: update,
|
|
150
144
|
renderers: renderers,
|
|
151
145
|
showServerActions: showServerActions,
|
|
152
|
-
url: url
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
}, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url, id]);
|
|
146
|
+
url: url
|
|
147
|
+
});
|
|
148
|
+
}, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url]);
|
|
156
149
|
var trigger = (0, _react2.useCallback)(function (triggerProps) {
|
|
157
150
|
return (0, _react.jsx)("span", {
|
|
158
151
|
ref: parentSpan
|
|
@@ -16,21 +16,14 @@ export const useSmartCardActions = (id, url, analytics) => {
|
|
|
16
16
|
getState,
|
|
17
17
|
dispatch
|
|
18
18
|
} = store;
|
|
19
|
-
const
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
};
|
|
28
|
-
return {
|
|
29
|
-
details,
|
|
30
|
-
status,
|
|
31
|
-
metadataStatus
|
|
32
|
-
};
|
|
33
|
-
}, [getState, url]);
|
|
19
|
+
const {
|
|
20
|
+
details,
|
|
21
|
+
status,
|
|
22
|
+
metadataStatus
|
|
23
|
+
} = getState()[url] || {
|
|
24
|
+
status: SmartLinkStatus.Pending,
|
|
25
|
+
details: undefined
|
|
26
|
+
};
|
|
34
27
|
const setMetadataStatus = useCallback(metadataStatus => {
|
|
35
28
|
dispatch(cardAction(ACTION_UPDATE_METADATA_STATUS, {
|
|
36
29
|
url
|
|
@@ -38,9 +31,6 @@ export const useSmartCardActions = (id, url, analytics) => {
|
|
|
38
31
|
}, [dispatch, url]);
|
|
39
32
|
const resolve = useCallback(async (resourceUrl = url, isReloading = false, isMetadataRequest = false) => resolveUrl(resourceUrl, isReloading, isMetadataRequest, id), [id, resolveUrl, url]);
|
|
40
33
|
const register = useCallback(() => {
|
|
41
|
-
const {
|
|
42
|
-
details
|
|
43
|
-
} = getSmartLinkState();
|
|
44
34
|
if (!details) {
|
|
45
35
|
dispatch(cardAction(ACTION_RESOLVING, {
|
|
46
36
|
url
|
|
@@ -48,33 +38,23 @@ export const useSmartCardActions = (id, url, analytics) => {
|
|
|
48
38
|
setMetadataStatus('pending');
|
|
49
39
|
}
|
|
50
40
|
return resolve();
|
|
51
|
-
}, [
|
|
41
|
+
}, [details, resolve, dispatch, url, setMetadataStatus]);
|
|
52
42
|
const reload = useCallback(() => {
|
|
53
|
-
const {
|
|
54
|
-
details
|
|
55
|
-
} = getSmartLinkState();
|
|
56
43
|
const definitionId = getDefinitionId(details);
|
|
57
44
|
if (definitionId) {
|
|
58
45
|
getByDefinitionId(definitionId, getState()).map(url => resolve(url, true));
|
|
59
46
|
} else {
|
|
60
47
|
resolve(url, true);
|
|
61
48
|
}
|
|
62
|
-
}, [
|
|
49
|
+
}, [details, url, getState, resolve]);
|
|
63
50
|
const loadMetadata = useCallback(() => {
|
|
64
|
-
const {
|
|
65
|
-
metadataStatus
|
|
66
|
-
} = getSmartLinkState();
|
|
67
51
|
//metadataStatus will be undefined for SSR links only
|
|
68
52
|
if (metadataStatus === undefined) {
|
|
69
53
|
setMetadataStatus('pending');
|
|
70
54
|
return resolve(url, false, true);
|
|
71
55
|
}
|
|
72
|
-
}, [
|
|
56
|
+
}, [metadataStatus, resolve, setMetadataStatus, url]);
|
|
73
57
|
const authorize = useCallback(appearance => {
|
|
74
|
-
const {
|
|
75
|
-
details,
|
|
76
|
-
status
|
|
77
|
-
} = getSmartLinkState();
|
|
78
58
|
const definitionId = getDefinitionId(details);
|
|
79
59
|
const extensionKey = getExtensionKey(details);
|
|
80
60
|
const services = getServices(details);
|
|
@@ -126,7 +106,7 @@ export const useSmartCardActions = (id, url, analytics) => {
|
|
|
126
106
|
reload();
|
|
127
107
|
});
|
|
128
108
|
}
|
|
129
|
-
}, [
|
|
109
|
+
}, [analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload, details, status]);
|
|
130
110
|
const invoke = useCallback(async (opts, appearance) => {
|
|
131
111
|
const {
|
|
132
112
|
key,
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { useCallback } from 'react';
|
|
2
|
-
import { unstable_batchedUpdates } from 'react-dom';
|
|
3
2
|
import { addMetadataToExperience } from '../../analytics';
|
|
4
3
|
import { getStatus } from '../../helpers';
|
|
5
4
|
import { ACTION_ERROR, ACTION_ERROR_FALLBACK, ACTION_RELOADING, ACTION_RESOLVED, ACTION_UPDATE_METADATA_STATUS, APIError, cardAction } from '@atlaskit/linking-common';
|
|
@@ -99,26 +98,18 @@ const useResolve = () => {
|
|
|
99
98
|
return;
|
|
100
99
|
}
|
|
101
100
|
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
url: resourceUrl
|
|
115
|
-
}, response));
|
|
116
|
-
} else {
|
|
117
|
-
dispatch(cardAction(ACTION_RESOLVED, {
|
|
118
|
-
url: resourceUrl
|
|
119
|
-
}, response, undefined, undefined, isMetadataRequest));
|
|
120
|
-
}
|
|
121
|
-
});
|
|
101
|
+
//if a link resolves normally, metadata will also always be resolved
|
|
102
|
+
setMetadataStatus(resourceUrl, 'resolved');
|
|
103
|
+
// Dispatch Analytics and resolved card action - including unauthorized states.
|
|
104
|
+
if (isReloading) {
|
|
105
|
+
dispatch(cardAction(ACTION_RELOADING, {
|
|
106
|
+
url: resourceUrl
|
|
107
|
+
}, response));
|
|
108
|
+
} else {
|
|
109
|
+
dispatch(cardAction(ACTION_RESOLVED, {
|
|
110
|
+
url: resourceUrl
|
|
111
|
+
}, response, undefined, undefined, isMetadataRequest));
|
|
112
|
+
}
|
|
122
113
|
}, [dispatch, handleResolvedLinkError, hasAuthFlowSupported, setMetadataStatus]);
|
|
123
114
|
return useCallback(async (url, isReloading = false, isMetadataRequest = false, id = '') => {
|
|
124
115
|
const {
|
package/dist/es2019/version.json
CHANGED
|
@@ -12,8 +12,7 @@ import { isFlexibleUiCard } from '../../utils/flexible';
|
|
|
12
12
|
import FlexibleCard from '../FlexibleCard';
|
|
13
13
|
import { CardDisplay } from '../../constants';
|
|
14
14
|
import { fireLinkClickedEvent } from '../../utils/analytics/click';
|
|
15
|
-
|
|
16
|
-
function Component({
|
|
15
|
+
export function CardWithUrlContent({
|
|
17
16
|
id,
|
|
18
17
|
url,
|
|
19
18
|
isSelected,
|
|
@@ -255,9 +254,4 @@ function Component({
|
|
|
255
254
|
onIframeFocus: onIframeFocus
|
|
256
255
|
});
|
|
257
256
|
}
|
|
258
|
-
}
|
|
259
|
-
export const CardWithUrlContent = props => /*#__PURE__*/React.createElement(SmartLinkAnalyticsContext, {
|
|
260
|
-
url: props.url,
|
|
261
|
-
appearance: props.appearance,
|
|
262
|
-
id: props.id
|
|
263
|
-
}, /*#__PURE__*/React.createElement(Component, props));
|
|
257
|
+
}
|
|
@@ -15,13 +15,20 @@ const containerStyles = css`
|
|
|
15
15
|
const getThemeStyles = theme => {
|
|
16
16
|
switch (theme) {
|
|
17
17
|
case SmartLinkInternalTheme.Grey:
|
|
18
|
+
// We are being specifc with the CSS selectors to ensure that Confluence overrides
|
|
19
|
+
// do not affect our internal Smart Card styles
|
|
18
20
|
return css`
|
|
19
|
-
|
|
20
|
-
:hover {
|
|
21
|
+
a& {
|
|
21
22
|
color: ${"var(--ds-text-subtlest, #626F86)"};
|
|
22
|
-
|
|
23
|
+
&:active,
|
|
24
|
+
&:visited,
|
|
25
|
+
&:focus,
|
|
26
|
+
&:hover {
|
|
27
|
+
color: ${"var(--ds-text-subtlest, #626F86)"};
|
|
28
|
+
text-decoration: underline;
|
|
29
|
+
}
|
|
30
|
+
font-size: 12px;
|
|
23
31
|
}
|
|
24
|
-
font-size: 12px;
|
|
25
32
|
`;
|
|
26
33
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
27
34
|
case SmartLinkTheme.Black:
|
|
@@ -9,11 +9,9 @@ import { useSmartCardState as useLinkState } from '../../../state/store';
|
|
|
9
9
|
import HoverCardContent from '../components/HoverCardContent';
|
|
10
10
|
import { CARD_GAP_PX, HOVER_CARD_Z_INDEX } from '../styled';
|
|
11
11
|
import { CardDisplay } from '../../../constants';
|
|
12
|
-
import { SmartLinkAnalyticsContext } from '../../../utils/analytics/SmartLinkAnalyticsContext';
|
|
13
12
|
export const HoverCardComponent = ({
|
|
14
13
|
children,
|
|
15
14
|
url,
|
|
16
|
-
id,
|
|
17
15
|
analyticsHandler,
|
|
18
16
|
analytics,
|
|
19
17
|
canOpen = true,
|
|
@@ -114,11 +112,7 @@ export const HoverCardComponent = ({
|
|
|
114
112
|
}, [closeOnChildClick, hideCard]);
|
|
115
113
|
const content = useCallback(({
|
|
116
114
|
update
|
|
117
|
-
}) => jsx(
|
|
118
|
-
url: url,
|
|
119
|
-
appearance: CardDisplay.HoverCardPreview,
|
|
120
|
-
id: id
|
|
121
|
-
}, jsx(HoverCardContent, {
|
|
115
|
+
}) => jsx(HoverCardContent, {
|
|
122
116
|
onMouseEnter: initShowCard,
|
|
123
117
|
onMouseLeave: initHideCard,
|
|
124
118
|
analytics: analytics,
|
|
@@ -128,9 +122,8 @@ export const HoverCardComponent = ({
|
|
|
128
122
|
onResolve: update,
|
|
129
123
|
renderers: renderers,
|
|
130
124
|
showServerActions: showServerActions,
|
|
131
|
-
url: url
|
|
132
|
-
|
|
133
|
-
})), [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url, id]);
|
|
125
|
+
url: url
|
|
126
|
+
}), [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url]);
|
|
134
127
|
const trigger = useCallback(triggerProps => jsx("span", {
|
|
135
128
|
ref: parentSpan
|
|
136
129
|
}, jsx("span", _extends({}, triggerProps, {
|
|
@@ -16,20 +16,13 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
|
|
|
16
16
|
connections = _useSmartLinkContext.connections;
|
|
17
17
|
var getState = store.getState,
|
|
18
18
|
dispatch = store.dispatch;
|
|
19
|
-
var
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
metadataStatus = _ref.metadataStatus;
|
|
27
|
-
return {
|
|
28
|
-
details: details,
|
|
29
|
-
status: status,
|
|
30
|
-
metadataStatus: metadataStatus
|
|
31
|
-
};
|
|
32
|
-
}, [getState, url]);
|
|
19
|
+
var _ref = getState()[url] || {
|
|
20
|
+
status: SmartLinkStatus.Pending,
|
|
21
|
+
details: undefined
|
|
22
|
+
},
|
|
23
|
+
details = _ref.details,
|
|
24
|
+
status = _ref.status,
|
|
25
|
+
metadataStatus = _ref.metadataStatus;
|
|
33
26
|
var setMetadataStatus = useCallback(function (metadataStatus) {
|
|
34
27
|
dispatch(cardAction(ACTION_UPDATE_METADATA_STATUS, {
|
|
35
28
|
url: url
|
|
@@ -56,8 +49,6 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
|
|
|
56
49
|
}, _callee);
|
|
57
50
|
})), [id, resolveUrl, url]);
|
|
58
51
|
var register = useCallback(function () {
|
|
59
|
-
var _getSmartLinkState = getSmartLinkState(),
|
|
60
|
-
details = _getSmartLinkState.details;
|
|
61
52
|
if (!details) {
|
|
62
53
|
dispatch(cardAction(ACTION_RESOLVING, {
|
|
63
54
|
url: url
|
|
@@ -65,10 +56,8 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
|
|
|
65
56
|
setMetadataStatus('pending');
|
|
66
57
|
}
|
|
67
58
|
return resolve();
|
|
68
|
-
}, [
|
|
59
|
+
}, [details, resolve, dispatch, url, setMetadataStatus]);
|
|
69
60
|
var reload = useCallback(function () {
|
|
70
|
-
var _getSmartLinkState2 = getSmartLinkState(),
|
|
71
|
-
details = _getSmartLinkState2.details;
|
|
72
61
|
var definitionId = getDefinitionId(details);
|
|
73
62
|
if (definitionId) {
|
|
74
63
|
getByDefinitionId(definitionId, getState()).map(function (url) {
|
|
@@ -77,20 +66,15 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
|
|
|
77
66
|
} else {
|
|
78
67
|
resolve(url, true);
|
|
79
68
|
}
|
|
80
|
-
}, [
|
|
69
|
+
}, [details, url, getState, resolve]);
|
|
81
70
|
var loadMetadata = useCallback(function () {
|
|
82
|
-
var _getSmartLinkState3 = getSmartLinkState(),
|
|
83
|
-
metadataStatus = _getSmartLinkState3.metadataStatus;
|
|
84
71
|
//metadataStatus will be undefined for SSR links only
|
|
85
72
|
if (metadataStatus === undefined) {
|
|
86
73
|
setMetadataStatus('pending');
|
|
87
74
|
return resolve(url, false, true);
|
|
88
75
|
}
|
|
89
|
-
}, [
|
|
76
|
+
}, [metadataStatus, resolve, setMetadataStatus, url]);
|
|
90
77
|
var authorize = useCallback(function (appearance) {
|
|
91
|
-
var _getSmartLinkState4 = getSmartLinkState(),
|
|
92
|
-
details = _getSmartLinkState4.details,
|
|
93
|
-
status = _getSmartLinkState4.status;
|
|
94
78
|
var definitionId = getDefinitionId(details);
|
|
95
79
|
var extensionKey = getExtensionKey(details);
|
|
96
80
|
var services = getServices(details);
|
|
@@ -142,7 +126,7 @@ export var useSmartCardActions = function useSmartCardActions(id, url, analytics
|
|
|
142
126
|
reload();
|
|
143
127
|
});
|
|
144
128
|
}
|
|
145
|
-
}, [
|
|
129
|
+
}, [analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload, details, status]);
|
|
146
130
|
var invoke = useCallback( /*#__PURE__*/function () {
|
|
147
131
|
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(opts, appearance) {
|
|
148
132
|
var key, action, source, markName, response;
|
|
@@ -2,7 +2,6 @@ import _typeof from "@babel/runtime/helpers/typeof";
|
|
|
2
2
|
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
|
|
3
3
|
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = Object.defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof Symbol ? Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return Object.defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = Object.create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = Object.getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype); function defineIteratorMethods(prototype) { ["next", "throw", "return"].forEach(function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], tryLocsList.forEach(pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) { if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; } return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) { keys.push(key); } return keys.reverse(), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) { "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined); } }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, catch: function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
|
|
4
4
|
import { useCallback } from 'react';
|
|
5
|
-
import { unstable_batchedUpdates } from 'react-dom';
|
|
6
5
|
import { addMetadataToExperience } from '../../analytics';
|
|
7
6
|
import { getStatus } from '../../helpers';
|
|
8
7
|
import { ACTION_ERROR, ACTION_ERROR_FALLBACK, ACTION_RELOADING, ACTION_RESOLVED, ACTION_UPDATE_METADATA_STATUS, APIError, cardAction } from '@atlaskit/linking-common';
|
|
@@ -100,26 +99,18 @@ var useResolve = function useResolve() {
|
|
|
100
99
|
return;
|
|
101
100
|
}
|
|
102
101
|
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
url: resourceUrl
|
|
116
|
-
}, response));
|
|
117
|
-
} else {
|
|
118
|
-
dispatch(cardAction(ACTION_RESOLVED, {
|
|
119
|
-
url: resourceUrl
|
|
120
|
-
}, response, undefined, undefined, isMetadataRequest));
|
|
121
|
-
}
|
|
122
|
-
});
|
|
102
|
+
//if a link resolves normally, metadata will also always be resolved
|
|
103
|
+
setMetadataStatus(resourceUrl, 'resolved');
|
|
104
|
+
// Dispatch Analytics and resolved card action - including unauthorized states.
|
|
105
|
+
if (isReloading) {
|
|
106
|
+
dispatch(cardAction(ACTION_RELOADING, {
|
|
107
|
+
url: resourceUrl
|
|
108
|
+
}, response));
|
|
109
|
+
} else {
|
|
110
|
+
dispatch(cardAction(ACTION_RESOLVED, {
|
|
111
|
+
url: resourceUrl
|
|
112
|
+
}, response, undefined, undefined, isMetadataRequest));
|
|
113
|
+
}
|
|
123
114
|
}, [dispatch, handleResolvedLinkError, hasAuthFlowSupported, setMetadataStatus]);
|
|
124
115
|
return useCallback( /*#__PURE__*/function () {
|
|
125
116
|
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(url) {
|
package/dist/esm/version.json
CHANGED
|
@@ -12,8 +12,7 @@ import { isFlexibleUiCard } from '../../utils/flexible';
|
|
|
12
12
|
import FlexibleCard from '../FlexibleCard';
|
|
13
13
|
import { CardDisplay } from '../../constants';
|
|
14
14
|
import { fireLinkClickedEvent } from '../../utils/analytics/click';
|
|
15
|
-
|
|
16
|
-
function Component(_ref) {
|
|
15
|
+
export function CardWithUrlContent(_ref) {
|
|
17
16
|
var id = _ref.id,
|
|
18
17
|
url = _ref.url,
|
|
19
18
|
isSelected = _ref.isSelected,
|
|
@@ -258,11 +257,4 @@ function Component(_ref) {
|
|
|
258
257
|
onIframeFocus: onIframeFocus
|
|
259
258
|
});
|
|
260
259
|
}
|
|
261
|
-
}
|
|
262
|
-
export var CardWithUrlContent = function CardWithUrlContent(props) {
|
|
263
|
-
return /*#__PURE__*/React.createElement(SmartLinkAnalyticsContext, {
|
|
264
|
-
url: props.url,
|
|
265
|
-
appearance: props.appearance,
|
|
266
|
-
id: props.id
|
|
267
|
-
}, /*#__PURE__*/React.createElement(Component, props));
|
|
268
|
-
};
|
|
260
|
+
}
|
|
@@ -15,7 +15,9 @@ var containerStyles = css(_templateObject || (_templateObject = _taggedTemplateL
|
|
|
15
15
|
var getThemeStyles = function getThemeStyles(theme) {
|
|
16
16
|
switch (theme) {
|
|
17
17
|
case SmartLinkInternalTheme.Grey:
|
|
18
|
-
|
|
18
|
+
// We are being specifc with the CSS selectors to ensure that Confluence overrides
|
|
19
|
+
// do not affect our internal Smart Card styles
|
|
20
|
+
return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n a& {\n color: ", ";\n &:active,\n &:visited,\n &:focus,\n &:hover {\n color: ", ";\n text-decoration: underline;\n }\n font-size: 12px;\n }\n "])), "var(--ds-text-subtlest, #626F86)", "var(--ds-text-subtlest, #626F86)");
|
|
19
21
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
20
22
|
case SmartLinkTheme.Black:
|
|
21
23
|
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n color: ", ";\n :active {\n color: ", ";\n }\n :hover {\n color: ", ";\n text-decoration: underline;\n }\n "])), tokens.blackLink, tokens.blackLinkPressed, tokens.blackLink);
|
|
@@ -10,11 +10,9 @@ import { useSmartCardState as useLinkState } from '../../../state/store';
|
|
|
10
10
|
import HoverCardContent from '../components/HoverCardContent';
|
|
11
11
|
import { CARD_GAP_PX, HOVER_CARD_Z_INDEX } from '../styled';
|
|
12
12
|
import { CardDisplay } from '../../../constants';
|
|
13
|
-
import { SmartLinkAnalyticsContext } from '../../../utils/analytics/SmartLinkAnalyticsContext';
|
|
14
13
|
export var HoverCardComponent = function HoverCardComponent(_ref) {
|
|
15
14
|
var children = _ref.children,
|
|
16
15
|
url = _ref.url,
|
|
17
|
-
id = _ref.id,
|
|
18
16
|
analyticsHandler = _ref.analyticsHandler,
|
|
19
17
|
analytics = _ref.analytics,
|
|
20
18
|
_ref$canOpen = _ref.canOpen,
|
|
@@ -124,11 +122,7 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
|
|
|
124
122
|
}, [closeOnChildClick, hideCard]);
|
|
125
123
|
var content = useCallback(function (_ref2) {
|
|
126
124
|
var update = _ref2.update;
|
|
127
|
-
return jsx(
|
|
128
|
-
url: url,
|
|
129
|
-
appearance: CardDisplay.HoverCardPreview,
|
|
130
|
-
id: id
|
|
131
|
-
}, jsx(HoverCardContent, {
|
|
125
|
+
return jsx(HoverCardContent, {
|
|
132
126
|
onMouseEnter: initShowCard,
|
|
133
127
|
onMouseLeave: initHideCard,
|
|
134
128
|
analytics: analytics,
|
|
@@ -138,10 +132,9 @@ export var HoverCardComponent = function HoverCardComponent(_ref) {
|
|
|
138
132
|
onResolve: update,
|
|
139
133
|
renderers: renderers,
|
|
140
134
|
showServerActions: showServerActions,
|
|
141
|
-
url: url
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
}, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url, id]);
|
|
135
|
+
url: url
|
|
136
|
+
});
|
|
137
|
+
}, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url]);
|
|
145
138
|
var trigger = useCallback(function (triggerProps) {
|
|
146
139
|
return jsx("span", {
|
|
147
140
|
ref: parentSpan
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { CardWithUrlContentProps } from './types';
|
|
3
|
-
export declare
|
|
3
|
+
export declare function CardWithUrlContent({ id, url, isSelected, isFrameVisible, frameStyle, platform, onClick, appearance, dispatchAnalytics, onResolve, onError, testId, showActions, showServerActions: showServerActionsProp, inheritDimensions, embedIframeRef, embedIframeUrlType, inlinePreloaderStyle, ui, children, showHoverPreview, showAuthTooltip: showAuthTooltipProp, analyticsEvents, }: CardWithUrlContentProps): JSX.Element;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/smart-card",
|
|
3
|
-
"version": "25.9.
|
|
3
|
+
"version": "25.9.1",
|
|
4
4
|
"description": "Smart card component",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -33,7 +33,6 @@
|
|
|
33
33
|
"@atlaskit/icon-object": "^6.2.0",
|
|
34
34
|
"@atlaskit/icon-priority": "^6.3.0",
|
|
35
35
|
"@atlaskit/in-product-testing": "^0.1.0",
|
|
36
|
-
"@atlaskit/link-analytics": "^7.0.5",
|
|
37
36
|
"@atlaskit/link-client-extension": "^0.5.0",
|
|
38
37
|
"@atlaskit/linking-common": "^2.6.0",
|
|
39
38
|
"@atlaskit/linking-types": "^1.3.0",
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.SmartLinkAnalyticsContext = void 0;
|
|
9
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
10
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
var _analyticsNext = require("@atlaskit/analytics-next");
|
|
12
|
-
var _resolvedAttributes = require("@atlaskit/link-analytics/resolved-attributes");
|
|
13
|
-
var _flexible = require("../flexible");
|
|
14
|
-
var _constants = require("../../constants");
|
|
15
|
-
var _store = require("../../state/store");
|
|
16
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
17
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
18
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
19
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
20
|
-
var SmartLinkAnalyticsContext = function SmartLinkAnalyticsContext(_ref) {
|
|
21
|
-
var children = _ref.children,
|
|
22
|
-
url = _ref.url,
|
|
23
|
-
appearance = _ref.appearance,
|
|
24
|
-
id = _ref.id;
|
|
25
|
-
var _useSmartLinkState = (0, _store.useSmartCardState)(url),
|
|
26
|
-
details = _useSmartLinkState.details,
|
|
27
|
-
status = _useSmartLinkState.status;
|
|
28
|
-
var resolvedAttributes = (0, _resolvedAttributes.getResolvedAttributes)({
|
|
29
|
-
url: url
|
|
30
|
-
}, details, status);
|
|
31
|
-
var _getUrlAttributes = (0, _resolvedAttributes.getUrlAttributes)(url),
|
|
32
|
-
urlHash = _getUrlAttributes.urlHash;
|
|
33
|
-
var isFlexibleUi = (0, _react.useMemo)(function () {
|
|
34
|
-
return (0, _flexible.isFlexibleUiCard)(children);
|
|
35
|
-
}, [children]);
|
|
36
|
-
var display = isFlexibleUi ? _constants.CardDisplay.Flexible : appearance;
|
|
37
|
-
return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
|
|
38
|
-
data: {
|
|
39
|
-
attributes: _objectSpread(_objectSpread({}, resolvedAttributes), {}, {
|
|
40
|
-
urlHash: urlHash,
|
|
41
|
-
display: display,
|
|
42
|
-
id: id
|
|
43
|
-
})
|
|
44
|
-
}
|
|
45
|
-
}, children);
|
|
46
|
-
};
|
|
47
|
-
exports.SmartLinkAnalyticsContext = SmartLinkAnalyticsContext;
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import React, { useMemo } from 'react';
|
|
2
|
-
import { AnalyticsContext } from '@atlaskit/analytics-next';
|
|
3
|
-
import { getResolvedAttributes, getUrlAttributes } from '@atlaskit/link-analytics/resolved-attributes';
|
|
4
|
-
import { isFlexibleUiCard } from '../flexible';
|
|
5
|
-
import { CardDisplay } from '../../constants';
|
|
6
|
-
import { useSmartCardState as useSmartLinkState } from '../../state/store';
|
|
7
|
-
export const SmartLinkAnalyticsContext = ({
|
|
8
|
-
children,
|
|
9
|
-
url,
|
|
10
|
-
appearance,
|
|
11
|
-
id
|
|
12
|
-
}) => {
|
|
13
|
-
const {
|
|
14
|
-
details,
|
|
15
|
-
status
|
|
16
|
-
} = useSmartLinkState(url);
|
|
17
|
-
const resolvedAttributes = getResolvedAttributes({
|
|
18
|
-
url
|
|
19
|
-
}, details, status);
|
|
20
|
-
const {
|
|
21
|
-
urlHash
|
|
22
|
-
} = getUrlAttributes(url);
|
|
23
|
-
const isFlexibleUi = useMemo(() => isFlexibleUiCard(children), [children]);
|
|
24
|
-
const display = isFlexibleUi ? CardDisplay.Flexible : appearance;
|
|
25
|
-
return /*#__PURE__*/React.createElement(AnalyticsContext, {
|
|
26
|
-
data: {
|
|
27
|
-
attributes: {
|
|
28
|
-
...resolvedAttributes,
|
|
29
|
-
urlHash,
|
|
30
|
-
display,
|
|
31
|
-
id
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
}, children);
|
|
35
|
-
};
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
-
import React, { useMemo } from 'react';
|
|
5
|
-
import { AnalyticsContext } from '@atlaskit/analytics-next';
|
|
6
|
-
import { getResolvedAttributes, getUrlAttributes } from '@atlaskit/link-analytics/resolved-attributes';
|
|
7
|
-
import { isFlexibleUiCard } from '../flexible';
|
|
8
|
-
import { CardDisplay } from '../../constants';
|
|
9
|
-
import { useSmartCardState as useSmartLinkState } from '../../state/store';
|
|
10
|
-
export var SmartLinkAnalyticsContext = function SmartLinkAnalyticsContext(_ref) {
|
|
11
|
-
var children = _ref.children,
|
|
12
|
-
url = _ref.url,
|
|
13
|
-
appearance = _ref.appearance,
|
|
14
|
-
id = _ref.id;
|
|
15
|
-
var _useSmartLinkState = useSmartLinkState(url),
|
|
16
|
-
details = _useSmartLinkState.details,
|
|
17
|
-
status = _useSmartLinkState.status;
|
|
18
|
-
var resolvedAttributes = getResolvedAttributes({
|
|
19
|
-
url: url
|
|
20
|
-
}, details, status);
|
|
21
|
-
var _getUrlAttributes = getUrlAttributes(url),
|
|
22
|
-
urlHash = _getUrlAttributes.urlHash;
|
|
23
|
-
var isFlexibleUi = useMemo(function () {
|
|
24
|
-
return isFlexibleUiCard(children);
|
|
25
|
-
}, [children]);
|
|
26
|
-
var display = isFlexibleUi ? CardDisplay.Flexible : appearance;
|
|
27
|
-
return /*#__PURE__*/React.createElement(AnalyticsContext, {
|
|
28
|
-
data: {
|
|
29
|
-
attributes: _objectSpread(_objectSpread({}, resolvedAttributes), {}, {
|
|
30
|
-
urlHash: urlHash,
|
|
31
|
-
display: display,
|
|
32
|
-
id: id
|
|
33
|
-
})
|
|
34
|
-
}
|
|
35
|
-
}, children);
|
|
36
|
-
};
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
2
|
-
import { CardInnerAppearance } from '../../view/Card/types';
|
|
3
|
-
declare type SmartLinkAnalyticsContextProps = {
|
|
4
|
-
url: string;
|
|
5
|
-
appearance: CardInnerAppearance;
|
|
6
|
-
id: string | undefined;
|
|
7
|
-
};
|
|
8
|
-
export declare const SmartLinkAnalyticsContext: FC<SmartLinkAnalyticsContextProps>;
|
|
9
|
-
export {};
|