@atlaskit/smart-card 26.15.4 → 26.15.6
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 +12 -0
- package/dist/cjs/utils/analytics/analytics.js +2 -3
- package/dist/cjs/view/BlockCard/index.js +16 -8
- package/dist/cjs/view/BlockCard/views/flexible/FlexibleErroredView.js +5 -3
- package/dist/cjs/view/BlockCard/views/flexible/FlexibleForbiddenView.js +5 -3
- package/dist/cjs/view/BlockCard/views/flexible/FlexibleNotFoundView.js +5 -3
- package/dist/cjs/view/BlockCard/views/flexible/FlexibleResolvedView.js +3 -5
- package/dist/cjs/view/BlockCard/views/flexible/FlexibleUnauthorisedView.js +4 -3
- package/dist/cjs/view/BlockCard/views/flexible/styled.js +1 -1
- package/dist/cjs/view/HoverCard/styled.js +9 -5
- package/dist/cjs/view/LinkUrl/index.js +2 -3
- package/dist/es2019/utils/analytics/analytics.js +2 -3
- package/dist/es2019/view/BlockCard/index.js +16 -7
- package/dist/es2019/view/BlockCard/views/flexible/FlexibleErroredView.js +5 -3
- package/dist/es2019/view/BlockCard/views/flexible/FlexibleForbiddenView.js +5 -3
- package/dist/es2019/view/BlockCard/views/flexible/FlexibleNotFoundView.js +5 -3
- package/dist/es2019/view/BlockCard/views/flexible/FlexibleResolvedView.js +5 -7
- package/dist/es2019/view/BlockCard/views/flexible/FlexibleUnauthorisedView.js +4 -3
- package/dist/es2019/view/BlockCard/views/flexible/styled.js +4 -1
- package/dist/es2019/view/HoverCard/styled.js +9 -3
- package/dist/es2019/view/LinkUrl/index.js +2 -3
- package/dist/esm/utils/analytics/analytics.js +2 -3
- package/dist/esm/view/BlockCard/index.js +16 -8
- package/dist/esm/view/BlockCard/views/flexible/FlexibleErroredView.js +5 -3
- package/dist/esm/view/BlockCard/views/flexible/FlexibleForbiddenView.js +5 -3
- package/dist/esm/view/BlockCard/views/flexible/FlexibleNotFoundView.js +5 -3
- package/dist/esm/view/BlockCard/views/flexible/FlexibleResolvedView.js +5 -7
- package/dist/esm/view/BlockCard/views/flexible/FlexibleUnauthorisedView.js +4 -3
- package/dist/esm/view/BlockCard/views/flexible/styled.js +1 -1
- package/dist/esm/view/HoverCard/styled.js +9 -5
- package/dist/esm/view/LinkUrl/index.js +2 -3
- package/dist/types/utils/analytics/analytics.d.ts +2 -2
- package/dist/types/view/BlockCard/views/flexible/types.d.ts +5 -0
- package/dist/types/view/LinkUrl/types.d.ts +1 -1
- package/dist/types-ts4.5/utils/analytics/analytics.d.ts +2 -2
- package/dist/types-ts4.5/view/BlockCard/views/flexible/types.d.ts +5 -0
- package/dist/types-ts4.5/view/LinkUrl/types.d.ts +1 -1
- package/package.json +4 -4
- package/dist/cjs/version.json +0 -5
- package/dist/es2019/version.json +0 -5
- package/dist/esm/version.json +0 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @atlaskit/smart-card
|
|
2
2
|
|
|
3
|
+
## 26.15.6
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`ba101932150`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ba101932150) - [ux] Use semibold font-weight for title in flexible smart cards.
|
|
8
|
+
|
|
9
|
+
## 26.15.5
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`f01deb5e6ab`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f01deb5e6ab) - Use injected env vars instead of version.json
|
|
14
|
+
|
|
3
15
|
## 26.15.4
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
|
@@ -9,7 +9,6 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
9
9
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
10
10
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
11
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
12
|
-
var _version = require("../../version.json");
|
|
13
12
|
var _performance = require("../performance");
|
|
14
13
|
var _excluded = ["smartLinkActionType"],
|
|
15
14
|
_excluded2 = ["smartLinkActionType"],
|
|
@@ -21,8 +20,8 @@ var ANALYTICS_CHANNEL = 'media';
|
|
|
21
20
|
exports.ANALYTICS_CHANNEL = ANALYTICS_CHANNEL;
|
|
22
21
|
var context = {
|
|
23
22
|
componentName: 'smart-cards',
|
|
24
|
-
packageName:
|
|
25
|
-
packageVersion:
|
|
23
|
+
packageName: "@atlaskit/smart-card",
|
|
24
|
+
packageVersion: "26.15.6"
|
|
26
25
|
};
|
|
27
26
|
exports.context = context;
|
|
28
27
|
var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
|
|
@@ -83,6 +83,8 @@ var _react = require("@emotion/react");
|
|
|
83
83
|
var _handlers = require("./utils/handlers");
|
|
84
84
|
var _linkProvider = require("@atlaskit/link-provider");
|
|
85
85
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
86
|
+
var _styled = require("./views/flexible/styled");
|
|
87
|
+
var _constants = require("../../constants");
|
|
86
88
|
var _PreviewAction = _interopRequireDefault(require("./actions/PreviewAction"));
|
|
87
89
|
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; }
|
|
88
90
|
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; } /** @jsx jsx */
|
|
@@ -120,7 +122,12 @@ var BlockCard = function BlockCard(_ref) {
|
|
|
120
122
|
var enableImprovedPreviewAction = Boolean((0, _linkProvider.useFeatureFlag)('enableImprovedPreviewAction'));
|
|
121
123
|
if (enableFlexibleBlockCard) {
|
|
122
124
|
var anchorTarget = (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-block-card-clicks-opening-in-same-tab') ? '_self' : undefined;
|
|
123
|
-
var
|
|
125
|
+
var titleBlockProps = _objectSpread({
|
|
126
|
+
overrideCss: _styled.titleBlockCss
|
|
127
|
+
}, (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
|
|
128
|
+
size: _constants.SmartLinkSize.Large
|
|
129
|
+
});
|
|
130
|
+
var flexibleBlockCardProps = _objectSpread({
|
|
124
131
|
id: id,
|
|
125
132
|
cardState: cardState,
|
|
126
133
|
url: url,
|
|
@@ -133,28 +140,29 @@ var BlockCard = function BlockCard(_ref) {
|
|
|
133
140
|
renderers: renderers,
|
|
134
141
|
showServerActions: showServerActions,
|
|
135
142
|
analytics: analytics,
|
|
136
|
-
extensionKey: extensionKey
|
|
143
|
+
extensionKey: extensionKey,
|
|
144
|
+
titleBlockProps: titleBlockProps
|
|
137
145
|
}, anchorTarget ? {
|
|
138
146
|
anchorTarget: anchorTarget
|
|
139
147
|
} : {});
|
|
140
148
|
switch (status) {
|
|
141
149
|
case 'pending':
|
|
142
150
|
case 'resolving':
|
|
143
|
-
return (0, _react.jsx)(_FlexibleResolvedView.default, (0, _extends2.default)({},
|
|
151
|
+
return (0, _react.jsx)(_FlexibleResolvedView.default, (0, _extends2.default)({}, flexibleBlockCardProps, {
|
|
144
152
|
testId: 'smart-block-resolving-view'
|
|
145
153
|
}));
|
|
146
154
|
case 'resolved':
|
|
147
|
-
return (0, _react.jsx)(_FlexibleResolvedView.default,
|
|
155
|
+
return (0, _react.jsx)(_FlexibleResolvedView.default, flexibleBlockCardProps);
|
|
148
156
|
case 'unauthorized':
|
|
149
|
-
return (0, _react.jsx)(_FlexibleUnauthorisedView.default, (0, _extends2.default)({},
|
|
157
|
+
return (0, _react.jsx)(_FlexibleUnauthorisedView.default, (0, _extends2.default)({}, flexibleBlockCardProps, {
|
|
150
158
|
onAuthorize: handleAuthorize
|
|
151
159
|
}));
|
|
152
160
|
case 'forbidden':
|
|
153
|
-
return (0, _react.jsx)(_FlexibleForbiddenView.default, (0, _extends2.default)({},
|
|
161
|
+
return (0, _react.jsx)(_FlexibleForbiddenView.default, (0, _extends2.default)({}, flexibleBlockCardProps, {
|
|
154
162
|
onAuthorize: handleAuthorize
|
|
155
163
|
}));
|
|
156
164
|
case 'not_found':
|
|
157
|
-
return (0, _react.jsx)(_FlexibleNotFoundView.default, (0, _extends2.default)({},
|
|
165
|
+
return (0, _react.jsx)(_FlexibleNotFoundView.default, (0, _extends2.default)({}, flexibleBlockCardProps, {
|
|
158
166
|
onAuthorize: handleAuthorize
|
|
159
167
|
}));
|
|
160
168
|
case 'fallback':
|
|
@@ -174,7 +182,7 @@ var BlockCard = function BlockCard(_ref) {
|
|
|
174
182
|
testId: "".concat(testId, "-").concat(status)
|
|
175
183
|
});
|
|
176
184
|
}
|
|
177
|
-
return (0, _react.jsx)(_FlexibleErroredView.default, (0, _extends2.default)({},
|
|
185
|
+
return (0, _react.jsx)(_FlexibleErroredView.default, (0, _extends2.default)({}, flexibleBlockCardProps, {
|
|
178
186
|
onAuthorize: handleAuthorize
|
|
179
187
|
}));
|
|
180
188
|
}
|
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
8
|
exports.default = void 0;
|
|
9
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
11
|
var _FlexibleCard = _interopRequireDefault(require("../../../FlexibleCard"));
|
|
11
12
|
var _titleBlock = _interopRequireDefault(require("../../../FlexibleCard/components/blocks/title-block"));
|
|
@@ -33,7 +34,8 @@ var FlexibleErroredView = function FlexibleErroredView(_ref) {
|
|
|
33
34
|
url = _ref.url,
|
|
34
35
|
onClick = _ref.onClick,
|
|
35
36
|
_ref$testId = _ref.testId,
|
|
36
|
-
testId = _ref$testId === void 0 ? 'smart-block-errored-view' : _ref$testId
|
|
37
|
+
testId = _ref$testId === void 0 ? 'smart-block-errored-view' : _ref$testId,
|
|
38
|
+
titleBlockProps = _ref.titleBlockProps;
|
|
37
39
|
var status = cardState.status;
|
|
38
40
|
var actions = (0, _react.useMemo)(function () {
|
|
39
41
|
return onAuthorize ? [(0, _RetryAction.RetryAction)(onAuthorize)] : [];
|
|
@@ -48,10 +50,10 @@ var FlexibleErroredView = function FlexibleErroredView(_ref) {
|
|
|
48
50
|
hideElevation: true
|
|
49
51
|
},
|
|
50
52
|
url: url
|
|
51
|
-
}, /*#__PURE__*/_react.default.createElement(_titleBlock.default, {
|
|
53
|
+
}, /*#__PURE__*/_react.default.createElement(_titleBlock.default, (0, _extends2.default)({
|
|
52
54
|
hideRetry: true,
|
|
53
55
|
anchorTarget: anchorTarget
|
|
54
|
-
}), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_warning.default, {
|
|
56
|
+
}, titleBlockProps)), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_warning.default, {
|
|
55
57
|
label: "errored-warning-icon",
|
|
56
58
|
size: "small",
|
|
57
59
|
primaryColor: "var(--ds-icon-warning, ".concat(_colors.R300, ")"),
|
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
8
|
exports.default = void 0;
|
|
9
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
10
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
10
11
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
12
|
var _FlexibleCard = _interopRequireDefault(require("../../../FlexibleCard"));
|
|
@@ -39,7 +40,8 @@ var FlexibleForbiddenView = function FlexibleForbiddenView(_ref) {
|
|
|
39
40
|
onError = _ref.onError,
|
|
40
41
|
_ref$testId = _ref.testId,
|
|
41
42
|
testId = _ref$testId === void 0 ? 'smart-block-forbidden-view' : _ref$testId,
|
|
42
|
-
url = _ref.url
|
|
43
|
+
url = _ref.url,
|
|
44
|
+
titleBlockProps = _ref.titleBlockProps;
|
|
43
45
|
var status = cardState.status;
|
|
44
46
|
var details = cardState === null || cardState === void 0 ? void 0 : cardState.details;
|
|
45
47
|
var cardMetadata = (_details$meta = details === null || details === void 0 ? void 0 : details.meta) !== null && _details$meta !== void 0 ? _details$meta : (0, _jsonld.getForbiddenJsonLd)().meta;
|
|
@@ -72,10 +74,10 @@ var FlexibleForbiddenView = function FlexibleForbiddenView(_ref) {
|
|
|
72
74
|
hideElevation: true
|
|
73
75
|
},
|
|
74
76
|
url: url
|
|
75
|
-
}, /*#__PURE__*/_react.default.createElement(_titleBlock.default, {
|
|
77
|
+
}, /*#__PURE__*/_react.default.createElement(_titleBlock.default, (0, _extends2.default)({
|
|
76
78
|
hideRetry: true,
|
|
77
79
|
anchorTarget: anchorTarget
|
|
78
|
-
}), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_lockFilled.default, {
|
|
80
|
+
}, titleBlockProps)), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_lockFilled.default, {
|
|
79
81
|
label: "forbidden-lock-icon",
|
|
80
82
|
size: "small",
|
|
81
83
|
primaryColor: "var(--ds-icon-danger, ".concat(_colors.R300, ")"),
|
|
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.default = void 0;
|
|
8
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
8
9
|
var _react = _interopRequireDefault(require("react"));
|
|
9
10
|
var _FlexibleCard = _interopRequireDefault(require("../../../FlexibleCard"));
|
|
10
11
|
var _titleBlock = _interopRequireDefault(require("../../../FlexibleCard/components/blocks/title-block"));
|
|
@@ -29,7 +30,8 @@ var FlexibleNotFoundView = function FlexibleNotFoundView(_ref) {
|
|
|
29
30
|
url = _ref.url,
|
|
30
31
|
onClick = _ref.onClick,
|
|
31
32
|
_ref$testId = _ref.testId,
|
|
32
|
-
testId = _ref$testId === void 0 ? 'smart-block-not-found-view' : _ref$testId
|
|
33
|
+
testId = _ref$testId === void 0 ? 'smart-block-not-found-view' : _ref$testId,
|
|
34
|
+
titleBlockProps = _ref.titleBlockProps;
|
|
33
35
|
var status = cardState.status;
|
|
34
36
|
return /*#__PURE__*/_react.default.createElement(_FlexibleCard.default, {
|
|
35
37
|
appearance: "block",
|
|
@@ -42,10 +44,10 @@ var FlexibleNotFoundView = function FlexibleNotFoundView(_ref) {
|
|
|
42
44
|
hideElevation: true
|
|
43
45
|
},
|
|
44
46
|
url: url
|
|
45
|
-
}, /*#__PURE__*/_react.default.createElement(_titleBlock.default, {
|
|
47
|
+
}, /*#__PURE__*/_react.default.createElement(_titleBlock.default, (0, _extends2.default)({
|
|
46
48
|
hideRetry: true,
|
|
47
49
|
anchorTarget: anchorTarget
|
|
48
|
-
}), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_warning.default, {
|
|
50
|
+
}, titleBlockProps)), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_warning.default, {
|
|
49
51
|
label: "not-found-warning-icon",
|
|
50
52
|
size: "small",
|
|
51
53
|
primaryColor: "var(--ds-icon-warning, ".concat(_colors.R300, ")"),
|
|
@@ -36,7 +36,8 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
|
|
|
36
36
|
_ref$testId = _ref.testId,
|
|
37
37
|
testId = _ref$testId === void 0 ? 'smart-block-resolved-view' : _ref$testId,
|
|
38
38
|
url = _ref.url,
|
|
39
|
-
analytics = _ref.analytics
|
|
39
|
+
analytics = _ref.analytics,
|
|
40
|
+
titleBlockProps = _ref.titleBlockProps;
|
|
40
41
|
var _useState = (0, _react.useState)(false),
|
|
41
42
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
42
43
|
isPreviewBlockErrored = _useState2[0],
|
|
@@ -75,10 +76,7 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
|
|
|
75
76
|
}],
|
|
76
77
|
metadataPosition: _constants.SmartLinkPosition.Top,
|
|
77
78
|
anchorTarget: anchorTarget
|
|
78
|
-
}, (0,
|
|
79
|
-
overrideCss: _styled.titleBlockCss,
|
|
80
|
-
size: _constants.SmartLinkSize.Large
|
|
81
|
-
})), /*#__PURE__*/_react.default.createElement(_blocks.MetadataBlock, (0, _extends2.default)({
|
|
79
|
+
}, titleBlockProps)), /*#__PURE__*/_react.default.createElement(_blocks.MetadataBlock, (0, _extends2.default)({
|
|
82
80
|
primary: topMetadata,
|
|
83
81
|
maxLines: 1
|
|
84
82
|
}, (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
|
|
@@ -45,7 +45,8 @@ var FlexibleUnauthorisedView = function FlexibleUnauthorisedView(_ref) {
|
|
|
45
45
|
onError = _ref.onError,
|
|
46
46
|
_ref$testId = _ref.testId,
|
|
47
47
|
testId = _ref$testId === void 0 ? 'smart-block-unauthorized-view' : _ref$testId,
|
|
48
|
-
url = _ref.url
|
|
48
|
+
url = _ref.url,
|
|
49
|
+
titleBlockProps = _ref.titleBlockProps;
|
|
49
50
|
var data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
|
|
50
51
|
var providerName = (_extractProvider = (0, _linkExtractors.extractProvider)(data)) === null || _extractProvider === void 0 ? void 0 : _extractProvider.text;
|
|
51
52
|
var handleAuthorize = (0, _react.useCallback)(function () {
|
|
@@ -81,10 +82,10 @@ var FlexibleUnauthorisedView = function FlexibleUnauthorisedView(_ref) {
|
|
|
81
82
|
hideElevation: true
|
|
82
83
|
},
|
|
83
84
|
url: url
|
|
84
|
-
}, /*#__PURE__*/_react.default.createElement(_blocks.TitleBlock, {
|
|
85
|
+
}, /*#__PURE__*/_react.default.createElement(_blocks.TitleBlock, (0, _extends2.default)({
|
|
85
86
|
hideRetry: true,
|
|
86
87
|
anchorTarget: anchorTarget
|
|
87
|
-
}), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, {
|
|
88
|
+
}, titleBlockProps)), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, {
|
|
88
89
|
overrideCss: contentStyles,
|
|
89
90
|
testId: "".concat(testId, "-content")
|
|
90
91
|
}, /*#__PURE__*/_react.default.createElement("div", null, content)), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_footer.default, {
|
|
@@ -14,7 +14,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
|
14
14
|
// in editor prosemirror adds padding-left so we need to overwrite it
|
|
15
15
|
var metadataBlockCss = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n /* primary element group */\n span[data-smart-element-avatar-group] {\n > ul {\n padding-left: 0px;\n }\n }\n"])));
|
|
16
16
|
exports.metadataBlockCss = metadataBlockCss;
|
|
17
|
-
var titleBlockCss = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n gap: 0.5em;\n"
|
|
17
|
+
var titleBlockCss = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n ", "\n ", "\n"])), (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "gap: 0.5em;" : "", (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? "[data-smart-element=\"Title\"] {\n font-weight: 600;\n }" : "");
|
|
18
18
|
exports.titleBlockCss = titleBlockCss;
|
|
19
19
|
var flexibleBlockCardElevationStyle = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n border-radius: 1.5px;\n box-shadow: ", ";\n margin: ", ";\n"])), _token.tokens.elevation, "var(--ds-space-025, 2px)");
|
|
20
20
|
var refreshedFlexibleBlockCardStyle = (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n & > div {\n border-radius: ", ";\n border: 1px solid ", ";\n }\n"])), "var(--ds-border-radius-300, 12px)", "var(--ds-border-input, ".concat(_colors.N40, ")"));
|
|
@@ -6,25 +6,29 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.titleBlockCss = exports.separatorCss = exports.popupContainerStyles = exports.getTransitionStyles = exports.flexibleUiOptions = exports.HoverCardContainer = exports.HOVER_CARD_Z_INDEX = exports.CARD_WIDTH_REM = exports.CARD_GAP_PX = void 0;
|
|
8
8
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
9
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
10
|
var _react = require("@emotion/react");
|
|
10
11
|
var _index = require("../../index");
|
|
11
12
|
var _constants = require("../../constants");
|
|
12
13
|
var _constants2 = require("@atlaskit/theme/constants");
|
|
13
14
|
var _components = require("@atlaskit/theme/components");
|
|
15
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
14
16
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
17
|
+
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; }
|
|
18
|
+
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; }
|
|
15
19
|
// Temporary fix for Confluence inline comment on editor mod has z-index of 500, Jira issue view has z-index of 510
|
|
16
20
|
var HOVER_CARD_Z_INDEX = _constants2.layers.modal();
|
|
17
21
|
exports.HOVER_CARD_Z_INDEX = HOVER_CARD_Z_INDEX;
|
|
18
|
-
var flexibleUiOptions = {
|
|
22
|
+
var flexibleUiOptions = _objectSpread({
|
|
19
23
|
hideBackground: true,
|
|
20
24
|
hideElevation: true,
|
|
21
25
|
size: _constants.SmartLinkSize.Medium,
|
|
22
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
23
|
-
theme: _constants.SmartLinkTheme.Black,
|
|
24
26
|
hidePadding: true,
|
|
25
27
|
hideHoverCardPreviewButton: false,
|
|
26
28
|
zIndex: HOVER_CARD_Z_INDEX + 1
|
|
27
|
-
}
|
|
29
|
+
}, !(0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
|
|
30
|
+
theme: _constants.SmartLinkTheme.Black
|
|
31
|
+
});
|
|
28
32
|
exports.flexibleUiOptions = flexibleUiOptions;
|
|
29
33
|
var CARD_WIDTH_REM = 24;
|
|
30
34
|
// gap between mouse cursor and hover card
|
|
@@ -37,7 +41,7 @@ var separatorCss = (0, _react.css)(_templateObject || (_templateObject = (0, _ta
|
|
|
37
41
|
exports.separatorCss = separatorCss;
|
|
38
42
|
var HoverCardContainer = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n background: none;\n border-width: 0;\n box-sizing: border-box;\n width: ", "rem;\n padding: 1rem;\n\n .", " {\n display: none;\n }\n"])), CARD_WIDTH_REM, _index.loadingPlaceholderClassName);
|
|
39
43
|
exports.HoverCardContainer = HoverCardContainer;
|
|
40
|
-
var titleBlockCss = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n gap: ", ";\n\n ", "\n\n // title and subtitle element group\n [data-smart-element-group] {\n // gap between title and subtitle\n gap: 0.06rem;\n display: flex;\n /* subtitle element group */\n > [data-smart-element-group] {\n > span {\n margin-right: ", ";\n }\n }\n }\n"])), blockGap, separatorCss, elementGap);
|
|
44
|
+
var titleBlockCss = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n gap: ", ";\n\n ", "\n\n // title and subtitle element group\n [data-smart-element-group] {\n // gap between title and subtitle\n gap: 0.06rem;\n display: flex;\n /* subtitle element group */\n > [data-smart-element-group] {\n > span {\n margin-right: ", ";\n }\n }\n }\n\n ", "\n"])), blockGap, separatorCss, elementGap, (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? "[data-smart-element=\"Title\"] {\n font-weight: 600;\n }" : "");
|
|
41
45
|
exports.titleBlockCss = titleBlockCss;
|
|
42
46
|
var getTransitionStyles = function getTransitionStyles(snippetHeight) {
|
|
43
47
|
return (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n transition: height 300ms ease-in-out;\n height: ", "px;\n"])), snippetHeight);
|
|
@@ -9,7 +9,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
|
|
|
9
9
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
10
10
|
var _react = _interopRequireDefault(require("react"));
|
|
11
11
|
var _analyticsNext = require("@atlaskit/analytics-next");
|
|
12
|
-
var _version = require("../../version.json");
|
|
13
12
|
var _click = require("../../utils/analytics/click");
|
|
14
13
|
var _LinkAnalyticsContext = require("../../utils/analytics/LinkAnalyticsContext");
|
|
15
14
|
var _useLinkWarningModal2 = require("./LinkWarningModal/hooks/use-link-warning-modal");
|
|
@@ -18,8 +17,8 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
|
18
17
|
var _excluded = ["href", "children", "checkSafety", "onClick", "testId"],
|
|
19
18
|
_excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
|
|
20
19
|
var PACKAGE_DATA = {
|
|
21
|
-
packageName:
|
|
22
|
-
packageVersion:
|
|
20
|
+
packageName: "@atlaskit/smart-card",
|
|
21
|
+
packageVersion: "26.15.6",
|
|
23
22
|
componentName: 'linkUrl'
|
|
24
23
|
};
|
|
25
24
|
var Link = (0, _click.withLinkClickedEvent)('a');
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import { name as packageName, version as packageVersion } from '../../version.json';
|
|
2
1
|
import { getMeasure } from '../performance';
|
|
3
2
|
export const ANALYTICS_CHANNEL = 'media';
|
|
4
3
|
export const context = {
|
|
5
4
|
componentName: 'smart-cards',
|
|
6
|
-
packageName,
|
|
7
|
-
packageVersion
|
|
5
|
+
packageName: "@atlaskit/smart-card",
|
|
6
|
+
packageVersion: "26.15.6"
|
|
8
7
|
};
|
|
9
8
|
export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
|
|
10
9
|
TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
|
|
@@ -23,6 +23,8 @@ import { jsx } from '@emotion/react';
|
|
|
23
23
|
import { handleClickCommon } from './utils/handlers';
|
|
24
24
|
import { useFeatureFlag } from '@atlaskit/link-provider';
|
|
25
25
|
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
26
|
+
import { titleBlockCss } from './views/flexible/styled';
|
|
27
|
+
import { SmartLinkSize } from '../../constants';
|
|
26
28
|
export { default as PreviewAction } from './actions/PreviewAction';
|
|
27
29
|
export { ForbiddenAction, AuthorizeAction, BlockCardResolvedView, BlockCardResolvingView, BlockCardUnauthorisedView, BlockCardForbiddenView, BlockCardErroredView, BlockCardNotFoundView };
|
|
28
30
|
export const BlockCard = ({
|
|
@@ -62,7 +64,13 @@ export const BlockCard = ({
|
|
|
62
64
|
const enableImprovedPreviewAction = Boolean(useFeatureFlag('enableImprovedPreviewAction'));
|
|
63
65
|
if (enableFlexibleBlockCard) {
|
|
64
66
|
const anchorTarget = getBooleanFF('platform.linking-platform.smart-card.enable-block-card-clicks-opening-in-same-tab') ? '_self' : undefined;
|
|
65
|
-
const
|
|
67
|
+
const titleBlockProps = {
|
|
68
|
+
overrideCss: titleBlockCss,
|
|
69
|
+
...(getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
|
|
70
|
+
size: SmartLinkSize.Large
|
|
71
|
+
})
|
|
72
|
+
};
|
|
73
|
+
const flexibleBlockCardProps = {
|
|
66
74
|
id,
|
|
67
75
|
cardState,
|
|
68
76
|
url,
|
|
@@ -74,6 +82,7 @@ export const BlockCard = ({
|
|
|
74
82
|
showServerActions,
|
|
75
83
|
analytics,
|
|
76
84
|
extensionKey,
|
|
85
|
+
titleBlockProps: titleBlockProps,
|
|
77
86
|
...(anchorTarget ? {
|
|
78
87
|
anchorTarget
|
|
79
88
|
} : {})
|
|
@@ -81,21 +90,21 @@ export const BlockCard = ({
|
|
|
81
90
|
switch (status) {
|
|
82
91
|
case 'pending':
|
|
83
92
|
case 'resolving':
|
|
84
|
-
return jsx(FlexibleResolvedView, _extends({},
|
|
93
|
+
return jsx(FlexibleResolvedView, _extends({}, flexibleBlockCardProps, {
|
|
85
94
|
testId: 'smart-block-resolving-view'
|
|
86
95
|
}));
|
|
87
96
|
case 'resolved':
|
|
88
|
-
return jsx(FlexibleResolvedView,
|
|
97
|
+
return jsx(FlexibleResolvedView, flexibleBlockCardProps);
|
|
89
98
|
case 'unauthorized':
|
|
90
|
-
return jsx(FlexibleUnauthorisedView, _extends({},
|
|
99
|
+
return jsx(FlexibleUnauthorisedView, _extends({}, flexibleBlockCardProps, {
|
|
91
100
|
onAuthorize: handleAuthorize
|
|
92
101
|
}));
|
|
93
102
|
case 'forbidden':
|
|
94
|
-
return jsx(FlexibleForbiddenView, _extends({},
|
|
103
|
+
return jsx(FlexibleForbiddenView, _extends({}, flexibleBlockCardProps, {
|
|
95
104
|
onAuthorize: handleAuthorize
|
|
96
105
|
}));
|
|
97
106
|
case 'not_found':
|
|
98
|
-
return jsx(FlexibleNotFoundView, _extends({},
|
|
107
|
+
return jsx(FlexibleNotFoundView, _extends({}, flexibleBlockCardProps, {
|
|
99
108
|
onAuthorize: handleAuthorize
|
|
100
109
|
}));
|
|
101
110
|
case 'fallback':
|
|
@@ -115,7 +124,7 @@ export const BlockCard = ({
|
|
|
115
124
|
testId: `${testId}-${status}`
|
|
116
125
|
});
|
|
117
126
|
}
|
|
118
|
-
return jsx(FlexibleErroredView, _extends({},
|
|
127
|
+
return jsx(FlexibleErroredView, _extends({}, flexibleBlockCardProps, {
|
|
119
128
|
onAuthorize: handleAuthorize
|
|
120
129
|
}));
|
|
121
130
|
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
1
2
|
import React, { useMemo } from 'react';
|
|
2
3
|
import FlexibleCard from '../../../FlexibleCard';
|
|
3
4
|
import TitleBlock from '../../../FlexibleCard/components/blocks/title-block';
|
|
@@ -23,7 +24,8 @@ const FlexibleErroredView = ({
|
|
|
23
24
|
onError,
|
|
24
25
|
url,
|
|
25
26
|
onClick,
|
|
26
|
-
testId = 'smart-block-errored-view'
|
|
27
|
+
testId = 'smart-block-errored-view',
|
|
28
|
+
titleBlockProps
|
|
27
29
|
}) => {
|
|
28
30
|
const status = cardState.status;
|
|
29
31
|
const actions = useMemo(() => onAuthorize ? [RetryAction(onAuthorize)] : [], [onAuthorize]);
|
|
@@ -37,10 +39,10 @@ const FlexibleErroredView = ({
|
|
|
37
39
|
hideElevation: true
|
|
38
40
|
},
|
|
39
41
|
url: url
|
|
40
|
-
}, /*#__PURE__*/React.createElement(TitleBlock, {
|
|
42
|
+
}, /*#__PURE__*/React.createElement(TitleBlock, _extends({
|
|
41
43
|
hideRetry: true,
|
|
42
44
|
anchorTarget: anchorTarget
|
|
43
|
-
}), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(WarningIcon, {
|
|
45
|
+
}, titleBlockProps)), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(WarningIcon, {
|
|
44
46
|
label: "errored-warning-icon",
|
|
45
47
|
size: "small",
|
|
46
48
|
primaryColor: `var(--ds-icon-warning, ${R300})`,
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
1
2
|
import React, { useMemo } from 'react';
|
|
2
3
|
import FlexibleCard from '../../../FlexibleCard';
|
|
3
4
|
import TitleBlock from '../../../FlexibleCard/components/blocks/title-block';
|
|
@@ -27,7 +28,8 @@ const FlexibleForbiddenView = ({
|
|
|
27
28
|
onClick,
|
|
28
29
|
onError,
|
|
29
30
|
testId = 'smart-block-forbidden-view',
|
|
30
|
-
url
|
|
31
|
+
url,
|
|
32
|
+
titleBlockProps
|
|
31
33
|
}) => {
|
|
32
34
|
var _details$meta;
|
|
33
35
|
const status = cardState.status;
|
|
@@ -64,10 +66,10 @@ const FlexibleForbiddenView = ({
|
|
|
64
66
|
hideElevation: true
|
|
65
67
|
},
|
|
66
68
|
url: url
|
|
67
|
-
}, /*#__PURE__*/React.createElement(TitleBlock, {
|
|
69
|
+
}, /*#__PURE__*/React.createElement(TitleBlock, _extends({
|
|
68
70
|
hideRetry: true,
|
|
69
71
|
anchorTarget: anchorTarget
|
|
70
|
-
}), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(LockIcon, {
|
|
72
|
+
}, titleBlockProps)), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(LockIcon, {
|
|
71
73
|
label: "forbidden-lock-icon",
|
|
72
74
|
size: "small",
|
|
73
75
|
primaryColor: `var(--ds-icon-danger, ${R300})`,
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
1
2
|
import React from 'react';
|
|
2
3
|
import FlexibleCard from '../../../FlexibleCard';
|
|
3
4
|
import TitleBlock from '../../../FlexibleCard/components/blocks/title-block';
|
|
@@ -22,7 +23,8 @@ const FlexibleNotFoundView = ({
|
|
|
22
23
|
onError,
|
|
23
24
|
url,
|
|
24
25
|
onClick,
|
|
25
|
-
testId = 'smart-block-not-found-view'
|
|
26
|
+
testId = 'smart-block-not-found-view',
|
|
27
|
+
titleBlockProps
|
|
26
28
|
}) => {
|
|
27
29
|
const status = cardState.status;
|
|
28
30
|
return /*#__PURE__*/React.createElement(FlexibleCard, {
|
|
@@ -36,10 +38,10 @@ const FlexibleNotFoundView = ({
|
|
|
36
38
|
hideElevation: true
|
|
37
39
|
},
|
|
38
40
|
url: url
|
|
39
|
-
}, /*#__PURE__*/React.createElement(TitleBlock, {
|
|
41
|
+
}, /*#__PURE__*/React.createElement(TitleBlock, _extends({
|
|
40
42
|
hideRetry: true,
|
|
41
43
|
anchorTarget: anchorTarget
|
|
42
|
-
}), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(WarningIcon, {
|
|
44
|
+
}, titleBlockProps)), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(WarningIcon, {
|
|
43
45
|
label: "not-found-warning-icon",
|
|
44
46
|
size: "small",
|
|
45
47
|
primaryColor: `var(--ds-icon-warning, ${R300})`,
|
|
@@ -3,8 +3,8 @@ import React, { useEffect, useState } from 'react';
|
|
|
3
3
|
import FlexibleCard from '../../../FlexibleCard';
|
|
4
4
|
import TitleBlock from '../../../FlexibleCard/components/blocks/title-block';
|
|
5
5
|
import { FooterBlock, MetadataBlock, PreviewBlock, SnippetBlock } from '../../../FlexibleCard/components/blocks';
|
|
6
|
-
import { metadataBlockCss
|
|
7
|
-
import { ActionName, CardDisplay, ElementName, MediaPlacement, SmartLinkPosition
|
|
6
|
+
import { metadataBlockCss } from './styled';
|
|
7
|
+
import { ActionName, CardDisplay, ElementName, MediaPlacement, SmartLinkPosition } from '../../../../constants';
|
|
8
8
|
import uuid from 'uuid';
|
|
9
9
|
import { getSimulatedMetadata, getSimulatedBetterMetadata } from './utils';
|
|
10
10
|
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
@@ -25,7 +25,8 @@ const FlexibleResolvedView = ({
|
|
|
25
25
|
anchorTarget,
|
|
26
26
|
testId = 'smart-block-resolved-view',
|
|
27
27
|
url,
|
|
28
|
-
analytics
|
|
28
|
+
analytics,
|
|
29
|
+
titleBlockProps
|
|
29
30
|
}) => {
|
|
30
31
|
const [isPreviewBlockErrored, setIsPreviewBlockErrored] = useState(false);
|
|
31
32
|
useEffect(() => {
|
|
@@ -59,10 +60,7 @@ const FlexibleResolvedView = ({
|
|
|
59
60
|
}],
|
|
60
61
|
metadataPosition: SmartLinkPosition.Top,
|
|
61
62
|
anchorTarget: anchorTarget
|
|
62
|
-
},
|
|
63
|
-
overrideCss: titleBlockCss,
|
|
64
|
-
size: SmartLinkSize.Large
|
|
65
|
-
})), /*#__PURE__*/React.createElement(MetadataBlock, _extends({
|
|
63
|
+
}, titleBlockProps)), /*#__PURE__*/React.createElement(MetadataBlock, _extends({
|
|
66
64
|
primary: topMetadata,
|
|
67
65
|
maxLines: 1
|
|
68
66
|
}, getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
|
|
@@ -34,7 +34,8 @@ const FlexibleUnauthorisedView = ({
|
|
|
34
34
|
onClick,
|
|
35
35
|
onError,
|
|
36
36
|
testId = 'smart-block-unauthorized-view',
|
|
37
|
-
url
|
|
37
|
+
url,
|
|
38
|
+
titleBlockProps
|
|
38
39
|
}) => {
|
|
39
40
|
var _cardState$details, _extractProvider;
|
|
40
41
|
const data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
|
|
@@ -68,10 +69,10 @@ const FlexibleUnauthorisedView = ({
|
|
|
68
69
|
hideElevation: true
|
|
69
70
|
},
|
|
70
71
|
url: url
|
|
71
|
-
}, /*#__PURE__*/React.createElement(TitleBlock, {
|
|
72
|
+
}, /*#__PURE__*/React.createElement(TitleBlock, _extends({
|
|
72
73
|
hideRetry: true,
|
|
73
74
|
anchorTarget: anchorTarget
|
|
74
|
-
}), /*#__PURE__*/React.createElement(CustomBlock, {
|
|
75
|
+
}, titleBlockProps)), /*#__PURE__*/React.createElement(CustomBlock, {
|
|
75
76
|
overrideCss: contentStyles,
|
|
76
77
|
testId: `${testId}-content`
|
|
77
78
|
}, /*#__PURE__*/React.createElement("div", null, content)), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(BlockCardFooter, {
|
|
@@ -13,7 +13,10 @@ export const metadataBlockCss = css`
|
|
|
13
13
|
}
|
|
14
14
|
`;
|
|
15
15
|
export const titleBlockCss = css`
|
|
16
|
-
gap: 0.5em
|
|
16
|
+
${getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? `gap: 0.5em;` : ``}
|
|
17
|
+
${getBooleanFF('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? `[data-smart-element="Title"] {
|
|
18
|
+
font-weight: 600;
|
|
19
|
+
}` : ``}
|
|
17
20
|
`;
|
|
18
21
|
const flexibleBlockCardElevationStyle = css`
|
|
19
22
|
border-radius: 1.5px;
|
|
@@ -3,6 +3,7 @@ import { loadingPlaceholderClassName } from '../../index';
|
|
|
3
3
|
import { SmartLinkSize, SmartLinkTheme } from '../../constants';
|
|
4
4
|
import { layers } from '@atlaskit/theme/constants';
|
|
5
5
|
import { themed } from '@atlaskit/theme/components';
|
|
6
|
+
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
6
7
|
|
|
7
8
|
// Temporary fix for Confluence inline comment on editor mod has z-index of 500, Jira issue view has z-index of 510
|
|
8
9
|
export const HOVER_CARD_Z_INDEX = layers.modal();
|
|
@@ -10,11 +11,12 @@ export const flexibleUiOptions = {
|
|
|
10
11
|
hideBackground: true,
|
|
11
12
|
hideElevation: true,
|
|
12
13
|
size: SmartLinkSize.Medium,
|
|
13
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
14
|
-
theme: SmartLinkTheme.Black,
|
|
15
14
|
hidePadding: true,
|
|
16
15
|
hideHoverCardPreviewButton: false,
|
|
17
|
-
zIndex: HOVER_CARD_Z_INDEX + 1
|
|
16
|
+
zIndex: HOVER_CARD_Z_INDEX + 1,
|
|
17
|
+
...(!getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
|
|
18
|
+
theme: SmartLinkTheme.Black
|
|
19
|
+
})
|
|
18
20
|
};
|
|
19
21
|
export const CARD_WIDTH_REM = 24;
|
|
20
22
|
// gap between mouse cursor and hover card
|
|
@@ -54,6 +56,10 @@ export const titleBlockCss = css`
|
|
|
54
56
|
}
|
|
55
57
|
}
|
|
56
58
|
}
|
|
59
|
+
|
|
60
|
+
${getBooleanFF('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? `[data-smart-element="Title"] {
|
|
61
|
+
font-weight: 600;
|
|
62
|
+
}` : ``}
|
|
57
63
|
`;
|
|
58
64
|
export const getTransitionStyles = snippetHeight => css`
|
|
59
65
|
transition: height 300ms ease-in-out;
|
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { withAnalyticsContext } from '@atlaskit/analytics-next';
|
|
4
|
-
import { name as packageName, version as packageVersion } from '../../version.json';
|
|
5
4
|
import { withLinkClickedEvent } from '../../utils/analytics/click';
|
|
6
5
|
import { LinkAnalyticsContext } from '../../utils/analytics/LinkAnalyticsContext';
|
|
7
6
|
import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
|
|
8
7
|
import LinkWarningModal from './LinkWarningModal';
|
|
9
8
|
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
10
9
|
const PACKAGE_DATA = {
|
|
11
|
-
packageName,
|
|
12
|
-
packageVersion,
|
|
10
|
+
packageName: "@atlaskit/smart-card",
|
|
11
|
+
packageVersion: "26.15.6",
|
|
13
12
|
componentName: 'linkUrl'
|
|
14
13
|
};
|
|
15
14
|
const Link = withLinkClickedEvent('a');
|
|
@@ -8,13 +8,12 @@ var _excluded = ["smartLinkActionType"],
|
|
|
8
8
|
_excluded4 = ["display"];
|
|
9
9
|
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; }
|
|
10
10
|
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; }
|
|
11
|
-
import { name as packageName, version as packageVersion } from '../../version.json';
|
|
12
11
|
import { getMeasure } from '../performance';
|
|
13
12
|
export var ANALYTICS_CHANNEL = 'media';
|
|
14
13
|
export var context = {
|
|
15
14
|
componentName: 'smart-cards',
|
|
16
|
-
packageName:
|
|
17
|
-
packageVersion:
|
|
15
|
+
packageName: "@atlaskit/smart-card",
|
|
16
|
+
packageVersion: "26.15.6"
|
|
18
17
|
};
|
|
19
18
|
export var TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
|
|
20
19
|
TrackQuickActionType["StatusUpdate"] = "StatusUpdate";
|
|
@@ -26,6 +26,8 @@ import { jsx } from '@emotion/react';
|
|
|
26
26
|
import { handleClickCommon } from './utils/handlers';
|
|
27
27
|
import { useFeatureFlag } from '@atlaskit/link-provider';
|
|
28
28
|
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
29
|
+
import { titleBlockCss } from './views/flexible/styled';
|
|
30
|
+
import { SmartLinkSize } from '../../constants';
|
|
29
31
|
export { default as PreviewAction } from './actions/PreviewAction';
|
|
30
32
|
export { ForbiddenAction, AuthorizeAction, BlockCardResolvedView, BlockCardResolvingView, BlockCardUnauthorisedView, BlockCardForbiddenView, BlockCardErroredView, BlockCardNotFoundView };
|
|
31
33
|
export var BlockCard = function BlockCard(_ref) {
|
|
@@ -62,7 +64,12 @@ export var BlockCard = function BlockCard(_ref) {
|
|
|
62
64
|
var enableImprovedPreviewAction = Boolean(useFeatureFlag('enableImprovedPreviewAction'));
|
|
63
65
|
if (enableFlexibleBlockCard) {
|
|
64
66
|
var anchorTarget = getBooleanFF('platform.linking-platform.smart-card.enable-block-card-clicks-opening-in-same-tab') ? '_self' : undefined;
|
|
65
|
-
var
|
|
67
|
+
var titleBlockProps = _objectSpread({
|
|
68
|
+
overrideCss: titleBlockCss
|
|
69
|
+
}, getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
|
|
70
|
+
size: SmartLinkSize.Large
|
|
71
|
+
});
|
|
72
|
+
var flexibleBlockCardProps = _objectSpread({
|
|
66
73
|
id: id,
|
|
67
74
|
cardState: cardState,
|
|
68
75
|
url: url,
|
|
@@ -75,28 +82,29 @@ export var BlockCard = function BlockCard(_ref) {
|
|
|
75
82
|
renderers: renderers,
|
|
76
83
|
showServerActions: showServerActions,
|
|
77
84
|
analytics: analytics,
|
|
78
|
-
extensionKey: extensionKey
|
|
85
|
+
extensionKey: extensionKey,
|
|
86
|
+
titleBlockProps: titleBlockProps
|
|
79
87
|
}, anchorTarget ? {
|
|
80
88
|
anchorTarget: anchorTarget
|
|
81
89
|
} : {});
|
|
82
90
|
switch (status) {
|
|
83
91
|
case 'pending':
|
|
84
92
|
case 'resolving':
|
|
85
|
-
return jsx(FlexibleResolvedView, _extends({},
|
|
93
|
+
return jsx(FlexibleResolvedView, _extends({}, flexibleBlockCardProps, {
|
|
86
94
|
testId: 'smart-block-resolving-view'
|
|
87
95
|
}));
|
|
88
96
|
case 'resolved':
|
|
89
|
-
return jsx(FlexibleResolvedView,
|
|
97
|
+
return jsx(FlexibleResolvedView, flexibleBlockCardProps);
|
|
90
98
|
case 'unauthorized':
|
|
91
|
-
return jsx(FlexibleUnauthorisedView, _extends({},
|
|
99
|
+
return jsx(FlexibleUnauthorisedView, _extends({}, flexibleBlockCardProps, {
|
|
92
100
|
onAuthorize: handleAuthorize
|
|
93
101
|
}));
|
|
94
102
|
case 'forbidden':
|
|
95
|
-
return jsx(FlexibleForbiddenView, _extends({},
|
|
103
|
+
return jsx(FlexibleForbiddenView, _extends({}, flexibleBlockCardProps, {
|
|
96
104
|
onAuthorize: handleAuthorize
|
|
97
105
|
}));
|
|
98
106
|
case 'not_found':
|
|
99
|
-
return jsx(FlexibleNotFoundView, _extends({},
|
|
107
|
+
return jsx(FlexibleNotFoundView, _extends({}, flexibleBlockCardProps, {
|
|
100
108
|
onAuthorize: handleAuthorize
|
|
101
109
|
}));
|
|
102
110
|
case 'fallback':
|
|
@@ -116,7 +124,7 @@ export var BlockCard = function BlockCard(_ref) {
|
|
|
116
124
|
testId: "".concat(testId, "-").concat(status)
|
|
117
125
|
});
|
|
118
126
|
}
|
|
119
|
-
return jsx(FlexibleErroredView, _extends({},
|
|
127
|
+
return jsx(FlexibleErroredView, _extends({}, flexibleBlockCardProps, {
|
|
120
128
|
onAuthorize: handleAuthorize
|
|
121
129
|
}));
|
|
122
130
|
}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
1
2
|
import React, { useMemo } from 'react';
|
|
2
3
|
import FlexibleCard from '../../../FlexibleCard';
|
|
3
4
|
import TitleBlock from '../../../FlexibleCard/components/blocks/title-block';
|
|
@@ -24,7 +25,8 @@ var FlexibleErroredView = function FlexibleErroredView(_ref) {
|
|
|
24
25
|
url = _ref.url,
|
|
25
26
|
onClick = _ref.onClick,
|
|
26
27
|
_ref$testId = _ref.testId,
|
|
27
|
-
testId = _ref$testId === void 0 ? 'smart-block-errored-view' : _ref$testId
|
|
28
|
+
testId = _ref$testId === void 0 ? 'smart-block-errored-view' : _ref$testId,
|
|
29
|
+
titleBlockProps = _ref.titleBlockProps;
|
|
28
30
|
var status = cardState.status;
|
|
29
31
|
var actions = useMemo(function () {
|
|
30
32
|
return onAuthorize ? [RetryAction(onAuthorize)] : [];
|
|
@@ -39,10 +41,10 @@ var FlexibleErroredView = function FlexibleErroredView(_ref) {
|
|
|
39
41
|
hideElevation: true
|
|
40
42
|
},
|
|
41
43
|
url: url
|
|
42
|
-
}, /*#__PURE__*/React.createElement(TitleBlock, {
|
|
44
|
+
}, /*#__PURE__*/React.createElement(TitleBlock, _extends({
|
|
43
45
|
hideRetry: true,
|
|
44
46
|
anchorTarget: anchorTarget
|
|
45
|
-
}), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(WarningIcon, {
|
|
47
|
+
}, titleBlockProps)), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(WarningIcon, {
|
|
46
48
|
label: "errored-warning-icon",
|
|
47
49
|
size: "small",
|
|
48
50
|
primaryColor: "var(--ds-icon-warning, ".concat(R300, ")"),
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
1
2
|
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
2
3
|
import React, { useMemo } from 'react';
|
|
3
4
|
import FlexibleCard from '../../../FlexibleCard';
|
|
@@ -30,7 +31,8 @@ var FlexibleForbiddenView = function FlexibleForbiddenView(_ref) {
|
|
|
30
31
|
onError = _ref.onError,
|
|
31
32
|
_ref$testId = _ref.testId,
|
|
32
33
|
testId = _ref$testId === void 0 ? 'smart-block-forbidden-view' : _ref$testId,
|
|
33
|
-
url = _ref.url
|
|
34
|
+
url = _ref.url,
|
|
35
|
+
titleBlockProps = _ref.titleBlockProps;
|
|
34
36
|
var status = cardState.status;
|
|
35
37
|
var details = cardState === null || cardState === void 0 ? void 0 : cardState.details;
|
|
36
38
|
var cardMetadata = (_details$meta = details === null || details === void 0 ? void 0 : details.meta) !== null && _details$meta !== void 0 ? _details$meta : getForbiddenJsonLd().meta;
|
|
@@ -63,10 +65,10 @@ var FlexibleForbiddenView = function FlexibleForbiddenView(_ref) {
|
|
|
63
65
|
hideElevation: true
|
|
64
66
|
},
|
|
65
67
|
url: url
|
|
66
|
-
}, /*#__PURE__*/React.createElement(TitleBlock, {
|
|
68
|
+
}, /*#__PURE__*/React.createElement(TitleBlock, _extends({
|
|
67
69
|
hideRetry: true,
|
|
68
70
|
anchorTarget: anchorTarget
|
|
69
|
-
}), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(LockIcon, {
|
|
71
|
+
}, titleBlockProps)), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(LockIcon, {
|
|
70
72
|
label: "forbidden-lock-icon",
|
|
71
73
|
size: "small",
|
|
72
74
|
primaryColor: "var(--ds-icon-danger, ".concat(R300, ")"),
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
1
2
|
import React from 'react';
|
|
2
3
|
import FlexibleCard from '../../../FlexibleCard';
|
|
3
4
|
import TitleBlock from '../../../FlexibleCard/components/blocks/title-block';
|
|
@@ -23,7 +24,8 @@ var FlexibleNotFoundView = function FlexibleNotFoundView(_ref) {
|
|
|
23
24
|
url = _ref.url,
|
|
24
25
|
onClick = _ref.onClick,
|
|
25
26
|
_ref$testId = _ref.testId,
|
|
26
|
-
testId = _ref$testId === void 0 ? 'smart-block-not-found-view' : _ref$testId
|
|
27
|
+
testId = _ref$testId === void 0 ? 'smart-block-not-found-view' : _ref$testId,
|
|
28
|
+
titleBlockProps = _ref.titleBlockProps;
|
|
27
29
|
var status = cardState.status;
|
|
28
30
|
return /*#__PURE__*/React.createElement(FlexibleCard, {
|
|
29
31
|
appearance: "block",
|
|
@@ -36,10 +38,10 @@ var FlexibleNotFoundView = function FlexibleNotFoundView(_ref) {
|
|
|
36
38
|
hideElevation: true
|
|
37
39
|
},
|
|
38
40
|
url: url
|
|
39
|
-
}, /*#__PURE__*/React.createElement(TitleBlock, {
|
|
41
|
+
}, /*#__PURE__*/React.createElement(TitleBlock, _extends({
|
|
40
42
|
hideRetry: true,
|
|
41
43
|
anchorTarget: anchorTarget
|
|
42
|
-
}), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(WarningIcon, {
|
|
44
|
+
}, titleBlockProps)), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(WarningIcon, {
|
|
43
45
|
label: "not-found-warning-icon",
|
|
44
46
|
size: "small",
|
|
45
47
|
primaryColor: "var(--ds-icon-warning, ".concat(R300, ")"),
|
|
@@ -4,8 +4,8 @@ import React, { useEffect, useState } from 'react';
|
|
|
4
4
|
import FlexibleCard from '../../../FlexibleCard';
|
|
5
5
|
import TitleBlock from '../../../FlexibleCard/components/blocks/title-block';
|
|
6
6
|
import { FooterBlock, MetadataBlock, PreviewBlock, SnippetBlock } from '../../../FlexibleCard/components/blocks';
|
|
7
|
-
import { metadataBlockCss
|
|
8
|
-
import { ActionName, CardDisplay, ElementName, MediaPlacement, SmartLinkPosition
|
|
7
|
+
import { metadataBlockCss } from './styled';
|
|
8
|
+
import { ActionName, CardDisplay, ElementName, MediaPlacement, SmartLinkPosition } from '../../../../constants';
|
|
9
9
|
import uuid from 'uuid';
|
|
10
10
|
import { getSimulatedMetadata, getSimulatedBetterMetadata } from './utils';
|
|
11
11
|
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
@@ -27,7 +27,8 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
|
|
|
27
27
|
_ref$testId = _ref.testId,
|
|
28
28
|
testId = _ref$testId === void 0 ? 'smart-block-resolved-view' : _ref$testId,
|
|
29
29
|
url = _ref.url,
|
|
30
|
-
analytics = _ref.analytics
|
|
30
|
+
analytics = _ref.analytics,
|
|
31
|
+
titleBlockProps = _ref.titleBlockProps;
|
|
31
32
|
var _useState = useState(false),
|
|
32
33
|
_useState2 = _slicedToArray(_useState, 2),
|
|
33
34
|
isPreviewBlockErrored = _useState2[0],
|
|
@@ -66,10 +67,7 @@ var FlexibleResolvedView = function FlexibleResolvedView(_ref) {
|
|
|
66
67
|
}],
|
|
67
68
|
metadataPosition: SmartLinkPosition.Top,
|
|
68
69
|
anchorTarget: anchorTarget
|
|
69
|
-
},
|
|
70
|
-
overrideCss: titleBlockCss,
|
|
71
|
-
size: SmartLinkSize.Large
|
|
72
|
-
})), /*#__PURE__*/React.createElement(MetadataBlock, _extends({
|
|
70
|
+
}, titleBlockProps)), /*#__PURE__*/React.createElement(MetadataBlock, _extends({
|
|
73
71
|
primary: topMetadata,
|
|
74
72
|
maxLines: 1
|
|
75
73
|
}, getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
|
|
@@ -35,7 +35,8 @@ var FlexibleUnauthorisedView = function FlexibleUnauthorisedView(_ref) {
|
|
|
35
35
|
onError = _ref.onError,
|
|
36
36
|
_ref$testId = _ref.testId,
|
|
37
37
|
testId = _ref$testId === void 0 ? 'smart-block-unauthorized-view' : _ref$testId,
|
|
38
|
-
url = _ref.url
|
|
38
|
+
url = _ref.url,
|
|
39
|
+
titleBlockProps = _ref.titleBlockProps;
|
|
39
40
|
var data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
|
|
40
41
|
var providerName = (_extractProvider = extractProvider(data)) === null || _extractProvider === void 0 ? void 0 : _extractProvider.text;
|
|
41
42
|
var handleAuthorize = useCallback(function () {
|
|
@@ -71,10 +72,10 @@ var FlexibleUnauthorisedView = function FlexibleUnauthorisedView(_ref) {
|
|
|
71
72
|
hideElevation: true
|
|
72
73
|
},
|
|
73
74
|
url: url
|
|
74
|
-
}, /*#__PURE__*/React.createElement(TitleBlock, {
|
|
75
|
+
}, /*#__PURE__*/React.createElement(TitleBlock, _extends({
|
|
75
76
|
hideRetry: true,
|
|
76
77
|
anchorTarget: anchorTarget
|
|
77
|
-
}), /*#__PURE__*/React.createElement(CustomBlock, {
|
|
78
|
+
}, titleBlockProps)), /*#__PURE__*/React.createElement(CustomBlock, {
|
|
78
79
|
overrideCss: contentStyles,
|
|
79
80
|
testId: "".concat(testId, "-content")
|
|
80
81
|
}, /*#__PURE__*/React.createElement("div", null, content)), /*#__PURE__*/React.createElement(CustomBlock, null, /*#__PURE__*/React.createElement(BlockCardFooter, {
|
|
@@ -7,7 +7,7 @@ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
|
7
7
|
|
|
8
8
|
// in editor prosemirror adds padding-left so we need to overwrite it
|
|
9
9
|
export var metadataBlockCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n /* primary element group */\n span[data-smart-element-avatar-group] {\n > ul {\n padding-left: 0px;\n }\n }\n"])));
|
|
10
|
-
export var titleBlockCss = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n gap: 0.5em;\n"
|
|
10
|
+
export var titleBlockCss = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n ", "\n ", "\n"])), getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "gap: 0.5em;" : "", getBooleanFF('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? "[data-smart-element=\"Title\"] {\n font-weight: 600;\n }" : "");
|
|
11
11
|
var flexibleBlockCardElevationStyle = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n border-radius: 1.5px;\n box-shadow: ", ";\n margin: ", ";\n"])), tokens.elevation, "var(--ds-space-025, 2px)");
|
|
12
12
|
var refreshedFlexibleBlockCardStyle = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n & > div {\n border-radius: ", ";\n border: 1px solid ", ";\n }\n"])), "var(--ds-border-radius-300, 12px)", "var(--ds-border-input, ".concat(N40, ")"));
|
|
13
13
|
export var flexibleBlockCardStyle = getBooleanFF('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? refreshedFlexibleBlockCardStyle : flexibleBlockCardElevationStyle;
|
|
@@ -1,23 +1,27 @@
|
|
|
1
1
|
import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
|
|
2
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
3
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
4
|
+
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; }
|
|
5
|
+
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; }
|
|
3
6
|
import { css } from '@emotion/react';
|
|
4
7
|
import { loadingPlaceholderClassName } from '../../index';
|
|
5
8
|
import { SmartLinkSize, SmartLinkTheme } from '../../constants';
|
|
6
9
|
import { layers } from '@atlaskit/theme/constants';
|
|
7
10
|
import { themed } from '@atlaskit/theme/components';
|
|
11
|
+
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
8
12
|
|
|
9
13
|
// Temporary fix for Confluence inline comment on editor mod has z-index of 500, Jira issue view has z-index of 510
|
|
10
14
|
export var HOVER_CARD_Z_INDEX = layers.modal();
|
|
11
|
-
export var flexibleUiOptions = {
|
|
15
|
+
export var flexibleUiOptions = _objectSpread({
|
|
12
16
|
hideBackground: true,
|
|
13
17
|
hideElevation: true,
|
|
14
18
|
size: SmartLinkSize.Medium,
|
|
15
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
|
|
16
|
-
theme: SmartLinkTheme.Black,
|
|
17
19
|
hidePadding: true,
|
|
18
20
|
hideHoverCardPreviewButton: false,
|
|
19
21
|
zIndex: HOVER_CARD_Z_INDEX + 1
|
|
20
|
-
}
|
|
22
|
+
}, !getBooleanFF('platform.linking-platform.smart-card.enable-better-metadata_iojwg') && {
|
|
23
|
+
theme: SmartLinkTheme.Black
|
|
24
|
+
});
|
|
21
25
|
export var CARD_WIDTH_REM = 24;
|
|
22
26
|
// gap between mouse cursor and hover card
|
|
23
27
|
export var CARD_GAP_PX = 10;
|
|
@@ -25,7 +29,7 @@ var blockGap = '0.5rem';
|
|
|
25
29
|
var elementGap = '0.5rem';
|
|
26
30
|
export var separatorCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n [data-separator] + [data-separator]:before {\n margin-right: ", ";\n }\n"])), elementGap);
|
|
27
31
|
export var HoverCardContainer = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n background: none;\n border-width: 0;\n box-sizing: border-box;\n width: ", "rem;\n padding: 1rem;\n\n .", " {\n display: none;\n }\n"])), CARD_WIDTH_REM, loadingPlaceholderClassName);
|
|
28
|
-
export var titleBlockCss = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n gap: ", ";\n\n ", "\n\n // title and subtitle element group\n [data-smart-element-group] {\n // gap between title and subtitle\n gap: 0.06rem;\n display: flex;\n /* subtitle element group */\n > [data-smart-element-group] {\n > span {\n margin-right: ", ";\n }\n }\n }\n"])), blockGap, separatorCss, elementGap);
|
|
32
|
+
export var titleBlockCss = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n gap: ", ";\n\n ", "\n\n // title and subtitle element group\n [data-smart-element-group] {\n // gap between title and subtitle\n gap: 0.06rem;\n display: flex;\n /* subtitle element group */\n > [data-smart-element-group] {\n > span {\n margin-right: ", ";\n }\n }\n }\n\n ", "\n"])), blockGap, separatorCss, elementGap, getBooleanFF('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? "[data-smart-element=\"Title\"] {\n font-weight: 600;\n }" : "");
|
|
29
33
|
export var getTransitionStyles = function getTransitionStyles(snippetHeight) {
|
|
30
34
|
return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n transition: height 300ms ease-in-out;\n height: ", "px;\n"])), snippetHeight);
|
|
31
35
|
};
|
|
@@ -4,15 +4,14 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId"],
|
|
|
4
4
|
_excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
|
|
5
5
|
import React from 'react';
|
|
6
6
|
import { withAnalyticsContext } from '@atlaskit/analytics-next';
|
|
7
|
-
import { name as packageName, version as packageVersion } from '../../version.json';
|
|
8
7
|
import { withLinkClickedEvent } from '../../utils/analytics/click';
|
|
9
8
|
import { LinkAnalyticsContext } from '../../utils/analytics/LinkAnalyticsContext';
|
|
10
9
|
import { useLinkWarningModal } from './LinkWarningModal/hooks/use-link-warning-modal';
|
|
11
10
|
import LinkWarningModal from './LinkWarningModal';
|
|
12
11
|
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
13
12
|
var PACKAGE_DATA = {
|
|
14
|
-
packageName:
|
|
15
|
-
packageVersion:
|
|
13
|
+
packageName: "@atlaskit/smart-card",
|
|
14
|
+
packageVersion: "26.15.6",
|
|
16
15
|
componentName: 'linkUrl'
|
|
17
16
|
};
|
|
18
17
|
var Link = withLinkClickedEvent('a');
|
|
@@ -6,8 +6,8 @@ import { SmartLinkActionType } from '@atlaskit/linking-types';
|
|
|
6
6
|
export declare const ANALYTICS_CHANNEL = "media";
|
|
7
7
|
export declare const context: {
|
|
8
8
|
componentName: string;
|
|
9
|
-
packageName:
|
|
10
|
-
packageVersion:
|
|
9
|
+
packageName: string;
|
|
10
|
+
packageVersion: string;
|
|
11
11
|
};
|
|
12
12
|
export declare enum TrackQuickActionType {
|
|
13
13
|
StatusUpdate = "StatusUpdate"
|
|
@@ -6,6 +6,7 @@ import { OnResolveCallback } from '../../../Card/types';
|
|
|
6
6
|
import { CardProviderRenderers } from '@atlaskit/link-provider';
|
|
7
7
|
import { AnalyticsFacade } from '../../../../state/analytics';
|
|
8
8
|
import { AnchorTarget } from '../../../FlexibleCard/components/types';
|
|
9
|
+
import { TitleBlockProps } from '../../../FlexibleCard/components/blocks/title-block/types';
|
|
9
10
|
export type FlexibleBlockCardProps = {
|
|
10
11
|
/**
|
|
11
12
|
* An AnalyticsFacade object used for calling analytics.
|
|
@@ -75,4 +76,8 @@ export type FlexibleBlockCardProps = {
|
|
|
75
76
|
* Determines the URL of the Smart Link.
|
|
76
77
|
*/
|
|
77
78
|
url: string;
|
|
79
|
+
/**
|
|
80
|
+
* Determines a style of the Title Block.
|
|
81
|
+
*/
|
|
82
|
+
titleBlockProps?: TitleBlockProps;
|
|
78
83
|
};
|
|
@@ -6,8 +6,8 @@ import { SmartLinkActionType } from '@atlaskit/linking-types';
|
|
|
6
6
|
export declare const ANALYTICS_CHANNEL = "media";
|
|
7
7
|
export declare const context: {
|
|
8
8
|
componentName: string;
|
|
9
|
-
packageName:
|
|
10
|
-
packageVersion:
|
|
9
|
+
packageName: string;
|
|
10
|
+
packageVersion: string;
|
|
11
11
|
};
|
|
12
12
|
export declare enum TrackQuickActionType {
|
|
13
13
|
StatusUpdate = "StatusUpdate"
|
|
@@ -6,6 +6,7 @@ import { OnResolveCallback } from '../../../Card/types';
|
|
|
6
6
|
import { CardProviderRenderers } from '@atlaskit/link-provider';
|
|
7
7
|
import { AnalyticsFacade } from '../../../../state/analytics';
|
|
8
8
|
import { AnchorTarget } from '../../../FlexibleCard/components/types';
|
|
9
|
+
import { TitleBlockProps } from '../../../FlexibleCard/components/blocks/title-block/types';
|
|
9
10
|
export type FlexibleBlockCardProps = {
|
|
10
11
|
/**
|
|
11
12
|
* An AnalyticsFacade object used for calling analytics.
|
|
@@ -75,4 +76,8 @@ export type FlexibleBlockCardProps = {
|
|
|
75
76
|
* Determines the URL of the Smart Link.
|
|
76
77
|
*/
|
|
77
78
|
url: string;
|
|
79
|
+
/**
|
|
80
|
+
* Determines a style of the Title Block.
|
|
81
|
+
*/
|
|
82
|
+
titleBlockProps?: TitleBlockProps;
|
|
78
83
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/smart-card",
|
|
3
|
-
"version": "26.15.
|
|
3
|
+
"version": "26.15.6",
|
|
4
4
|
"description": "Smart card component",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -25,9 +25,9 @@
|
|
|
25
25
|
"@atlaskit/analytics-gas-types": "^5.1.0",
|
|
26
26
|
"@atlaskit/analytics-next": "^9.1.0",
|
|
27
27
|
"@atlaskit/avatar": "^21.3.0",
|
|
28
|
-
"@atlaskit/avatar-group": "^9.
|
|
28
|
+
"@atlaskit/avatar-group": "^9.4.0",
|
|
29
29
|
"@atlaskit/badge": "^15.1.0",
|
|
30
|
-
"@atlaskit/button": "^16.
|
|
30
|
+
"@atlaskit/button": "^16.9.0",
|
|
31
31
|
"@atlaskit/dropdown-menu": "^11.11.0",
|
|
32
32
|
"@atlaskit/frontend-utilities": "^2.7.0",
|
|
33
33
|
"@atlaskit/icon": "^21.12.0",
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
"@atlaskit/link-analytics": "^8.2.0",
|
|
39
39
|
"@atlaskit/link-client-extension": "^1.6.0",
|
|
40
40
|
"@atlaskit/link-extractors": "^1.1.0",
|
|
41
|
-
"@atlaskit/linking-common": "^4.
|
|
41
|
+
"@atlaskit/linking-common": "^4.4.0",
|
|
42
42
|
"@atlaskit/linking-types": "^8.2.0",
|
|
43
43
|
"@atlaskit/logo": "^13.14.0",
|
|
44
44
|
"@atlaskit/lozenge": "^11.4.0",
|
package/dist/cjs/version.json
DELETED
package/dist/es2019/version.json
DELETED