@atlaskit/media-card 81.5.2 → 81.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +23 -0
- package/dist/cjs/card/ai-generating-overlay/AIGeneratingOverlay.compiled.css +1 -0
- package/dist/cjs/card/ai-generating-overlay/AIGeneratingOverlay.js +7 -2
- package/dist/cjs/card/card.js +1 -1
- package/dist/cjs/card/cardView.js +4 -0
- package/dist/cjs/card/fileCard.js +3 -1
- package/dist/cjs/card/inlinePlayerWrapper-compiled.js +3 -5
- package/dist/cjs/card/media-card-analytics-error-boundary.js +1 -1
- package/dist/cjs/card/ui/actionsBar/actionsBarWrapper-compiled.js +4 -10
- package/dist/cjs/card/ui/unhandledErrorCard/unhandledErrorCard-compiled.js +4 -9
- package/dist/cjs/card/ui/wrapper/wrapper-compiled.js +3 -5
- package/dist/cjs/inline/loader.js +1 -1
- package/dist/cjs/utils/ufoExperiences.js +1 -1
- package/dist/es2019/card/ai-generating-overlay/AIGeneratingOverlay.compiled.css +1 -0
- package/dist/es2019/card/ai-generating-overlay/AIGeneratingOverlay.js +7 -2
- package/dist/es2019/card/card.js +1 -1
- package/dist/es2019/card/cardView.js +4 -0
- package/dist/es2019/card/fileCard.js +3 -1
- package/dist/es2019/card/inlinePlayerWrapper-compiled.js +3 -5
- package/dist/es2019/card/media-card-analytics-error-boundary.js +1 -1
- package/dist/es2019/card/ui/actionsBar/actionsBarWrapper-compiled.js +4 -9
- package/dist/es2019/card/ui/unhandledErrorCard/unhandledErrorCard-compiled.js +4 -9
- package/dist/es2019/card/ui/wrapper/wrapper-compiled.js +3 -5
- package/dist/es2019/inline/loader.js +1 -1
- package/dist/es2019/utils/ufoExperiences.js +1 -1
- package/dist/esm/card/ai-generating-overlay/AIGeneratingOverlay.compiled.css +1 -0
- package/dist/esm/card/ai-generating-overlay/AIGeneratingOverlay.js +7 -2
- package/dist/esm/card/card.js +1 -1
- package/dist/esm/card/cardView.js +4 -0
- package/dist/esm/card/fileCard.js +3 -1
- package/dist/esm/card/inlinePlayerWrapper-compiled.js +3 -5
- package/dist/esm/card/media-card-analytics-error-boundary.js +1 -1
- package/dist/esm/card/ui/actionsBar/actionsBarWrapper-compiled.js +4 -9
- package/dist/esm/card/ui/unhandledErrorCard/unhandledErrorCard-compiled.js +4 -9
- package/dist/esm/card/ui/wrapper/wrapper-compiled.js +3 -5
- package/dist/esm/inline/loader.js +1 -1
- package/dist/esm/utils/ufoExperiences.js +1 -1
- package/dist/types/card/ai-generating-overlay/AIGeneratingOverlay.d.ts +3 -1
- package/dist/types/card/cardView.d.ts +2 -1
- package/dist/types/card/fileCard.d.ts +3 -1
- package/dist/types/types.d.ts +1 -0
- package/package.json +2 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,28 @@
|
|
|
1
1
|
# @atlaskit/media-card
|
|
2
2
|
|
|
3
|
+
## 81.6.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`be5f53435795e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/be5f53435795e) -
|
|
8
|
+
Cleanup feature gate `platform_media_a11y_suppression_fixes`. The accessible wrapper behavior is
|
|
9
|
+
now permanent in media card, viewer, and filmstrip.
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
12
|
+
## 81.6.0
|
|
13
|
+
|
|
14
|
+
### Minor Changes
|
|
15
|
+
|
|
16
|
+
- [`8043a37357f34`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8043a37357f34) -
|
|
17
|
+
Added an `isCWR` prop to the media `Card`/`FileCard`. When set, the AI-generating loading state
|
|
18
|
+
renders an opaque `elevation.surface.sunken` overlay (instead of the translucent blanket) so the
|
|
19
|
+
generic media type icon isn't shown while a create-with-Rovo infographic streams in. Behaviour is
|
|
20
|
+
gated by the `aifc_page_create_with_rovo_include_infographics` experiment.
|
|
21
|
+
|
|
22
|
+
```tsx
|
|
23
|
+
<FileCard identifier={identifier} isAIGenerating isCWR />
|
|
24
|
+
```
|
|
25
|
+
|
|
3
26
|
## 81.5.2
|
|
4
27
|
|
|
5
28
|
### Patch Changes
|
|
@@ -15,6 +15,7 @@
|
|
|
15
15
|
._85i5utpp{padding-block-end:var(--ds-space-150,9pt)}
|
|
16
16
|
._bfhk15uy{background-color:var(--ds-background-neutral,hsla(0,0%,100%,.3))}
|
|
17
17
|
._bfhk1e9t{background-color:var(--ds-blanket,rgba(9,30,66,.36))}
|
|
18
|
+
._bfhkhfxm{background-color:var(--ds-surface-sunken,#f8f8f8)}
|
|
18
19
|
._i0dl1x1l{flex-basis:25%}
|
|
19
20
|
._kqswh2mm{position:relative}
|
|
20
21
|
._kqswstnw{position:absolute}
|
|
@@ -12,6 +12,10 @@ var React = _interopRequireWildcard(require("react"));
|
|
|
12
12
|
var _runtime = require("@compiled/react/runtime");
|
|
13
13
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
14
14
|
var overlayStyles = null;
|
|
15
|
+
var backgroundStyles = {
|
|
16
|
+
blanket: "_bfhk1e9t",
|
|
17
|
+
sunken: "_bfhkhfxm"
|
|
18
|
+
};
|
|
15
19
|
var progressBarTrackStyles = null;
|
|
16
20
|
var RAINBOW_TRAIN_COLORS = ["var(--ds-chart-categorical-4, #F68909)", // orange
|
|
17
21
|
"var(--ds-chart-categorical-2, #82B536)", // green
|
|
@@ -23,11 +27,12 @@ var trainStyles = null;
|
|
|
23
27
|
var trainBlockStyles = null;
|
|
24
28
|
function AIGeneratingOverlay(_ref) {
|
|
25
29
|
var label = _ref.label,
|
|
26
|
-
testId = _ref.testId
|
|
30
|
+
testId = _ref.testId,
|
|
31
|
+
isOpaque = _ref.isOpaque;
|
|
27
32
|
return /*#__PURE__*/React.createElement("div", {
|
|
28
33
|
"data-testid": testId !== null && testId !== void 0 ? testId : 'ai-generating-overlay',
|
|
29
34
|
role: "presentation",
|
|
30
|
-
className: (0, _runtime.ax)(["_1r04idpf _kqswstnw _1e0c1txw _4cvresu3 _1bah1h6o _85i5utpp _lcxv1wug
|
|
35
|
+
className: (0, _runtime.ax)(["_1r04idpf _kqswstnw _1e0c1txw _4cvresu3 _1bah1h6o _85i5utpp _lcxv1wug _1pbyqfx8", backgroundStyles[isOpaque ? 'sunken' : 'blanket']])
|
|
31
36
|
}, /*#__PURE__*/React.createElement("div", {
|
|
32
37
|
role: "progressbar",
|
|
33
38
|
"aria-label": label,
|
package/dist/cjs/card/card.js
CHANGED
|
@@ -20,7 +20,7 @@ var _label = _interopRequireDefault(require("@atlaskit/react-ufo/label"));
|
|
|
20
20
|
var _excluded = ["identifier"];
|
|
21
21
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
22
22
|
var packageName = "@atlaskit/media-card";
|
|
23
|
-
var packageVersion = "81.
|
|
23
|
+
var packageVersion = "81.6.0";
|
|
24
24
|
var CardBase = exports.CardBase = function CardBase(_ref) {
|
|
25
25
|
var identifier = _ref.identifier,
|
|
26
26
|
otherProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
@@ -92,6 +92,7 @@ var CardViewBase = exports.CardViewBase = function CardViewBase(_ref) {
|
|
|
92
92
|
onSvgLoad = _ref.onSvgLoad,
|
|
93
93
|
traceId = _ref.traceId,
|
|
94
94
|
isAIGenerating = _ref.isAIGenerating,
|
|
95
|
+
isCWR = _ref.isCWR,
|
|
95
96
|
backgroundColor = _ref.backgroundColor;
|
|
96
97
|
var intl = (0, _reactIntl.useIntl)();
|
|
97
98
|
var _useState = (0, _react.useState)(false),
|
|
@@ -338,6 +339,9 @@ var CardViewBase = exports.CardViewBase = function CardViewBase(_ref) {
|
|
|
338
339
|
}, /*#__PURE__*/_react.default.createElement(_playButton.PlayButton, null)), renderAIBorderOverride ? /*#__PURE__*/_react.default.createElement(_aiGeneratingOverlay.AIGeneratingOverlay, {
|
|
339
340
|
label: intl.formatMessage(i18n.aiGeneratingImage),
|
|
340
341
|
testId: "media-card-ai-generating-overlay"
|
|
342
|
+
// CWR renders the overlay opaque so it also masks the generic type icon.
|
|
343
|
+
,
|
|
344
|
+
isOpaque: isCWR
|
|
341
345
|
}) : renderBlanket && /*#__PURE__*/_react.default.createElement(_blanket.Blanket, {
|
|
342
346
|
isFixed: isFixedBlanket
|
|
343
347
|
}), renderTitleBox && /*#__PURE__*/_react.default.createElement(_titleBox.TitleBox, {
|
|
@@ -88,6 +88,7 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
88
88
|
titleBoxIcon = _ref.titleBoxIcon,
|
|
89
89
|
backgroundColor = _ref.backgroundColor,
|
|
90
90
|
isAIGenerating = _ref.isAIGenerating,
|
|
91
|
+
isCWR = _ref.isCWR,
|
|
91
92
|
onPreviewRender = _ref.onPreviewRender,
|
|
92
93
|
shouldHideTooltip = _ref.shouldHideTooltip,
|
|
93
94
|
mediaViewerItems = _ref.mediaViewerItems,
|
|
@@ -778,7 +779,8 @@ var FileCard = exports.FileCard = function FileCard(_ref) {
|
|
|
778
779
|
mediaCardCursor: mediaCardCursor,
|
|
779
780
|
shouldHideTooltip: shouldHideTooltip,
|
|
780
781
|
overriddenCreationDate: overridenDate,
|
|
781
|
-
isAIGenerating: isAIGenerating
|
|
782
|
+
isAIGenerating: isAIGenerating,
|
|
783
|
+
isCWR: isCWR
|
|
782
784
|
});
|
|
783
785
|
return isLazyWithOverride ? /*#__PURE__*/_react.default.createElement(_viewportDetector.ViewportDetector, {
|
|
784
786
|
cardEl: cardElement,
|
|
@@ -40,14 +40,12 @@ var InlinePlayerWrapper = exports.InlinePlayerWrapper = function InlinePlayerWra
|
|
|
40
40
|
dimensions = props.dimensions,
|
|
41
41
|
onClick = props.onClick,
|
|
42
42
|
innerRef = props.innerRef;
|
|
43
|
-
var a11yProps = (0, _platformFeatureFlags.fg)('platform_media_a11y_suppression_fixes') ? {
|
|
44
|
-
role: 'none'
|
|
45
|
-
} : {};
|
|
46
43
|
return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
|
|
47
44
|
id: "inlinePlayerWrapper",
|
|
48
|
-
"data-testid": testId
|
|
49
|
-
|
|
45
|
+
"data-testid": testId,
|
|
46
|
+
role: "none"
|
|
50
47
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
48
|
+
,
|
|
51
49
|
className: (0, _runtime.ax)([(0, _platformFeatureFlags.fg)('platform_editor_media_border_radius_fix') ? "_1reo15vq _18m915vq _2rko1mok _kqswh2mm _p12f1osq _c71l1osq _1bsb1ez3 _4t3i1amq _1y2k1osq _z18o1osq" : "_1reo15vq _18m915vq _2rkofajl _kqswh2mm _p12f1osq _c71l1osq _1bsb1ez3 _4t3i1amq _1y2k1osq _z18o1osq", selected && "_1p1y1j28 _1rk81j28 _14r11j28 _1np21j28", (0, _platformFeatureFlags.fg)('platform_editor_media_border_radius_fix') ? "_14mj1kw7 _aetrb3bt _z0ai1osq _1qdg1osq _18postnw _15l2idpf _631ousvi _11fnglyw" : "_14mjfajl _aetrb3bt _z0ai1osq _1qdg1osq _18postnw _15l2idpf _631ousvi _11fnglyw", selected && "_eq43fyzg", inlinePlayerClassName]),
|
|
52
50
|
onClick: onClick,
|
|
53
51
|
ref: innerRef
|
|
@@ -87,7 +87,7 @@ var WrappedMediaCardAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Compo
|
|
|
87
87
|
}(_react.default.Component);
|
|
88
88
|
(0, _defineProperty2.default)(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
|
|
89
89
|
var packageName = "@atlaskit/media-card";
|
|
90
|
-
var packageVersion = "81.
|
|
90
|
+
var packageVersion = "81.6.0";
|
|
91
91
|
|
|
92
92
|
// @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
|
|
93
93
|
var MediaCardAnalyticsErrorBoundary = (0, _mediaCommon.withMediaAnalyticsContext)({
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
/* actionsBarWrapper-compiled.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
2
|
"use strict";
|
|
3
3
|
|
|
4
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
5
|
Object.defineProperty(exports, "__esModule", {
|
|
7
6
|
value: true
|
|
@@ -10,26 +9,21 @@ exports.ActionsBarWrapper = void 0;
|
|
|
10
9
|
require("./actionsBarWrapper-compiled.compiled.css");
|
|
11
10
|
var React = _interopRequireWildcard(require("react"));
|
|
12
11
|
var _runtime = require("@compiled/react/runtime");
|
|
13
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
14
12
|
var _styles = require("./styles");
|
|
15
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
16
13
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
17
14
|
var wrapperStyles = null;
|
|
18
15
|
var fixedActionBarStyle = null;
|
|
19
16
|
var ActionsBarWrapper = exports.ActionsBarWrapper = function ActionsBarWrapper(props) {
|
|
20
|
-
|
|
21
|
-
role: 'none'
|
|
22
|
-
} : {};
|
|
23
|
-
return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
|
|
17
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
24
18
|
id: "actionsBarWrapper",
|
|
25
|
-
"data-testId": "actionsBarWrapper"
|
|
26
|
-
|
|
19
|
+
"data-testId": "actionsBarWrapper",
|
|
20
|
+
role: "none",
|
|
27
21
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
28
22
|
className: (0, _runtime.ax)(["_v564ybtr _2lx2vrvc _1n261q9c _zulpu2gc _kqswstnw _154iidpf _1xi2idpf _1e0c1txw _1bahusic _ca0qu2gc _n3tdu2gc _u5f3u2gc _19bvu2gc _tzy4idpf", props.isFixed && "_tzy4kb7n", _styles.actionsBarClassName]),
|
|
29
23
|
onClick: function onClick(event) {
|
|
30
24
|
event.stopPropagation();
|
|
31
25
|
event.preventDefault();
|
|
32
26
|
}
|
|
33
|
-
}
|
|
27
|
+
}, props.children);
|
|
34
28
|
};
|
|
35
29
|
ActionsBarWrapper.displayName = 'ActionsBarWrapper';
|
|
@@ -11,13 +11,11 @@ require("./unhandledErrorCard-compiled.compiled.css");
|
|
|
11
11
|
var _react = _interopRequireWildcard(require("react"));
|
|
12
12
|
var React = _react;
|
|
13
13
|
var _runtime = require("@compiled/react/runtime");
|
|
14
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
15
14
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
16
15
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
17
16
|
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
18
17
|
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
19
18
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
20
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
21
19
|
var _statusWarning = _interopRequireDefault(require("@atlaskit/icon/core/status-warning"));
|
|
22
20
|
var _utils = require("../../../utils");
|
|
23
21
|
var _contentLoadingErrorMessage = require("./contentLoadingErrorMessage");
|
|
@@ -65,17 +63,14 @@ var UnhandledErrorCard = exports.UnhandledErrorCard = /*#__PURE__*/function (_Co
|
|
|
65
63
|
onClick = _this$props.onClick;
|
|
66
64
|
var convertedDimensions = getConvertedDimension(dimensions);
|
|
67
65
|
var hideText = !shouldShowText(getConvertedDimension(dimensions));
|
|
68
|
-
|
|
69
|
-
role: 'none'
|
|
70
|
-
} : {};
|
|
71
|
-
return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
|
|
66
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
72
67
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
73
68
|
style: convertedDimensions,
|
|
74
69
|
onClick: onClick,
|
|
75
|
-
"data-testid": "unhandled-error-card"
|
|
76
|
-
|
|
70
|
+
"data-testid": "unhandled-error-card",
|
|
71
|
+
role: "none",
|
|
77
72
|
className: (0, _runtime.ax)(["_2rkofajl _1e0c1txw _4cvr1h6o _1bah1h6o _bfhki8nm _syazazsu _c71l1osq _p12f1osq _2lx21bp4 _1i7vfhey _31ku1h6o"])
|
|
78
|
-
}
|
|
73
|
+
}, /*#__PURE__*/React.createElement(_statusWarning.default, {
|
|
79
74
|
label: "Error",
|
|
80
75
|
color: "var(--ds-icon-warning, #E06C00)",
|
|
81
76
|
spacing: "spacious"
|
|
@@ -17,7 +17,6 @@ var _vcMedia = require("@atlaskit/react-ufo/vc-media");
|
|
|
17
17
|
var _cardDimensions = require("../../../utils/cardDimensions");
|
|
18
18
|
var _getCSSUnitValue = require("../../../utils/getCSSUnitValue");
|
|
19
19
|
var _customData = _interopRequireDefault(require("@atlaskit/react-ufo/custom-data"));
|
|
20
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
21
20
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
22
21
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
23
22
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
@@ -73,9 +72,6 @@ var Wrapper = exports.Wrapper = function Wrapper(props) {
|
|
|
73
72
|
var width = (0, _getCSSUnitValue.getCSSUnitValue)((dimensions === null || dimensions === void 0 ? void 0 : dimensions.width) || defaultImageCardDimensions.width);
|
|
74
73
|
var height = (0, _getCSSUnitValue.getCSSUnitValue)((dimensions === null || dimensions === void 0 ? void 0 : dimensions.height) || defaultImageCardDimensions.height);
|
|
75
74
|
var wrapperShadowKey = getShadowKey(disableOverlay, selected);
|
|
76
|
-
var a11yProps = (0, _platformFeatureFlags.fg)('platform_media_a11y_suppression_fixes') ? {
|
|
77
|
-
role: 'none'
|
|
78
|
-
} : {};
|
|
79
75
|
return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
|
|
80
76
|
id: "newFileExperienceWrapper"
|
|
81
77
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
@@ -88,7 +84,9 @@ var Wrapper = exports.Wrapper = function Wrapper(props) {
|
|
|
88
84
|
// eslint-disable-next-line @atlassian/a11y/mouse-events-have-key-events
|
|
89
85
|
,
|
|
90
86
|
onMouseEnter: onMouseEnter
|
|
91
|
-
}, _vcMedia.VcMediaWrapperProps,
|
|
87
|
+
}, _vcMedia.VcMediaWrapperProps, {
|
|
88
|
+
role: "none"
|
|
89
|
+
}), /*#__PURE__*/React.createElement(_customData.default, {
|
|
92
90
|
data: {
|
|
93
91
|
hasMediaComponent: true
|
|
94
92
|
}
|
|
@@ -116,7 +116,7 @@ var MediaInlineCardLoader = exports.default = /*#__PURE__*/function (_React$Pure
|
|
|
116
116
|
ErrorBoundary = _this$state.ErrorBoundary;
|
|
117
117
|
var analyticsContext = {
|
|
118
118
|
packageVersion: "@atlaskit/media-card",
|
|
119
|
-
packageName: "81.
|
|
119
|
+
packageName: "81.6.0",
|
|
120
120
|
componentName: 'mediaInlineCard',
|
|
121
121
|
component: 'mediaInlineCard'
|
|
122
122
|
};
|
|
@@ -19,7 +19,7 @@ var _globalScope = require("./globalScope/globalScope");
|
|
|
19
19
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
20
20
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
21
21
|
var packageName = "@atlaskit/media-card";
|
|
22
|
-
var packageVersion = "81.
|
|
22
|
+
var packageVersion = "81.6.0";
|
|
23
23
|
var SAMPLE_RATE = 0.05;
|
|
24
24
|
|
|
25
25
|
/**
|
|
@@ -15,6 +15,7 @@
|
|
|
15
15
|
._85i5utpp{padding-block-end:var(--ds-space-150,9pt)}
|
|
16
16
|
._bfhk15uy{background-color:var(--ds-background-neutral,hsla(0,0%,100%,.3))}
|
|
17
17
|
._bfhk1e9t{background-color:var(--ds-blanket,rgba(9,30,66,.36))}
|
|
18
|
+
._bfhkhfxm{background-color:var(--ds-surface-sunken,#f8f8f8)}
|
|
18
19
|
._i0dl1x1l{flex-basis:25%}
|
|
19
20
|
._kqswh2mm{position:relative}
|
|
20
21
|
._kqswstnw{position:absolute}
|
|
@@ -4,6 +4,10 @@ import "./AIGeneratingOverlay.compiled.css";
|
|
|
4
4
|
import * as React from 'react';
|
|
5
5
|
import { ax, ix } from "@compiled/react/runtime";
|
|
6
6
|
const overlayStyles = null;
|
|
7
|
+
const backgroundStyles = {
|
|
8
|
+
blanket: "_bfhk1e9t",
|
|
9
|
+
sunken: "_bfhkhfxm"
|
|
10
|
+
};
|
|
7
11
|
const progressBarTrackStyles = null;
|
|
8
12
|
const RAINBOW_TRAIN_COLORS = ["var(--ds-chart-categorical-4, #F68909)", // orange
|
|
9
13
|
"var(--ds-chart-categorical-2, #82B536)", // green
|
|
@@ -15,12 +19,13 @@ const trainStyles = null;
|
|
|
15
19
|
const trainBlockStyles = null;
|
|
16
20
|
export function AIGeneratingOverlay({
|
|
17
21
|
label,
|
|
18
|
-
testId
|
|
22
|
+
testId,
|
|
23
|
+
isOpaque
|
|
19
24
|
}) {
|
|
20
25
|
return /*#__PURE__*/React.createElement("div", {
|
|
21
26
|
"data-testid": testId !== null && testId !== void 0 ? testId : 'ai-generating-overlay',
|
|
22
27
|
role: "presentation",
|
|
23
|
-
className: ax(["_1r04idpf _kqswstnw _1e0c1txw _4cvresu3 _1bah1h6o _85i5utpp _lcxv1wug
|
|
28
|
+
className: ax(["_1r04idpf _kqswstnw _1e0c1txw _4cvresu3 _1bah1h6o _85i5utpp _lcxv1wug _1pbyqfx8", backgroundStyles[isOpaque ? 'sunken' : 'blanket']])
|
|
24
29
|
}, /*#__PURE__*/React.createElement("div", {
|
|
25
30
|
role: "progressbar",
|
|
26
31
|
"aria-label": label,
|
package/dist/es2019/card/card.js
CHANGED
|
@@ -9,7 +9,7 @@ import { startResourceObserver, setAnalyticsContext } from '../utils/mediaPerfor
|
|
|
9
9
|
import { useAnalyticsEvents } from '@atlaskit/analytics-next';
|
|
10
10
|
import UFOLabel from '@atlaskit/react-ufo/label';
|
|
11
11
|
const packageName = "@atlaskit/media-card";
|
|
12
|
-
const packageVersion = "81.
|
|
12
|
+
const packageVersion = "81.6.0";
|
|
13
13
|
export const CardBase = ({
|
|
14
14
|
identifier,
|
|
15
15
|
...otherProps
|
|
@@ -77,6 +77,7 @@ export const CardViewBase = ({
|
|
|
77
77
|
onSvgLoad,
|
|
78
78
|
traceId,
|
|
79
79
|
isAIGenerating,
|
|
80
|
+
isCWR,
|
|
80
81
|
backgroundColor
|
|
81
82
|
}) => {
|
|
82
83
|
const intl = useIntl();
|
|
@@ -327,6 +328,9 @@ export const CardViewBase = ({
|
|
|
327
328
|
}, /*#__PURE__*/React.createElement(PlayButton, null)), renderAIBorderOverride ? /*#__PURE__*/React.createElement(AIGeneratingOverlay, {
|
|
328
329
|
label: intl.formatMessage(i18n.aiGeneratingImage),
|
|
329
330
|
testId: "media-card-ai-generating-overlay"
|
|
331
|
+
// CWR renders the overlay opaque so it also masks the generic type icon.
|
|
332
|
+
,
|
|
333
|
+
isOpaque: isCWR
|
|
330
334
|
}) : renderBlanket && /*#__PURE__*/React.createElement(Blanket, {
|
|
331
335
|
isFixed: isFixedBlanket
|
|
332
336
|
}), renderTitleBox && /*#__PURE__*/React.createElement(TitleBox, {
|
|
@@ -69,6 +69,7 @@ export const FileCard = ({
|
|
|
69
69
|
titleBoxIcon,
|
|
70
70
|
backgroundColor,
|
|
71
71
|
isAIGenerating,
|
|
72
|
+
isCWR,
|
|
72
73
|
onPreviewRender,
|
|
73
74
|
shouldHideTooltip,
|
|
74
75
|
mediaViewerItems,
|
|
@@ -695,7 +696,8 @@ export const FileCard = ({
|
|
|
695
696
|
mediaCardCursor: mediaCardCursor,
|
|
696
697
|
shouldHideTooltip: shouldHideTooltip,
|
|
697
698
|
overriddenCreationDate: overridenDate,
|
|
698
|
-
isAIGenerating: isAIGenerating
|
|
699
|
+
isAIGenerating: isAIGenerating,
|
|
700
|
+
isCWR: isCWR
|
|
699
701
|
});
|
|
700
702
|
return isLazyWithOverride ? /*#__PURE__*/React.createElement(ViewportDetector, {
|
|
701
703
|
cardEl: cardElement,
|
|
@@ -32,14 +32,12 @@ export const InlinePlayerWrapper = props => {
|
|
|
32
32
|
onClick,
|
|
33
33
|
innerRef
|
|
34
34
|
} = props;
|
|
35
|
-
const a11yProps = fg('platform_media_a11y_suppression_fixes') ? {
|
|
36
|
-
role: 'none'
|
|
37
|
-
} : {};
|
|
38
35
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
39
36
|
id: "inlinePlayerWrapper",
|
|
40
|
-
"data-testid": testId
|
|
41
|
-
|
|
37
|
+
"data-testid": testId,
|
|
38
|
+
role: "none"
|
|
42
39
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
40
|
+
,
|
|
43
41
|
className: ax([fg('platform_editor_media_border_radius_fix') ? "_1reo15vq _18m915vq _2rko1mok _kqswh2mm _p12f1osq _c71l1osq _1bsbbj0z _4t3io1dg _1y2k1osq _z18o1osq" : "_1reo15vq _18m915vq _2rkofajl _kqswh2mm _p12f1osq _c71l1osq _1bsbbj0z _4t3io1dg _1y2k1osq _z18o1osq", selected && "_1p1y1j28 _1rk81j28 _14r11j28 _1np21j28", fg('platform_editor_media_border_radius_fix') ? "_14mj1kw7 _aetrb3bt _z0ai1osq _1qdg1osq _18postnw _15l2idpf _631ousvi _11fnglyw" : "_14mjfajl _aetrb3bt _z0ai1osq _1qdg1osq _18postnw _15l2idpf _631ousvi _11fnglyw", selected && "_eq43fyzg", inlinePlayerClassName]),
|
|
44
42
|
style: {
|
|
45
43
|
[LOCAL_WIDTH_VARIABLE]: getDimensionsWithDefault(dimensions).width || '100%',
|
|
@@ -66,7 +66,7 @@ class WrappedMediaCardAnalyticsErrorBoundary extends React.Component {
|
|
|
66
66
|
}
|
|
67
67
|
_defineProperty(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
|
|
68
68
|
const packageName = "@atlaskit/media-card";
|
|
69
|
-
const packageVersion = "81.
|
|
69
|
+
const packageVersion = "81.6.0";
|
|
70
70
|
|
|
71
71
|
// @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
|
|
72
72
|
const MediaCardAnalyticsErrorBoundary = withMediaAnalyticsContext({
|
|
@@ -1,26 +1,21 @@
|
|
|
1
1
|
/* actionsBarWrapper-compiled.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
|
-
import _extends from "@babel/runtime/helpers/extends";
|
|
3
2
|
import "./actionsBarWrapper-compiled.compiled.css";
|
|
4
3
|
import * as React from 'react';
|
|
5
4
|
import { ax, ix } from "@compiled/react/runtime";
|
|
6
5
|
import { actionsBarClassName } from './styles';
|
|
7
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
6
|
const wrapperStyles = null;
|
|
9
7
|
const fixedActionBarStyle = null;
|
|
10
8
|
export const ActionsBarWrapper = props => {
|
|
11
|
-
|
|
12
|
-
role: 'none'
|
|
13
|
-
} : {};
|
|
14
|
-
return /*#__PURE__*/React.createElement("div", _extends({
|
|
9
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
15
10
|
id: "actionsBarWrapper",
|
|
16
|
-
"data-testId": "actionsBarWrapper"
|
|
17
|
-
|
|
11
|
+
"data-testId": "actionsBarWrapper",
|
|
12
|
+
role: "none",
|
|
18
13
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
19
14
|
className: ax(["_v564ybtr _2lx2vrvc _1n261q9c _zulpu2gc _kqswstnw _154iidpf _1xi2idpf _1e0c1txw _1bahusic _ca0qu2gc _n3tdu2gc _u5f3u2gc _19bvu2gc _tzy4idpf", props.isFixed && "_tzy4kb7n", actionsBarClassName]),
|
|
20
15
|
onClick: event => {
|
|
21
16
|
event.stopPropagation();
|
|
22
17
|
event.preventDefault();
|
|
23
18
|
}
|
|
24
|
-
}
|
|
19
|
+
}, props.children);
|
|
25
20
|
};
|
|
26
21
|
ActionsBarWrapper.displayName = 'ActionsBarWrapper';
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
/* unhandledErrorCard-compiled.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
|
-
import _extends from "@babel/runtime/helpers/extends";
|
|
3
2
|
import "./unhandledErrorCard-compiled.compiled.css";
|
|
4
3
|
import * as React from 'react';
|
|
5
4
|
import { ax, ix } from "@compiled/react/runtime";
|
|
6
5
|
import { Component } from 'react';
|
|
7
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
6
|
import WarningIcon from '@atlaskit/icon/core/status-warning';
|
|
9
7
|
import { defaultImageCardDimensions } from '../../../utils';
|
|
10
8
|
import { ContentLoadingErrorMessage } from './contentLoadingErrorMessage';
|
|
@@ -41,17 +39,14 @@ export class UnhandledErrorCard extends Component {
|
|
|
41
39
|
} = this.props;
|
|
42
40
|
const convertedDimensions = getConvertedDimension(dimensions);
|
|
43
41
|
const hideText = !shouldShowText(getConvertedDimension(dimensions));
|
|
44
|
-
|
|
45
|
-
role: 'none'
|
|
46
|
-
} : {};
|
|
47
|
-
return /*#__PURE__*/React.createElement("div", _extends({
|
|
42
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
48
43
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
49
44
|
style: convertedDimensions,
|
|
50
45
|
onClick: onClick,
|
|
51
|
-
"data-testid": "unhandled-error-card"
|
|
52
|
-
|
|
46
|
+
"data-testid": "unhandled-error-card",
|
|
47
|
+
role: "none",
|
|
53
48
|
className: ax(["_2rkofajl _1e0c1txw _4cvr1h6o _1bah1h6o _bfhki8nm _syazazsu _c71l1osq _p12f1osq _2lx21bp4 _1i7vfhey _31ku1h6o"])
|
|
54
|
-
}
|
|
49
|
+
}, /*#__PURE__*/React.createElement(WarningIcon, {
|
|
55
50
|
label: "Error",
|
|
56
51
|
color: "var(--ds-icon-warning, #E06C00)",
|
|
57
52
|
spacing: "spacious"
|
|
@@ -8,7 +8,6 @@ import { VcMediaWrapperProps } from '@atlaskit/react-ufo/vc-media';
|
|
|
8
8
|
import { getDefaultCardDimensions } from '../../../utils/cardDimensions';
|
|
9
9
|
import { getCSSUnitValue } from '../../../utils/getCSSUnitValue';
|
|
10
10
|
import UFOCustomData from '@atlaskit/react-ufo/custom-data';
|
|
11
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
12
11
|
export const LOCAL_WIDTH_VARIABLE = '--media-wrapper-width';
|
|
13
12
|
export const LOCAL_HEIGHT_VARIABLE = '--media-wrapper-height';
|
|
14
13
|
const wrapperStyles = {
|
|
@@ -69,9 +68,6 @@ export const Wrapper = props => {
|
|
|
69
68
|
const width = getCSSUnitValue((dimensions === null || dimensions === void 0 ? void 0 : dimensions.width) || defaultImageCardDimensions.width);
|
|
70
69
|
const height = getCSSUnitValue((dimensions === null || dimensions === void 0 ? void 0 : dimensions.height) || defaultImageCardDimensions.height);
|
|
71
70
|
const wrapperShadowKey = getShadowKey(disableOverlay, selected);
|
|
72
|
-
const a11yProps = fg('platform_media_a11y_suppression_fixes') ? {
|
|
73
|
-
role: 'none'
|
|
74
|
-
} : {};
|
|
75
71
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
76
72
|
id: "newFileExperienceWrapper"
|
|
77
73
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
@@ -89,7 +85,9 @@ export const Wrapper = props => {
|
|
|
89
85
|
// eslint-disable-next-line @atlassian/a11y/mouse-events-have-key-events
|
|
90
86
|
,
|
|
91
87
|
onMouseEnter: onMouseEnter
|
|
92
|
-
}, VcMediaWrapperProps,
|
|
88
|
+
}, VcMediaWrapperProps, {
|
|
89
|
+
role: "none"
|
|
90
|
+
}), /*#__PURE__*/React.createElement(UFOCustomData, {
|
|
93
91
|
data: {
|
|
94
92
|
hasMediaComponent: true
|
|
95
93
|
}
|
|
@@ -37,7 +37,7 @@ export default class MediaInlineCardLoader extends React.PureComponent {
|
|
|
37
37
|
} = this.state;
|
|
38
38
|
const analyticsContext = {
|
|
39
39
|
packageVersion: "@atlaskit/media-card",
|
|
40
|
-
packageName: "81.
|
|
40
|
+
packageName: "81.6.0",
|
|
41
41
|
componentName: 'mediaInlineCard',
|
|
42
42
|
component: 'mediaInlineCard'
|
|
43
43
|
};
|
|
@@ -9,7 +9,7 @@ import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
|
|
|
9
9
|
import { getActiveInteraction } from '@atlaskit/react-ufo/interaction-metrics';
|
|
10
10
|
import { getMediaGlobalScope } from './globalScope/globalScope';
|
|
11
11
|
const packageName = "@atlaskit/media-card";
|
|
12
|
-
const packageVersion = "81.
|
|
12
|
+
const packageVersion = "81.6.0";
|
|
13
13
|
const SAMPLE_RATE = 0.05;
|
|
14
14
|
|
|
15
15
|
/**
|
|
@@ -15,6 +15,7 @@
|
|
|
15
15
|
._85i5utpp{padding-block-end:var(--ds-space-150,9pt)}
|
|
16
16
|
._bfhk15uy{background-color:var(--ds-background-neutral,hsla(0,0%,100%,.3))}
|
|
17
17
|
._bfhk1e9t{background-color:var(--ds-blanket,rgba(9,30,66,.36))}
|
|
18
|
+
._bfhkhfxm{background-color:var(--ds-surface-sunken,#f8f8f8)}
|
|
18
19
|
._i0dl1x1l{flex-basis:25%}
|
|
19
20
|
._kqswh2mm{position:relative}
|
|
20
21
|
._kqswstnw{position:absolute}
|
|
@@ -4,6 +4,10 @@ import "./AIGeneratingOverlay.compiled.css";
|
|
|
4
4
|
import * as React from 'react';
|
|
5
5
|
import { ax, ix } from "@compiled/react/runtime";
|
|
6
6
|
var overlayStyles = null;
|
|
7
|
+
var backgroundStyles = {
|
|
8
|
+
blanket: "_bfhk1e9t",
|
|
9
|
+
sunken: "_bfhkhfxm"
|
|
10
|
+
};
|
|
7
11
|
var progressBarTrackStyles = null;
|
|
8
12
|
var RAINBOW_TRAIN_COLORS = ["var(--ds-chart-categorical-4, #F68909)", // orange
|
|
9
13
|
"var(--ds-chart-categorical-2, #82B536)", // green
|
|
@@ -15,11 +19,12 @@ var trainStyles = null;
|
|
|
15
19
|
var trainBlockStyles = null;
|
|
16
20
|
export function AIGeneratingOverlay(_ref) {
|
|
17
21
|
var label = _ref.label,
|
|
18
|
-
testId = _ref.testId
|
|
22
|
+
testId = _ref.testId,
|
|
23
|
+
isOpaque = _ref.isOpaque;
|
|
19
24
|
return /*#__PURE__*/React.createElement("div", {
|
|
20
25
|
"data-testid": testId !== null && testId !== void 0 ? testId : 'ai-generating-overlay',
|
|
21
26
|
role: "presentation",
|
|
22
|
-
className: ax(["_1r04idpf _kqswstnw _1e0c1txw _4cvresu3 _1bah1h6o _85i5utpp _lcxv1wug
|
|
27
|
+
className: ax(["_1r04idpf _kqswstnw _1e0c1txw _4cvresu3 _1bah1h6o _85i5utpp _lcxv1wug _1pbyqfx8", backgroundStyles[isOpaque ? 'sunken' : 'blanket']])
|
|
23
28
|
}, /*#__PURE__*/React.createElement("div", {
|
|
24
29
|
role: "progressbar",
|
|
25
30
|
"aria-label": label,
|
package/dist/esm/card/card.js
CHANGED
|
@@ -11,7 +11,7 @@ import { startResourceObserver, setAnalyticsContext } from '../utils/mediaPerfor
|
|
|
11
11
|
import { useAnalyticsEvents } from '@atlaskit/analytics-next';
|
|
12
12
|
import UFOLabel from '@atlaskit/react-ufo/label';
|
|
13
13
|
var packageName = "@atlaskit/media-card";
|
|
14
|
-
var packageVersion = "81.
|
|
14
|
+
var packageVersion = "81.6.0";
|
|
15
15
|
export var CardBase = function CardBase(_ref) {
|
|
16
16
|
var identifier = _ref.identifier,
|
|
17
17
|
otherProps = _objectWithoutProperties(_ref, _excluded);
|
|
@@ -83,6 +83,7 @@ export var CardViewBase = function CardViewBase(_ref) {
|
|
|
83
83
|
onSvgLoad = _ref.onSvgLoad,
|
|
84
84
|
traceId = _ref.traceId,
|
|
85
85
|
isAIGenerating = _ref.isAIGenerating,
|
|
86
|
+
isCWR = _ref.isCWR,
|
|
86
87
|
backgroundColor = _ref.backgroundColor;
|
|
87
88
|
var intl = useIntl();
|
|
88
89
|
var _useState = useState(false),
|
|
@@ -329,6 +330,9 @@ export var CardViewBase = function CardViewBase(_ref) {
|
|
|
329
330
|
}, /*#__PURE__*/React.createElement(PlayButton, null)), renderAIBorderOverride ? /*#__PURE__*/React.createElement(AIGeneratingOverlay, {
|
|
330
331
|
label: intl.formatMessage(i18n.aiGeneratingImage),
|
|
331
332
|
testId: "media-card-ai-generating-overlay"
|
|
333
|
+
// CWR renders the overlay opaque so it also masks the generic type icon.
|
|
334
|
+
,
|
|
335
|
+
isOpaque: isCWR
|
|
332
336
|
}) : renderBlanket && /*#__PURE__*/React.createElement(Blanket, {
|
|
333
337
|
isFixed: isFixedBlanket
|
|
334
338
|
}), renderTitleBox && /*#__PURE__*/React.createElement(TitleBox, {
|
|
@@ -80,6 +80,7 @@ export var FileCard = function FileCard(_ref) {
|
|
|
80
80
|
titleBoxIcon = _ref.titleBoxIcon,
|
|
81
81
|
backgroundColor = _ref.backgroundColor,
|
|
82
82
|
isAIGenerating = _ref.isAIGenerating,
|
|
83
|
+
isCWR = _ref.isCWR,
|
|
83
84
|
onPreviewRender = _ref.onPreviewRender,
|
|
84
85
|
shouldHideTooltip = _ref.shouldHideTooltip,
|
|
85
86
|
mediaViewerItems = _ref.mediaViewerItems,
|
|
@@ -770,7 +771,8 @@ export var FileCard = function FileCard(_ref) {
|
|
|
770
771
|
mediaCardCursor: mediaCardCursor,
|
|
771
772
|
shouldHideTooltip: shouldHideTooltip,
|
|
772
773
|
overriddenCreationDate: overridenDate,
|
|
773
|
-
isAIGenerating: isAIGenerating
|
|
774
|
+
isAIGenerating: isAIGenerating,
|
|
775
|
+
isCWR: isCWR
|
|
774
776
|
});
|
|
775
777
|
return isLazyWithOverride ? /*#__PURE__*/React.createElement(ViewportDetector, {
|
|
776
778
|
cardEl: cardElement,
|
|
@@ -31,14 +31,12 @@ export var InlinePlayerWrapper = function InlinePlayerWrapper(props) {
|
|
|
31
31
|
dimensions = props.dimensions,
|
|
32
32
|
onClick = props.onClick,
|
|
33
33
|
innerRef = props.innerRef;
|
|
34
|
-
var a11yProps = fg('platform_media_a11y_suppression_fixes') ? {
|
|
35
|
-
role: 'none'
|
|
36
|
-
} : {};
|
|
37
34
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
38
35
|
id: "inlinePlayerWrapper",
|
|
39
|
-
"data-testid": testId
|
|
40
|
-
|
|
36
|
+
"data-testid": testId,
|
|
37
|
+
role: "none"
|
|
41
38
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
39
|
+
,
|
|
42
40
|
className: ax([fg('platform_editor_media_border_radius_fix') ? "_1reo15vq _18m915vq _2rko1mok _kqswh2mm _p12f1osq _c71l1osq _1bsb1ez3 _4t3i1amq _1y2k1osq _z18o1osq" : "_1reo15vq _18m915vq _2rkofajl _kqswh2mm _p12f1osq _c71l1osq _1bsb1ez3 _4t3i1amq _1y2k1osq _z18o1osq", selected && "_1p1y1j28 _1rk81j28 _14r11j28 _1np21j28", fg('platform_editor_media_border_radius_fix') ? "_14mj1kw7 _aetrb3bt _z0ai1osq _1qdg1osq _18postnw _15l2idpf _631ousvi _11fnglyw" : "_14mjfajl _aetrb3bt _z0ai1osq _1qdg1osq _18postnw _15l2idpf _631ousvi _11fnglyw", selected && "_eq43fyzg", inlinePlayerClassName]),
|
|
43
41
|
onClick: onClick,
|
|
44
42
|
ref: innerRef
|
|
@@ -80,7 +80,7 @@ var WrappedMediaCardAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Compo
|
|
|
80
80
|
}(React.Component);
|
|
81
81
|
_defineProperty(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
|
|
82
82
|
var packageName = "@atlaskit/media-card";
|
|
83
|
-
var packageVersion = "81.
|
|
83
|
+
var packageVersion = "81.6.0";
|
|
84
84
|
|
|
85
85
|
// @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
|
|
86
86
|
var MediaCardAnalyticsErrorBoundary = withMediaAnalyticsContext({
|
|
@@ -1,26 +1,21 @@
|
|
|
1
1
|
/* actionsBarWrapper-compiled.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
|
-
import _extends from "@babel/runtime/helpers/extends";
|
|
3
2
|
import "./actionsBarWrapper-compiled.compiled.css";
|
|
4
3
|
import * as React from 'react';
|
|
5
4
|
import { ax, ix } from "@compiled/react/runtime";
|
|
6
5
|
import { actionsBarClassName } from './styles';
|
|
7
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
6
|
var wrapperStyles = null;
|
|
9
7
|
var fixedActionBarStyle = null;
|
|
10
8
|
export var ActionsBarWrapper = function ActionsBarWrapper(props) {
|
|
11
|
-
|
|
12
|
-
role: 'none'
|
|
13
|
-
} : {};
|
|
14
|
-
return /*#__PURE__*/React.createElement("div", _extends({
|
|
9
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
15
10
|
id: "actionsBarWrapper",
|
|
16
|
-
"data-testId": "actionsBarWrapper"
|
|
17
|
-
|
|
11
|
+
"data-testId": "actionsBarWrapper",
|
|
12
|
+
role: "none",
|
|
18
13
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
19
14
|
className: ax(["_v564ybtr _2lx2vrvc _1n261q9c _zulpu2gc _kqswstnw _154iidpf _1xi2idpf _1e0c1txw _1bahusic _ca0qu2gc _n3tdu2gc _u5f3u2gc _19bvu2gc _tzy4idpf", props.isFixed && "_tzy4kb7n", actionsBarClassName]),
|
|
20
15
|
onClick: function onClick(event) {
|
|
21
16
|
event.stopPropagation();
|
|
22
17
|
event.preventDefault();
|
|
23
18
|
}
|
|
24
|
-
}
|
|
19
|
+
}, props.children);
|
|
25
20
|
};
|
|
26
21
|
ActionsBarWrapper.displayName = 'ActionsBarWrapper';
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/* unhandledErrorCard-compiled.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
|
-
import _extends from "@babel/runtime/helpers/extends";
|
|
3
2
|
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
4
3
|
import _createClass from "@babel/runtime/helpers/createClass";
|
|
5
4
|
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
|
@@ -11,7 +10,6 @@ import { ax, ix } from "@compiled/react/runtime";
|
|
|
11
10
|
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
|
|
12
11
|
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
13
12
|
import { Component } from 'react';
|
|
14
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
15
13
|
import WarningIcon from '@atlaskit/icon/core/status-warning';
|
|
16
14
|
import { defaultImageCardDimensions } from '../../../utils';
|
|
17
15
|
import { ContentLoadingErrorMessage } from './contentLoadingErrorMessage';
|
|
@@ -56,17 +54,14 @@ export var UnhandledErrorCard = /*#__PURE__*/function (_Component) {
|
|
|
56
54
|
onClick = _this$props.onClick;
|
|
57
55
|
var convertedDimensions = getConvertedDimension(dimensions);
|
|
58
56
|
var hideText = !shouldShowText(getConvertedDimension(dimensions));
|
|
59
|
-
|
|
60
|
-
role: 'none'
|
|
61
|
-
} : {};
|
|
62
|
-
return /*#__PURE__*/React.createElement("div", _extends({
|
|
57
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
63
58
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
64
59
|
style: convertedDimensions,
|
|
65
60
|
onClick: onClick,
|
|
66
|
-
"data-testid": "unhandled-error-card"
|
|
67
|
-
|
|
61
|
+
"data-testid": "unhandled-error-card",
|
|
62
|
+
role: "none",
|
|
68
63
|
className: ax(["_2rkofajl _1e0c1txw _4cvr1h6o _1bah1h6o _bfhki8nm _syazazsu _c71l1osq _p12f1osq _2lx21bp4 _1i7vfhey _31ku1h6o"])
|
|
69
|
-
}
|
|
64
|
+
}, /*#__PURE__*/React.createElement(WarningIcon, {
|
|
70
65
|
label: "Error",
|
|
71
66
|
color: "var(--ds-icon-warning, #E06C00)",
|
|
72
67
|
spacing: "spacious"
|
|
@@ -11,7 +11,6 @@ import { VcMediaWrapperProps } from '@atlaskit/react-ufo/vc-media';
|
|
|
11
11
|
import { getDefaultCardDimensions } from '../../../utils/cardDimensions';
|
|
12
12
|
import { getCSSUnitValue } from '../../../utils/getCSSUnitValue';
|
|
13
13
|
import UFOCustomData from '@atlaskit/react-ufo/custom-data';
|
|
14
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
15
14
|
export var LOCAL_WIDTH_VARIABLE = '--media-wrapper-width';
|
|
16
15
|
export var LOCAL_HEIGHT_VARIABLE = '--media-wrapper-height';
|
|
17
16
|
var wrapperStyles = {
|
|
@@ -64,9 +63,6 @@ export var Wrapper = function Wrapper(props) {
|
|
|
64
63
|
var width = getCSSUnitValue((dimensions === null || dimensions === void 0 ? void 0 : dimensions.width) || defaultImageCardDimensions.width);
|
|
65
64
|
var height = getCSSUnitValue((dimensions === null || dimensions === void 0 ? void 0 : dimensions.height) || defaultImageCardDimensions.height);
|
|
66
65
|
var wrapperShadowKey = getShadowKey(disableOverlay, selected);
|
|
67
|
-
var a11yProps = fg('platform_media_a11y_suppression_fixes') ? {
|
|
68
|
-
role: 'none'
|
|
69
|
-
} : {};
|
|
70
66
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
71
67
|
id: "newFileExperienceWrapper"
|
|
72
68
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
@@ -79,7 +75,9 @@ export var Wrapper = function Wrapper(props) {
|
|
|
79
75
|
// eslint-disable-next-line @atlassian/a11y/mouse-events-have-key-events
|
|
80
76
|
,
|
|
81
77
|
onMouseEnter: onMouseEnter
|
|
82
|
-
}, VcMediaWrapperProps,
|
|
78
|
+
}, VcMediaWrapperProps, {
|
|
79
|
+
role: "none"
|
|
80
|
+
}), /*#__PURE__*/React.createElement(UFOCustomData, {
|
|
83
81
|
data: {
|
|
84
82
|
hasMediaComponent: true
|
|
85
83
|
}
|
|
@@ -101,7 +101,7 @@ var MediaInlineCardLoader = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
101
101
|
ErrorBoundary = _this$state.ErrorBoundary;
|
|
102
102
|
var analyticsContext = {
|
|
103
103
|
packageVersion: "@atlaskit/media-card",
|
|
104
|
-
packageName: "81.
|
|
104
|
+
packageName: "81.6.0",
|
|
105
105
|
componentName: 'mediaInlineCard',
|
|
106
106
|
component: 'mediaInlineCard'
|
|
107
107
|
};
|
|
@@ -13,7 +13,7 @@ import { getMediaEnvironment, getMediaRegion } from '@atlaskit/media-client';
|
|
|
13
13
|
import { getActiveInteraction } from '@atlaskit/react-ufo/interaction-metrics';
|
|
14
14
|
import { getMediaGlobalScope } from './globalScope/globalScope';
|
|
15
15
|
var packageName = "@atlaskit/media-card";
|
|
16
|
-
var packageVersion = "81.
|
|
16
|
+
var packageVersion = "81.6.0";
|
|
17
17
|
var SAMPLE_RATE = 0.05;
|
|
18
18
|
|
|
19
19
|
/**
|
|
@@ -8,5 +8,7 @@ export type AIGeneratingOverlayProps = {
|
|
|
8
8
|
label: string;
|
|
9
9
|
/** Optional test id for the overlay root element. Defaults to `'ai-generating-overlay'`. */
|
|
10
10
|
testId?: string;
|
|
11
|
+
/** Renders an opaque sunken surface instead of the translucent blanket. */
|
|
12
|
+
isOpaque?: boolean;
|
|
11
13
|
};
|
|
12
|
-
export declare function AIGeneratingOverlay({ label, testId }: AIGeneratingOverlayProps): JSX.Element;
|
|
14
|
+
export declare function AIGeneratingOverlay({ label, testId, isOpaque, }: AIGeneratingOverlayProps): JSX.Element;
|
|
@@ -43,6 +43,7 @@ export interface CardViewProps {
|
|
|
43
43
|
shouldHideTooltip?: boolean;
|
|
44
44
|
overriddenCreationDate?: number;
|
|
45
45
|
readonly isAIGenerating?: boolean;
|
|
46
|
+
readonly isCWR?: boolean;
|
|
46
47
|
}
|
|
47
48
|
export type CardViewBaseProps = CardViewProps & WithAnalyticsEventsProps;
|
|
48
49
|
type TraceTooltipVariant = 'preview-unavailable' | 'failed-to-load';
|
|
@@ -63,6 +64,6 @@ export interface RenderConfigByStatus {
|
|
|
63
64
|
customTitleMessage?: MessageDescriptor;
|
|
64
65
|
traceTooltipVariant?: TraceTooltipVariant;
|
|
65
66
|
}
|
|
66
|
-
export declare const CardViewBase: ({ identifier, innerRef, onImageLoad, onImageError, dimensions, onClick, onMouseEnter, testId, metadata, status, selected, selectable, cardPreview, mediaCardCursor, shouldHideTooltip, progress, alt, resizeMode, onDisplayImage, nativeLazyLoad, forceSyncDisplay, actions, disableOverlay, titleBoxBgColor, titleBoxIcon, error, disableAnimation, openMediaViewerButtonRef, shouldOpenMediaViewer, overriddenCreationDate, onSvgError, onSvgLoad, traceId, isAIGenerating, backgroundColor, }: CardViewBaseProps) => React.JSX.Element;
|
|
67
|
+
export declare const CardViewBase: ({ identifier, innerRef, onImageLoad, onImageError, dimensions, onClick, onMouseEnter, testId, metadata, status, selected, selectable, cardPreview, mediaCardCursor, shouldHideTooltip, progress, alt, resizeMode, onDisplayImage, nativeLazyLoad, forceSyncDisplay, actions, disableOverlay, titleBoxBgColor, titleBoxIcon, error, disableAnimation, openMediaViewerButtonRef, shouldOpenMediaViewer, overriddenCreationDate, onSvgError, onSvgLoad, traceId, isAIGenerating, isCWR, backgroundColor, }: CardViewBaseProps) => React.JSX.Element;
|
|
67
68
|
export declare const CardView: React.ForwardRefExoticComponent<Omit<CardViewProps, keyof WithAnalyticsEventsProps> & React.RefAttributes<any>>;
|
|
68
69
|
export {};
|
|
@@ -37,6 +37,8 @@ export interface FileCardProps extends CardEventProps {
|
|
|
37
37
|
readonly backgroundColor?: React.CSSProperties['backgroundColor'];
|
|
38
38
|
/** Indicates the media card is being generated by AI (e.g. Rovo image-create). */
|
|
39
39
|
readonly isAIGenerating?: boolean;
|
|
40
|
+
/** Marks the card as part of the CWR (create-with-Rovo) infographics flow. */
|
|
41
|
+
readonly isCWR?: boolean;
|
|
40
42
|
/** Callback fired when the media card's image preview has rendered. */
|
|
41
43
|
readonly onPreviewRender?: (fileId: string) => void;
|
|
42
44
|
/** Instance of file identifier. */
|
|
@@ -84,4 +86,4 @@ export interface FileCardProps extends CardEventProps {
|
|
|
84
86
|
*/
|
|
85
87
|
readonly fallbackMediaNameFetcher?: (id: string) => Promise<string>;
|
|
86
88
|
}
|
|
87
|
-
export declare const FileCard: ({ appearance, resizeMode, isLazy, disableOverlay, featureFlags, identifier, ssr, dimensions, originalDimensions, contextId, alt, actions, shouldEnableDownloadButton, useInlinePlayer, shouldOpenMediaViewer, onFullscreenChange, selectable, selected, testId, titleBoxBgColor, titleBoxIcon, backgroundColor, isAIGenerating, onPreviewRender, shouldHideTooltip, mediaViewerItems, onClick, onMouseEnter, videoControlsWrapperRef, viewerOptions, includeHashForDuplicateFiles, ssrItemDetails, ssrFileState, onError, mediaViewerExtensions, fallbackMediaNameFetcher, }: FileCardProps) => React.JSX.Element;
|
|
89
|
+
export declare const FileCard: ({ appearance, resizeMode, isLazy, disableOverlay, featureFlags, identifier, ssr, dimensions, originalDimensions, contextId, alt, actions, shouldEnableDownloadButton, useInlinePlayer, shouldOpenMediaViewer, onFullscreenChange, selectable, selected, testId, titleBoxBgColor, titleBoxIcon, backgroundColor, isAIGenerating, isCWR, onPreviewRender, shouldHideTooltip, mediaViewerItems, onClick, onMouseEnter, videoControlsWrapperRef, viewerOptions, includeHashForDuplicateFiles, ssrItemDetails, ssrFileState, onError, mediaViewerExtensions, fallbackMediaNameFetcher, }: FileCardProps) => React.JSX.Element;
|
package/dist/types/types.d.ts
CHANGED
|
@@ -68,6 +68,7 @@ export interface SharedCardProps {
|
|
|
68
68
|
readonly backgroundColor?: React.CSSProperties['backgroundColor'];
|
|
69
69
|
readonly titleBoxIcon?: TitleBoxIcon;
|
|
70
70
|
readonly isAIGenerating?: boolean;
|
|
71
|
+
readonly isCWR?: boolean;
|
|
71
72
|
readonly onPreviewRender?: (fileId: string) => void;
|
|
72
73
|
readonly viewerOptions?: ViewerOptionsProps;
|
|
73
74
|
/** Sets options for viewer **/
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/media-card",
|
|
3
|
-
"version": "81.
|
|
3
|
+
"version": "81.6.1",
|
|
4
4
|
"description": "Includes all media card related components, CardView, CardViewSmall, Card...",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -84,7 +84,7 @@
|
|
|
84
84
|
"@atlaskit/range": "^12.0.0",
|
|
85
85
|
"@atlaskit/ssr": "workspace:^",
|
|
86
86
|
"@atlaskit/toggle": "^17.1.0",
|
|
87
|
-
"@atlassian/a11y-jest-testing": "^0.
|
|
87
|
+
"@atlassian/a11y-jest-testing": "^0.15.0",
|
|
88
88
|
"@atlassian/feature-flags-test-utils": "^1.2.0",
|
|
89
89
|
"@atlassian/testing-library": "^0.11.0",
|
|
90
90
|
"@atlassian/ufo": "^0.9.0",
|
|
@@ -155,9 +155,6 @@
|
|
|
155
155
|
"platform_media_react19_support": {
|
|
156
156
|
"type": "boolean"
|
|
157
157
|
},
|
|
158
|
-
"platform_media_a11y_suppression_fixes": {
|
|
159
|
-
"type": "boolean"
|
|
160
|
-
},
|
|
161
158
|
"platform_media_ssr_data_seed": {
|
|
162
159
|
"type": "boolean"
|
|
163
160
|
},
|