@atlaskit/smart-card 26.6.3 → 26.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +10 -0
- package/dist/cjs/state/analytics/useSmartLinkAnalytics.js +4 -2
- package/dist/cjs/state/helpers.js +6 -1
- package/dist/cjs/version.json +1 -1
- package/dist/cjs/view/EmbedCard/components/styled.js +2 -2
- package/dist/cjs/view/EmbedCard/views/UnresolvedView.js +1 -1
- package/dist/cjs/view/EmbedModal/components/link-info/styled.js +1 -1
- package/dist/cjs/view/FlexibleCard/components/elements/avatar-group/index.js +1 -1
- package/dist/cjs/view/FlexibleCard/components/elements/lozenge/lozenge-action/lozenge-action-error/styled.js +1 -1
- package/dist/cjs/view/FlexibleCard/components/elements/lozenge/lozenge-action/styled.js +1 -1
- package/dist/cjs/view/InlineCard/Icon.js +2 -2
- package/dist/es2019/state/analytics/useSmartLinkAnalytics.js +5 -3
- package/dist/es2019/state/helpers.js +4 -0
- package/dist/es2019/version.json +1 -1
- package/dist/es2019/view/EmbedCard/components/styled.js +2 -2
- package/dist/es2019/view/EmbedCard/views/UnresolvedView.js +1 -1
- package/dist/es2019/view/EmbedModal/components/link-info/styled.js +1 -1
- package/dist/es2019/view/FlexibleCard/components/elements/avatar-group/index.js +1 -1
- package/dist/es2019/view/FlexibleCard/components/elements/lozenge/lozenge-action/lozenge-action-error/styled.js +1 -1
- package/dist/es2019/view/FlexibleCard/components/elements/lozenge/lozenge-action/styled.js +1 -1
- package/dist/es2019/view/InlineCard/Icon.js +2 -2
- package/dist/esm/state/analytics/useSmartLinkAnalytics.js +5 -3
- package/dist/esm/state/helpers.js +4 -0
- package/dist/esm/version.json +1 -1
- package/dist/esm/view/EmbedCard/components/styled.js +2 -2
- package/dist/esm/view/EmbedCard/views/UnresolvedView.js +1 -1
- package/dist/esm/view/EmbedModal/components/link-info/styled.js +1 -1
- package/dist/esm/view/FlexibleCard/components/elements/avatar-group/index.js +1 -1
- package/dist/esm/view/FlexibleCard/components/elements/lozenge/lozenge-action/lozenge-action-error/styled.js +1 -1
- package/dist/esm/view/FlexibleCard/components/elements/lozenge/lozenge-action/styled.js +1 -1
- package/dist/esm/view/InlineCard/Icon.js +2 -2
- package/dist/types/state/helpers.d.ts +1 -0
- package/dist/types/utils/analytics/types.d.ts +1 -0
- package/dist/types-ts4.5/state/helpers.d.ts +1 -0
- package/dist/types-ts4.5/utils/analytics/types.d.ts +1 -0
- package/package.json +3 -3
- package/report.api.md +2 -0
- package/tmp/api-report-tmp.d.ts +2 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
# @atlaskit/smart-card
|
|
2
2
|
|
|
3
|
+
## 26.7.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`c5a897eb81d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c5a897eb81d) - add statusDetails attribute
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- Updated dependencies
|
|
12
|
+
|
|
3
13
|
## 26.6.3
|
|
4
14
|
|
|
5
15
|
### Patch Changes
|
|
@@ -59,6 +59,7 @@ var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, _dispatchAnalyti
|
|
|
59
59
|
var extractedResourceType = (0, _helpers.getResourceType)(details);
|
|
60
60
|
var extractedSubproduct = (0, _helpers.getSubproduct)(details);
|
|
61
61
|
var extractedProduct = (0, _helpers.getProduct)(details);
|
|
62
|
+
var extractedStatusDetails = (0, _helpers.getStatusDetails)(details);
|
|
62
63
|
var commonAttributes = (0, _react.useMemo)(function () {
|
|
63
64
|
return {
|
|
64
65
|
id: defaultId,
|
|
@@ -68,9 +69,10 @@ var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, _dispatchAnalyti
|
|
|
68
69
|
destinationObjectType: extractedResourceType,
|
|
69
70
|
destinationSubproduct: extractedSubproduct,
|
|
70
71
|
destinationProduct: extractedProduct,
|
|
71
|
-
location: defaultLocation
|
|
72
|
+
location: defaultLocation,
|
|
73
|
+
statusDetails: extractedStatusDetails
|
|
72
74
|
};
|
|
73
|
-
}, [defaultId, extractedDefinitionId, extractedExtensionKey, extractedResourceType, extractedSubproduct, extractedProduct, defaultLocation]);
|
|
75
|
+
}, [defaultId, extractedDefinitionId, extractedExtensionKey, extractedResourceType, extractedSubproduct, extractedProduct, defaultLocation, extractedStatusDetails]);
|
|
74
76
|
|
|
75
77
|
/** Contains all ui analytics events */
|
|
76
78
|
var ui = (0, _react.useMemo)(function () {
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.isVisible = exports.isFinalState = exports.isAccessible = exports.hasResolved = exports.getSubproduct = exports.getStatus = exports.getServices = exports.getResourceType = exports.getProduct = exports.getExtensionKey = exports.getDefinitionId = exports.getClickUrl = exports.getByDefinitionId = void 0;
|
|
6
|
+
exports.isVisible = exports.isFinalState = exports.isAccessible = exports.hasResolved = exports.getSubproduct = exports.getStatusDetails = exports.getStatus = exports.getServices = exports.getResourceType = exports.getProduct = exports.getExtensionKey = exports.getDefinitionId = exports.getClickUrl = exports.getByDefinitionId = void 0;
|
|
7
7
|
var _extractVisitUrl = require("../extractors/common/primitives/extractVisitUrl");
|
|
8
8
|
var getByDefinitionId = function getByDefinitionId(definitionId, store) {
|
|
9
9
|
var urls = Object.keys(store);
|
|
@@ -86,6 +86,11 @@ var getStatus = function getStatus(_ref3) {
|
|
|
86
86
|
}
|
|
87
87
|
};
|
|
88
88
|
exports.getStatus = getStatus;
|
|
89
|
+
var getStatusDetails = function getStatusDetails(details) {
|
|
90
|
+
var _details$meta6, _details$meta6$reques;
|
|
91
|
+
return details === null || details === void 0 ? void 0 : (_details$meta6 = details.meta) === null || _details$meta6 === void 0 ? void 0 : (_details$meta6$reques = _details$meta6.requestAccess) === null || _details$meta6$reques === void 0 ? void 0 : _details$meta6$reques.accessType;
|
|
92
|
+
};
|
|
93
|
+
exports.getStatusDetails = getStatusDetails;
|
|
89
94
|
var isFinalState = function isFinalState(status) {
|
|
90
95
|
return ['unauthorized', 'forbidden', 'errored', 'resolved', 'not_found'].indexOf(status) > -1;
|
|
91
96
|
};
|
package/dist/cjs/version.json
CHANGED
|
@@ -74,7 +74,7 @@ var LinkWrapper = _styled.default.div(_templateObject || (_templateObject = (0,
|
|
|
74
74
|
return wrapperStyles(props);
|
|
75
75
|
});
|
|
76
76
|
|
|
77
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
77
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
78
78
|
exports.LinkWrapper = LinkWrapper;
|
|
79
79
|
var Wrapper = _styled.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n ", ";\n margin-top: 10px;\n"])), function (props) {
|
|
80
80
|
return wrapperStyles(props);
|
|
@@ -133,7 +133,7 @@ var Title = _styled.default.div(_templateObject9 || (_templateObject9 = (0, _tag
|
|
|
133
133
|
exports.Title = Title;
|
|
134
134
|
var Byline = _styled.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n margin-top: ", ";\n color: ", ";\n font-size: 12px;\n font-weight: normal;\n line-height: ", ";\n ", ";\n"])), "var(--ds-space-050, 4px)", "var(--ds-text-subtlest, ".concat(colors.N300, ")"), 16 / 12, ellipsis('100%'));
|
|
135
135
|
|
|
136
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
136
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
137
137
|
exports.Byline = Byline;
|
|
138
138
|
var Description = _styled.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n margin-top: 7px;\n color: ", ";\n font-size: 12px;\n font-weight: normal;\n line-height: ", ";\n max-height: ", "px;\n overflow: hidden;\n"])), "var(--ds-text, ".concat(colors.N800, ")"), 18 / 12, 18 * 3);
|
|
139
139
|
exports.Description = Description;
|
|
@@ -12,7 +12,7 @@ var _constants = require("@atlaskit/theme/constants");
|
|
|
12
12
|
var _reactIntlNext = require("react-intl-next");
|
|
13
13
|
var _messages = require("../../../messages");
|
|
14
14
|
var _utils = require("../../common/utils");
|
|
15
|
-
/* eslint-disable @atlaskit/design-system/ensure-design-token-usage
|
|
15
|
+
/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
|
|
16
16
|
/** @jsx jsx */
|
|
17
17
|
|
|
18
18
|
var EmbedCardUnresolvedView = function EmbedCardUnresolvedView(_ref) {
|
|
@@ -8,7 +8,7 @@ exports.titleCss = exports.iconCss = exports.containerStyles = exports.actionCss
|
|
|
8
8
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
9
9
|
var _react = require("@emotion/react");
|
|
10
10
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
11
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
11
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
12
12
|
var containerStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n align-items: center;\n display: flex;\n gap: ", ";\n justify-content: space-between;\n // AK ModalBody has 2px padding top and bottom.\n // Using 14px here to create 16px gap between\n // link info and iframe\n padding: ", " ", " 14px\n ", ";\n"])), "var(--ds-space-100, 8px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)");
|
|
13
13
|
exports.containerStyles = containerStyles;
|
|
14
14
|
var iconSize = '24px';
|
|
@@ -14,7 +14,7 @@ var _templateObject, _templateObject2;
|
|
|
14
14
|
/** @jsx jsx */
|
|
15
15
|
var MAX_COUNT = 4;
|
|
16
16
|
var getStyles = function getStyles(size) {
|
|
17
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
17
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
18
18
|
var styles = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: inline-flex;\n ul {\n margin-right: 8px;\n }\n "])));
|
|
19
19
|
switch (size) {
|
|
20
20
|
case _constants.SmartLinkSize.XLarge:
|
|
@@ -15,7 +15,7 @@ exports.dropdownItemGroupStyles = dropdownItemGroupStyles;
|
|
|
15
15
|
var sharedBlockStyles = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\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"])));
|
|
16
16
|
var contentStyles = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n ", ";\n\n margin-top: ", ";\n align-items: flex-start;\n\n > span,\n > div {\n font-size: 0.875rem;\n line-height: 1.25rem;\n color: ", ";\n }\n"])), sharedBlockStyles, "var(--ds-space-025, 2px)", "var(--ds-text, ".concat(_colors.N800, ")"));
|
|
17
17
|
|
|
18
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
18
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
19
19
|
exports.contentStyles = contentStyles;
|
|
20
20
|
var linkStyles = (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n ", ";\n\n cursor: pointer;\n font-size: 0.875rem;\n margin-top: 10px;\n margin-left: ", ";\n margin-bottom: ", ";\n"])), sharedBlockStyles, "var(--ds-space-400, 32px)", "var(--ds-space-025, 2px)");
|
|
21
21
|
exports.linkStyles = linkStyles;
|
|
@@ -10,7 +10,7 @@ var _react = require("@emotion/react");
|
|
|
10
10
|
var _templateObject, _templateObject2, _templateObject3;
|
|
11
11
|
var triggerButtonStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n all: unset;\n background-color: transparent;\n color: unset;\n cursor: pointer;\n font-family: unset;\n font-size: unset;\n font-style: unset;\n font-weight: unset;\n font-variant: unset;\n line-height: 0;\n padding: 0;\n text-transform: unset;\n\n border: 2px solid transparent;\n margin: ", ";\n\n &:focus-visible,\n &:focus-within,\n &[aria-expanded='true'] {\n outline: none;\n box-shadow: 0 0 0 2px ", ";\n border-radius: 5px;\n }\n"])), "var(--ds-space-025, 2px)", "var(--ds-border-focused, #388BFF)");
|
|
12
12
|
|
|
13
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
13
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
14
14
|
exports.triggerButtonStyles = triggerButtonStyles;
|
|
15
15
|
var triggerLozengeStyles = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n align-items: center;\n display: flex;\n\n span[role='img'] {\n margin: calc(-1 * ", ")\n calc(-1 * ", ")\n calc(-1 * ", ") -1px;\n }\n"])), "var(--ds-space-050, 4px)", "var(--ds-space-100, 8px)", "var(--ds-space-050, 4px)");
|
|
16
16
|
exports.triggerLozengeStyles = triggerLozengeStyles;
|
|
@@ -27,9 +27,9 @@ var Shimmer = function Shimmer(_ref) {
|
|
|
27
27
|
var testId = _ref.testId;
|
|
28
28
|
var skeletonCustomStyles = {
|
|
29
29
|
position: 'absolute',
|
|
30
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
30
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
31
31
|
top: '50%',
|
|
32
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
32
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
33
33
|
left: '50%',
|
|
34
34
|
transform: 'translate(-50%, -50%)',
|
|
35
35
|
marginRight: "var(--ds-space-050, 4px)"
|
|
@@ -2,7 +2,7 @@ import { useMemo } from 'react';
|
|
|
2
2
|
import { getUrl } from '@atlaskit/linking-common';
|
|
3
3
|
import { chunkloadFailedEvent, connectFailedEvent, connectSucceededEvent, context, instrumentEvent, invokeFailedEvent, invokeSucceededEvent, screenAuthPopupEvent, trackAppAccountAuthStarted, trackAppAccountConnected, uiActionClickedEvent, uiAuthAlternateAccountEvent, uiAuthEvent, uiCardClickedEvent, uiClosedAuthEvent, uiHoverCardDismissedEvent, uiHoverCardOpenLinkClickedEvent, uiHoverCardViewedEvent, uiLearnMoreLinkClickedEvent, uiRenderFailedEvent, uiRenderSuccessEvent, uiSmartLinkStatusLozengeButtonClicked, uiSmartLinkStatusListItemButtonClicked, uiSmartLinkStatusOpenPreviewButtonClicked } from '../../utils/analytics';
|
|
4
4
|
import { failUfoExperience, startUfoExperience, succeedUfoExperience } from './ufoExperiences';
|
|
5
|
-
import { getDefinitionId, getExtensionKey, getProduct, getResourceType, getSubproduct } from '../helpers';
|
|
5
|
+
import { getDefinitionId, getExtensionKey, getProduct, getResourceType, getStatusDetails, getSubproduct } from '../helpers';
|
|
6
6
|
import { useSmartLinkContext } from '@atlaskit/link-provider';
|
|
7
7
|
import { trackSmartLinkQuickActionFailed, trackSmartLinkQuickActionStarted, trackSmartLinkQuickActionSuccess, uiIframeDwelledEvent, uiIframeFocusedEvent } from '../../utils/analytics/analytics';
|
|
8
8
|
import { useDispatchAnalytics } from './useDispatchAnalytics';
|
|
@@ -47,6 +47,7 @@ export const useSmartLinkAnalytics = (url, _dispatchAnalytics, id, defaultLocati
|
|
|
47
47
|
const extractedResourceType = getResourceType(details);
|
|
48
48
|
const extractedSubproduct = getSubproduct(details);
|
|
49
49
|
const extractedProduct = getProduct(details);
|
|
50
|
+
const extractedStatusDetails = getStatusDetails(details);
|
|
50
51
|
const commonAttributes = useMemo(() => ({
|
|
51
52
|
id: defaultId,
|
|
52
53
|
definitionId: extractedDefinitionId,
|
|
@@ -55,8 +56,9 @@ export const useSmartLinkAnalytics = (url, _dispatchAnalytics, id, defaultLocati
|
|
|
55
56
|
destinationObjectType: extractedResourceType,
|
|
56
57
|
destinationSubproduct: extractedSubproduct,
|
|
57
58
|
destinationProduct: extractedProduct,
|
|
58
|
-
location: defaultLocation
|
|
59
|
-
|
|
59
|
+
location: defaultLocation,
|
|
60
|
+
statusDetails: extractedStatusDetails
|
|
61
|
+
}), [defaultId, extractedDefinitionId, extractedExtensionKey, extractedResourceType, extractedSubproduct, extractedProduct, defaultLocation, extractedStatusDetails]);
|
|
60
62
|
|
|
61
63
|
/** Contains all ui analytics events */
|
|
62
64
|
const ui = useMemo(() => ({
|
|
@@ -71,6 +71,10 @@ export const getStatus = ({
|
|
|
71
71
|
return 'resolved';
|
|
72
72
|
}
|
|
73
73
|
};
|
|
74
|
+
export const getStatusDetails = details => {
|
|
75
|
+
var _details$meta6, _details$meta6$reques;
|
|
76
|
+
return details === null || details === void 0 ? void 0 : (_details$meta6 = details.meta) === null || _details$meta6 === void 0 ? void 0 : (_details$meta6$reques = _details$meta6.requestAccess) === null || _details$meta6$reques === void 0 ? void 0 : _details$meta6$reques.accessType;
|
|
77
|
+
};
|
|
74
78
|
export const isFinalState = status => {
|
|
75
79
|
return ['unauthorized', 'forbidden', 'errored', 'resolved', 'not_found'].indexOf(status) > -1;
|
|
76
80
|
};
|
package/dist/es2019/version.json
CHANGED
|
@@ -128,7 +128,7 @@ export const LinkWrapper = styled.div`
|
|
|
128
128
|
}
|
|
129
129
|
`;
|
|
130
130
|
|
|
131
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
131
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
132
132
|
export const Wrapper = styled.div`
|
|
133
133
|
${props => wrapperStyles(props)};
|
|
134
134
|
margin-top: 10px;
|
|
@@ -261,7 +261,7 @@ export const Byline = styled.div`
|
|
|
261
261
|
${ellipsis('100%')};
|
|
262
262
|
`;
|
|
263
263
|
|
|
264
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
264
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
265
265
|
export const Description = styled.div`
|
|
266
266
|
margin-top: 7px;
|
|
267
267
|
color: ${`var(--ds-text, ${colors.N800})`};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
-
/* eslint-disable @atlaskit/design-system/ensure-design-token-usage
|
|
2
|
+
/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
|
|
3
3
|
/** @jsx jsx */
|
|
4
4
|
import { jsx } from '@emotion/react';
|
|
5
5
|
import Button from '@atlaskit/button/custom-theme-button';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { css } from '@emotion/react';
|
|
2
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
2
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
3
3
|
export const containerStyles = css`
|
|
4
4
|
align-items: center;
|
|
5
5
|
display: flex;
|
|
@@ -5,7 +5,7 @@ import AtlaskitAvatarGroup from '@atlaskit/avatar-group';
|
|
|
5
5
|
import { SmartLinkSize } from '../../../../../constants';
|
|
6
6
|
const MAX_COUNT = 4;
|
|
7
7
|
const getStyles = size => {
|
|
8
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
8
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
9
9
|
const styles = css`
|
|
10
10
|
display: inline-flex;
|
|
11
11
|
ul {
|
|
@@ -34,7 +34,7 @@ export const contentStyles = css`
|
|
|
34
34
|
}
|
|
35
35
|
`;
|
|
36
36
|
|
|
37
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
37
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
38
38
|
export const linkStyles = css`
|
|
39
39
|
${sharedBlockStyles};
|
|
40
40
|
|
|
@@ -25,7 +25,7 @@ export const triggerButtonStyles = css`
|
|
|
25
25
|
}
|
|
26
26
|
`;
|
|
27
27
|
|
|
28
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
28
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
29
29
|
export const triggerLozengeStyles = css`
|
|
30
30
|
align-items: center;
|
|
31
31
|
display: flex;
|
|
@@ -30,9 +30,9 @@ export const Shimmer = ({
|
|
|
30
30
|
}) => {
|
|
31
31
|
const skeletonCustomStyles = {
|
|
32
32
|
position: 'absolute',
|
|
33
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
33
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
34
34
|
top: '50%',
|
|
35
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
35
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
36
36
|
left: '50%',
|
|
37
37
|
transform: 'translate(-50%, -50%)',
|
|
38
38
|
marginRight: "var(--ds-space-050, 4px)"
|
|
@@ -6,7 +6,7 @@ import { useMemo } from 'react';
|
|
|
6
6
|
import { getUrl } from '@atlaskit/linking-common';
|
|
7
7
|
import { chunkloadFailedEvent as _chunkloadFailedEvent, connectFailedEvent as _connectFailedEvent, connectSucceededEvent as _connectSucceededEvent, context, instrumentEvent, invokeFailedEvent as _invokeFailedEvent, invokeSucceededEvent as _invokeSucceededEvent, screenAuthPopupEvent, trackAppAccountAuthStarted, trackAppAccountConnected, uiActionClickedEvent, uiAuthAlternateAccountEvent, uiAuthEvent, uiCardClickedEvent, uiClosedAuthEvent, uiHoverCardDismissedEvent, uiHoverCardOpenLinkClickedEvent, uiHoverCardViewedEvent, uiLearnMoreLinkClickedEvent, uiRenderFailedEvent, uiRenderSuccessEvent, uiSmartLinkStatusLozengeButtonClicked, uiSmartLinkStatusListItemButtonClicked, uiSmartLinkStatusOpenPreviewButtonClicked } from '../../utils/analytics';
|
|
8
8
|
import { failUfoExperience, startUfoExperience, succeedUfoExperience } from './ufoExperiences';
|
|
9
|
-
import { getDefinitionId, getExtensionKey, getProduct, getResourceType, getSubproduct } from '../helpers';
|
|
9
|
+
import { getDefinitionId, getExtensionKey, getProduct, getResourceType, getStatusDetails, getSubproduct } from '../helpers';
|
|
10
10
|
import { useSmartLinkContext } from '@atlaskit/link-provider';
|
|
11
11
|
import { trackSmartLinkQuickActionFailed, trackSmartLinkQuickActionStarted, trackSmartLinkQuickActionSuccess, uiIframeDwelledEvent, uiIframeFocusedEvent } from '../../utils/analytics/analytics';
|
|
12
12
|
import { useDispatchAnalytics } from './useDispatchAnalytics';
|
|
@@ -52,6 +52,7 @@ export var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, _dispatch
|
|
|
52
52
|
var extractedResourceType = getResourceType(details);
|
|
53
53
|
var extractedSubproduct = getSubproduct(details);
|
|
54
54
|
var extractedProduct = getProduct(details);
|
|
55
|
+
var extractedStatusDetails = getStatusDetails(details);
|
|
55
56
|
var commonAttributes = useMemo(function () {
|
|
56
57
|
return {
|
|
57
58
|
id: defaultId,
|
|
@@ -61,9 +62,10 @@ export var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, _dispatch
|
|
|
61
62
|
destinationObjectType: extractedResourceType,
|
|
62
63
|
destinationSubproduct: extractedSubproduct,
|
|
63
64
|
destinationProduct: extractedProduct,
|
|
64
|
-
location: defaultLocation
|
|
65
|
+
location: defaultLocation,
|
|
66
|
+
statusDetails: extractedStatusDetails
|
|
65
67
|
};
|
|
66
|
-
}, [defaultId, extractedDefinitionId, extractedExtensionKey, extractedResourceType, extractedSubproduct, extractedProduct, defaultLocation]);
|
|
68
|
+
}, [defaultId, extractedDefinitionId, extractedExtensionKey, extractedResourceType, extractedSubproduct, extractedProduct, defaultLocation, extractedStatusDetails]);
|
|
67
69
|
|
|
68
70
|
/** Contains all ui analytics events */
|
|
69
71
|
var ui = useMemo(function () {
|
|
@@ -68,6 +68,10 @@ export var getStatus = function getStatus(_ref3) {
|
|
|
68
68
|
return 'resolved';
|
|
69
69
|
}
|
|
70
70
|
};
|
|
71
|
+
export var getStatusDetails = function getStatusDetails(details) {
|
|
72
|
+
var _details$meta6, _details$meta6$reques;
|
|
73
|
+
return details === null || details === void 0 ? void 0 : (_details$meta6 = details.meta) === null || _details$meta6 === void 0 ? void 0 : (_details$meta6$reques = _details$meta6.requestAccess) === null || _details$meta6$reques === void 0 ? void 0 : _details$meta6$reques.accessType;
|
|
74
|
+
};
|
|
71
75
|
export var isFinalState = function isFinalState(status) {
|
|
72
76
|
return ['unauthorized', 'forbidden', 'errored', 'resolved', 'not_found'].indexOf(status) > -1;
|
|
73
77
|
};
|
package/dist/esm/version.json
CHANGED
|
@@ -59,7 +59,7 @@ export var LinkWrapper = styled.div(_templateObject || (_templateObject = _tagge
|
|
|
59
59
|
return wrapperStyles(props);
|
|
60
60
|
});
|
|
61
61
|
|
|
62
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
62
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
63
63
|
export var Wrapper = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n ", ";\n margin-top: 10px;\n"])), function (props) {
|
|
64
64
|
return wrapperStyles(props);
|
|
65
65
|
});
|
|
@@ -107,7 +107,7 @@ export var ContentWrapper = styled.div(_templateObject8 || (_templateObject8 = _
|
|
|
107
107
|
export var Title = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n color: ", ";\n font-size: 16px;\n font-weight: 500;\n line-height: ", ";\n max-height: ", "px;\n overflow: hidden;\n"])), "var(--ds-text, ".concat(colors.N900, ")"), 20 / 16, 20 * 4);
|
|
108
108
|
export var Byline = styled.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n margin-top: ", ";\n color: ", ";\n font-size: 12px;\n font-weight: normal;\n line-height: ", ";\n ", ";\n"])), "var(--ds-space-050, 4px)", "var(--ds-text-subtlest, ".concat(colors.N300, ")"), 16 / 12, ellipsis('100%'));
|
|
109
109
|
|
|
110
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
110
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
111
111
|
export var Description = styled.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n margin-top: 7px;\n color: ", ";\n font-size: 12px;\n font-weight: normal;\n line-height: ", ";\n max-height: ", "px;\n overflow: hidden;\n"])), "var(--ds-text, ".concat(colors.N800, ")"), 18 / 12, 18 * 3);
|
|
112
112
|
export var ResolvedViewIconWrapper = styled.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n margin-top: ", ";\n"])), "var(--ds-space-050, 4px)");
|
|
113
113
|
export var Thumbnail = styled.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n ", "\n ", "\n float: right;\n margin: ", " 0 ", "\n ", ";\n background-color: ", ";\n background-image: url(", ");\n background-size: cover;\n"])), borderRadius, csssize(48), "var(--ds-space-050, 4px)", "var(--ds-space-150, 12px)", "var(--ds-space-150, 12px)", "var(--ds-skeleton, ".concat(colors.N30, ")"), function (_ref13) {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
-
/* eslint-disable @atlaskit/design-system/ensure-design-token-usage
|
|
2
|
+
/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
|
|
3
3
|
/** @jsx jsx */
|
|
4
4
|
import { jsx } from '@emotion/react';
|
|
5
5
|
import Button from '@atlaskit/button/custom-theme-button';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
|
|
2
2
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
3
3
|
import { css } from '@emotion/react';
|
|
4
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
4
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
5
5
|
export var containerStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n align-items: center;\n display: flex;\n gap: ", ";\n justify-content: space-between;\n // AK ModalBody has 2px padding top and bottom.\n // Using 14px here to create 16px gap between\n // link info and iframe\n padding: ", " ", " 14px\n ", ";\n"])), "var(--ds-space-100, 8px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)");
|
|
6
6
|
var iconSize = '24px';
|
|
7
7
|
export var iconCss = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n img,\n span,\n svg {\n height: ", ";\n min-height: ", ";\n max-height: ", ";\n width: ", ";\n min-width: ", ";\n max-width: ", ";\n }\n"])), iconSize, iconSize, iconSize, iconSize, iconSize, iconSize);
|
|
@@ -7,7 +7,7 @@ import AtlaskitAvatarGroup from '@atlaskit/avatar-group';
|
|
|
7
7
|
import { SmartLinkSize } from '../../../../../constants';
|
|
8
8
|
var MAX_COUNT = 4;
|
|
9
9
|
var getStyles = function getStyles(size) {
|
|
10
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
10
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
11
11
|
var styles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: inline-flex;\n ul {\n margin-right: 8px;\n }\n "])));
|
|
12
12
|
switch (size) {
|
|
13
13
|
case SmartLinkSize.XLarge:
|
|
@@ -7,7 +7,7 @@ export var dropdownItemGroupStyles = css(_templateObject || (_templateObject = _
|
|
|
7
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
8
|
export var contentStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n ", ";\n\n margin-top: ", ";\n align-items: flex-start;\n\n > span,\n > div {\n font-size: 0.875rem;\n line-height: 1.25rem;\n color: ", ";\n }\n"])), sharedBlockStyles, "var(--ds-space-025, 2px)", "var(--ds-text, ".concat(N800, ")"));
|
|
9
9
|
|
|
10
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
10
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
11
11
|
export var linkStyles = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n ", ";\n\n cursor: pointer;\n font-size: 0.875rem;\n margin-top: 10px;\n margin-left: ", ";\n margin-bottom: ", ";\n"])), sharedBlockStyles, "var(--ds-space-400, 32px)", "var(--ds-space-025, 2px)");
|
|
12
12
|
export var textStyles = function textStyles(maxLines) {
|
|
13
13
|
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n line-height: 1rem;\n white-space: normal;\n ", ";\n"])), getTruncateStyles(maxLines));
|
|
@@ -3,6 +3,6 @@ var _templateObject, _templateObject2, _templateObject3;
|
|
|
3
3
|
import { css } from '@emotion/react';
|
|
4
4
|
export var triggerButtonStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n all: unset;\n background-color: transparent;\n color: unset;\n cursor: pointer;\n font-family: unset;\n font-size: unset;\n font-style: unset;\n font-weight: unset;\n font-variant: unset;\n line-height: 0;\n padding: 0;\n text-transform: unset;\n\n border: 2px solid transparent;\n margin: ", ";\n\n &:focus-visible,\n &:focus-within,\n &[aria-expanded='true'] {\n outline: none;\n box-shadow: 0 0 0 2px ", ";\n border-radius: 5px;\n }\n"])), "var(--ds-space-025, 2px)", "var(--ds-border-focused, #388BFF)");
|
|
5
5
|
|
|
6
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
6
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
7
7
|
export var triggerLozengeStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n align-items: center;\n display: flex;\n\n span[role='img'] {\n margin: calc(-1 * ", ")\n calc(-1 * ", ")\n calc(-1 * ", ") -1px;\n }\n"])), "var(--ds-space-050, 4px)", "var(--ds-space-100, 8px)", "var(--ds-space-050, 4px)");
|
|
8
8
|
export var dropdownItemGroupStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n max-height: 300px;\n overflow-y: auto;\n\n button {\n padding: ", " ", ";\n min-height: 28px;\n width: 220px;\n\n &:hover {\n background-color: inherit;\n }\n\n &:focus,\n &:focus-visible {\n background-color: ", ";\n box-sizing: border-box;\n box-shadow: inset 2px 0 0 ", ";\n outline: none;\n }\n }\n"])), "var(--ds-space-075, 6px)", "var(--ds-space-150, 12px)", "var(--ds-background-neutral-subtle-hovered, #091E420F)", "var(--ds-border-selected, #0C66E4)");
|
|
@@ -19,9 +19,9 @@ export var Shimmer = function Shimmer(_ref) {
|
|
|
19
19
|
var testId = _ref.testId;
|
|
20
20
|
var skeletonCustomStyles = {
|
|
21
21
|
position: 'absolute',
|
|
22
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
22
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
23
23
|
top: '50%',
|
|
24
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
24
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
25
25
|
left: '50%',
|
|
26
26
|
transform: 'translate(-50%, -50%)',
|
|
27
27
|
marginRight: "var(--ds-space-050, 4px)"
|
|
@@ -13,4 +13,5 @@ export declare const hasResolved: (details?: JsonLd.Response) => boolean | undef
|
|
|
13
13
|
export declare const isAccessible: ({ meta: { access } }: JsonLd.Response) => boolean;
|
|
14
14
|
export declare const isVisible: ({ meta: { visibility } }: JsonLd.Response) => boolean;
|
|
15
15
|
export declare const getStatus: ({ meta }: JsonLd.Response) => CardType;
|
|
16
|
+
export declare const getStatusDetails: (details?: JsonLd.Response) => string | undefined;
|
|
16
17
|
export declare const isFinalState: (status: CardType) => boolean;
|
|
@@ -14,6 +14,7 @@ export interface CommonEventProps {
|
|
|
14
14
|
destinationSubproduct?: DestinationSubproduct | string;
|
|
15
15
|
destinationProduct?: DestinationProduct | string;
|
|
16
16
|
location?: string;
|
|
17
|
+
statusDetails?: string;
|
|
17
18
|
}
|
|
18
19
|
export type ResolvedEventProps = CommonEventProps & {
|
|
19
20
|
id: string;
|
|
@@ -13,4 +13,5 @@ export declare const hasResolved: (details?: JsonLd.Response) => boolean | undef
|
|
|
13
13
|
export declare const isAccessible: ({ meta: { access } }: JsonLd.Response) => boolean;
|
|
14
14
|
export declare const isVisible: ({ meta: { visibility } }: JsonLd.Response) => boolean;
|
|
15
15
|
export declare const getStatus: ({ meta }: JsonLd.Response) => CardType;
|
|
16
|
+
export declare const getStatusDetails: (details?: JsonLd.Response) => string | undefined;
|
|
16
17
|
export declare const isFinalState: (status: CardType) => boolean;
|
|
@@ -14,6 +14,7 @@ export interface CommonEventProps {
|
|
|
14
14
|
destinationSubproduct?: DestinationSubproduct | string;
|
|
15
15
|
destinationProduct?: DestinationProduct | string;
|
|
16
16
|
location?: string;
|
|
17
|
+
statusDetails?: string;
|
|
17
18
|
}
|
|
18
19
|
export type ResolvedEventProps = CommonEventProps & {
|
|
19
20
|
id: string;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/smart-card",
|
|
3
|
-
"version": "26.
|
|
3
|
+
"version": "26.7.0",
|
|
4
4
|
"description": "Smart card component",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
"@atlaskit/icon-object": "^6.3.0",
|
|
43
43
|
"@atlaskit/icon-priority": "^6.3.0",
|
|
44
44
|
"@atlaskit/in-product-testing": "^0.2.0",
|
|
45
|
-
"@atlaskit/link-analytics": "^8.0
|
|
45
|
+
"@atlaskit/link-analytics": "^8.1.0",
|
|
46
46
|
"@atlaskit/link-client-extension": "^1.5.0",
|
|
47
47
|
"@atlaskit/linking-common": "^3.1.0",
|
|
48
48
|
"@atlaskit/linking-types": "^8.0.0",
|
|
@@ -94,7 +94,7 @@
|
|
|
94
94
|
"@atlaskit/range": "^7.1.0",
|
|
95
95
|
"@atlaskit/section-message": "^6.4.0",
|
|
96
96
|
"@atlaskit/select": "^16.5.0",
|
|
97
|
-
"@atlaskit/table-tree": "^9.
|
|
97
|
+
"@atlaskit/table-tree": "^9.6.0",
|
|
98
98
|
"@atlaskit/tabs": "^13.4.0",
|
|
99
99
|
"@atlaskit/textfield": "^5.5.0",
|
|
100
100
|
"@atlaskit/toggle": "^12.6.0",
|
package/report.api.md
CHANGED