@atlaskit/media-card 77.12.4 → 78.0.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.
Files changed (151) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/cjs/card/card.js +20 -1039
  3. package/dist/cjs/card/cardLoader.js +2 -2
  4. package/dist/cjs/card/cardView.js +255 -417
  5. package/dist/cjs/card/cardWithMediaClient.js +5 -9
  6. package/dist/cjs/card/{v2/cardviews → cardviews}/cardViewWrapper.js +8 -8
  7. package/dist/cjs/card/{v2/cardviews → cardviews}/errorCardView.js +6 -6
  8. package/dist/cjs/card/{v2/cardviews → cardviews}/iconCardView.js +5 -5
  9. package/dist/cjs/card/{v2/cardviews → cardviews}/imageCardView.js +5 -5
  10. package/dist/cjs/card/{v2/cardviews → cardviews}/index.js +2 -2
  11. package/dist/cjs/card/{v2/cardviews → cardviews}/loadingCardView.js +3 -3
  12. package/dist/cjs/card/{v2/cardviews → cardviews}/processingCardView.js +4 -4
  13. package/dist/cjs/card/{v2/cardviews → cardviews}/videoCardView.js +7 -7
  14. package/dist/cjs/card/{v2/externalImageCard.js → externalImageCard.js} +11 -11
  15. package/dist/cjs/card/{v2/fileCard.js → fileCard.js} +18 -18
  16. package/dist/cjs/card/index.js +2 -2
  17. package/dist/cjs/card/inlinePlayer.js +184 -267
  18. package/dist/cjs/card/media-card-analytics-error-boundary.js +1 -1
  19. package/dist/cjs/card/{v2/svgView → svgView}/svgView.js +9 -9
  20. package/dist/cjs/inline/loader.js +1 -1
  21. package/dist/cjs/utils/ufoExperiences.js +1 -1
  22. package/dist/es2019/card/card.js +20 -1023
  23. package/dist/es2019/card/cardLoader.js +2 -2
  24. package/dist/es2019/card/cardView.js +252 -403
  25. package/dist/es2019/card/cardWithMediaClient.js +6 -10
  26. package/dist/es2019/card/{v2/cardviews → cardviews}/cardViewWrapper.js +8 -8
  27. package/dist/es2019/card/{v2/cardviews → cardviews}/errorCardView.js +6 -6
  28. package/dist/es2019/card/{v2/cardviews → cardviews}/iconCardView.js +5 -5
  29. package/dist/es2019/card/{v2/cardviews → cardviews}/imageCardView.js +5 -5
  30. package/dist/es2019/card/{v2/cardviews → cardviews}/index.js +2 -2
  31. package/dist/es2019/card/{v2/cardviews → cardviews}/loadingCardView.js +3 -3
  32. package/dist/es2019/card/{v2/cardviews → cardviews}/processingCardView.js +4 -4
  33. package/dist/es2019/card/{v2/cardviews → cardviews}/videoCardView.js +7 -7
  34. package/dist/es2019/card/{v2/externalImageCard.js → externalImageCard.js} +11 -11
  35. package/dist/es2019/card/{v2/fileCard.js → fileCard.js} +18 -18
  36. package/dist/es2019/card/index.js +1 -1
  37. package/dist/es2019/card/inlinePlayer.js +127 -208
  38. package/dist/es2019/card/media-card-analytics-error-boundary.js +1 -1
  39. package/dist/es2019/card/{v2/svgView → svgView}/svgView.js +9 -9
  40. package/dist/es2019/inline/loader.js +1 -1
  41. package/dist/es2019/utils/ufoExperiences.js +1 -1
  42. package/dist/esm/card/card.js +21 -1040
  43. package/dist/esm/card/cardLoader.js +2 -2
  44. package/dist/esm/card/cardView.js +251 -416
  45. package/dist/esm/card/cardWithMediaClient.js +6 -10
  46. package/dist/esm/card/{v2/cardviews → cardviews}/cardViewWrapper.js +8 -8
  47. package/dist/esm/card/{v2/cardviews → cardviews}/errorCardView.js +6 -6
  48. package/dist/esm/card/{v2/cardviews → cardviews}/iconCardView.js +5 -5
  49. package/dist/esm/card/{v2/cardviews → cardviews}/imageCardView.js +5 -5
  50. package/dist/esm/card/{v2/cardviews → cardviews}/index.js +2 -2
  51. package/dist/esm/card/{v2/cardviews → cardviews}/loadingCardView.js +3 -3
  52. package/dist/esm/card/{v2/cardviews → cardviews}/processingCardView.js +4 -4
  53. package/dist/esm/card/{v2/cardviews → cardviews}/videoCardView.js +7 -7
  54. package/dist/esm/card/{v2/externalImageCard.js → externalImageCard.js} +11 -11
  55. package/dist/esm/card/{v2/fileCard.js → fileCard.js} +18 -18
  56. package/dist/esm/card/index.js +1 -1
  57. package/dist/esm/card/inlinePlayer.js +185 -269
  58. package/dist/esm/card/media-card-analytics-error-boundary.js +1 -1
  59. package/dist/esm/card/{v2/svgView → svgView}/svgView.js +9 -9
  60. package/dist/esm/inline/loader.js +1 -1
  61. package/dist/esm/utils/ufoExperiences.js +1 -1
  62. package/dist/types/card/card.d.ts +5 -66
  63. package/dist/types/card/cardLoader.d.ts +1 -1
  64. package/dist/types/card/cardView.d.ts +23 -45
  65. package/dist/types/card/cardWithMediaClient.d.ts +1 -1
  66. package/dist/types/card/{v2/cardviews → cardviews}/cardViewWrapper.d.ts +3 -3
  67. package/dist/types/card/{v2/cardviews → cardviews}/errorCardView.d.ts +1 -1
  68. package/dist/{types-ts4.5/card/v2 → types/card}/cardviews/iconCardView.d.ts +1 -1
  69. package/dist/{types-ts4.5/card/v2 → types/card}/cardviews/imageCardView.d.ts +1 -1
  70. package/dist/{types-ts4.5/card/v2 → types/card}/cardviews/index.d.ts +5 -5
  71. package/dist/types/card/{v2/cardviews → cardviews}/videoCardView.d.ts +1 -1
  72. package/dist/types/card/{v2/externalImageCard.d.ts → externalImageCard.d.ts} +1 -1
  73. package/dist/types/card/{v2/fileCard.d.ts → fileCard.d.ts} +2 -2
  74. package/dist/types/card/index.d.ts +1 -1
  75. package/dist/types/card/inlinePlayer.d.ts +2 -31
  76. package/dist/types/card/{v2/svgView → svgView}/errors.d.ts +1 -1
  77. package/dist/{types-ts4.5/card/v2 → types/card}/svgView/svgView.d.ts +2 -2
  78. package/dist/types-ts4.5/card/card.d.ts +5 -66
  79. package/dist/types-ts4.5/card/cardLoader.d.ts +1 -1
  80. package/dist/types-ts4.5/card/cardView.d.ts +23 -45
  81. package/dist/types-ts4.5/card/cardWithMediaClient.d.ts +1 -1
  82. package/dist/types-ts4.5/card/{v2/cardviews → cardviews}/cardViewWrapper.d.ts +3 -3
  83. package/dist/types-ts4.5/card/{v2/cardviews → cardviews}/errorCardView.d.ts +1 -1
  84. package/dist/{types/card/v2 → types-ts4.5/card}/cardviews/iconCardView.d.ts +1 -1
  85. package/dist/{types/card/v2 → types-ts4.5/card}/cardviews/imageCardView.d.ts +1 -1
  86. package/dist/{types/card/v2 → types-ts4.5/card}/cardviews/index.d.ts +5 -5
  87. package/dist/types-ts4.5/card/{v2/cardviews → cardviews}/videoCardView.d.ts +1 -1
  88. package/dist/types-ts4.5/card/{v2/externalImageCard.d.ts → externalImageCard.d.ts} +1 -1
  89. package/dist/types-ts4.5/card/{v2/fileCard.d.ts → fileCard.d.ts} +2 -2
  90. package/dist/types-ts4.5/card/index.d.ts +1 -1
  91. package/dist/types-ts4.5/card/inlinePlayer.d.ts +2 -31
  92. package/dist/types-ts4.5/card/{v2/svgView → svgView}/errors.d.ts +1 -1
  93. package/dist/{types/card/v2 → types-ts4.5/card}/svgView/svgView.d.ts +2 -2
  94. package/package.json +3 -6
  95. package/dist/cjs/card/cardSwitcher.js +0 -15
  96. package/dist/cjs/card/v2/cardV2.js +0 -41
  97. package/dist/cjs/card/v2/cardV2Loader.js +0 -36
  98. package/dist/cjs/card/v2/cardViewV2.js +0 -298
  99. package/dist/cjs/card/v2/cardWithMediaClientV2.js +0 -34
  100. package/dist/cjs/card/v2/inlinePlayerLazyV2.js +0 -35
  101. package/dist/cjs/card/v2/inlinePlayerV2.js +0 -224
  102. package/dist/es2019/card/cardSwitcher.js +0 -8
  103. package/dist/es2019/card/v2/cardV2.js +0 -33
  104. package/dist/es2019/card/v2/cardV2Loader.js +0 -18
  105. package/dist/es2019/card/v2/cardViewV2.js +0 -294
  106. package/dist/es2019/card/v2/cardWithMediaClientV2.js +0 -25
  107. package/dist/es2019/card/v2/inlinePlayerLazyV2.js +0 -10
  108. package/dist/es2019/card/v2/inlinePlayerV2.js +0 -166
  109. package/dist/esm/card/cardSwitcher.js +0 -8
  110. package/dist/esm/card/v2/cardV2.js +0 -34
  111. package/dist/esm/card/v2/cardV2Loader.js +0 -24
  112. package/dist/esm/card/v2/cardViewV2.js +0 -290
  113. package/dist/esm/card/v2/cardWithMediaClientV2.js +0 -27
  114. package/dist/esm/card/v2/inlinePlayerLazyV2.js +0 -23
  115. package/dist/esm/card/v2/inlinePlayerV2.js +0 -214
  116. package/dist/types/card/cardSwitcher.d.ts +0 -4
  117. package/dist/types/card/v2/cardV2.d.ts +0 -7
  118. package/dist/types/card/v2/cardV2Loader.d.ts +0 -4
  119. package/dist/types/card/v2/cardViewV2.d.ts +0 -59
  120. package/dist/types/card/v2/cardWithMediaClientV2.d.ts +0 -3
  121. package/dist/types/card/v2/inlinePlayerLazyV2.d.ts +0 -2
  122. package/dist/types/card/v2/inlinePlayerV2.d.ts +0 -24
  123. package/dist/types-ts4.5/card/cardSwitcher.d.ts +0 -4
  124. package/dist/types-ts4.5/card/v2/cardV2.d.ts +0 -7
  125. package/dist/types-ts4.5/card/v2/cardV2Loader.d.ts +0 -4
  126. package/dist/types-ts4.5/card/v2/cardViewV2.d.ts +0 -59
  127. package/dist/types-ts4.5/card/v2/cardWithMediaClientV2.d.ts +0 -3
  128. package/dist/types-ts4.5/card/v2/inlinePlayerLazyV2.d.ts +0 -2
  129. package/dist/types-ts4.5/card/v2/inlinePlayerV2.d.ts +0 -24
  130. /package/dist/cjs/card/{v2/performance.js → performance.js} +0 -0
  131. /package/dist/cjs/card/{v2/svgView → svgView}/errors.js +0 -0
  132. /package/dist/cjs/card/{v2/svgView → svgView}/helpers.js +0 -0
  133. /package/dist/cjs/card/{v2/svgView → svgView}/index.js +0 -0
  134. /package/dist/es2019/card/{v2/performance.js → performance.js} +0 -0
  135. /package/dist/es2019/card/{v2/svgView → svgView}/errors.js +0 -0
  136. /package/dist/es2019/card/{v2/svgView → svgView}/helpers.js +0 -0
  137. /package/dist/es2019/card/{v2/svgView → svgView}/index.js +0 -0
  138. /package/dist/esm/card/{v2/performance.js → performance.js} +0 -0
  139. /package/dist/esm/card/{v2/svgView → svgView}/errors.js +0 -0
  140. /package/dist/esm/card/{v2/svgView → svgView}/helpers.js +0 -0
  141. /package/dist/esm/card/{v2/svgView → svgView}/index.js +0 -0
  142. /package/dist/types/card/{v2/cardviews → cardviews}/loadingCardView.d.ts +0 -0
  143. /package/dist/types/card/{v2/cardviews → cardviews}/processingCardView.d.ts +0 -0
  144. /package/dist/types/card/{v2/performance.d.ts → performance.d.ts} +0 -0
  145. /package/dist/types/card/{v2/svgView → svgView}/helpers.d.ts +0 -0
  146. /package/dist/types/card/{v2/svgView → svgView}/index.d.ts +0 -0
  147. /package/dist/types-ts4.5/card/{v2/cardviews → cardviews}/loadingCardView.d.ts +0 -0
  148. /package/dist/types-ts4.5/card/{v2/cardviews → cardviews}/processingCardView.d.ts +0 -0
  149. /package/dist/types-ts4.5/card/{v2/performance.d.ts → performance.d.ts} +0 -0
  150. /package/dist/types-ts4.5/card/{v2/svgView → svgView}/helpers.d.ts +0 -0
  151. /package/dist/types-ts4.5/card/{v2/svgView → svgView}/index.d.ts +0 -0
@@ -9,27 +9,18 @@ exports.getPreferredVideoArtifact = exports.InlinePlayerBase = exports.InlinePla
9
9
  var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
10
10
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
11
  var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
12
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
13
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
14
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
15
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
16
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
17
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
18
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
12
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
19
13
  var _react = _interopRequireWildcard(require("react"));
20
14
  var _mediaClient = require("@atlaskit/media-client");
21
15
  var _mediaUi = require("@atlaskit/media-ui");
22
16
  var _utils = require("../utils");
23
17
  var _cardLoading = require("../utils/lightCards/cardLoading");
24
18
  var _progressBar = require("./ui/progressBar/progressBar");
25
- var _styles = require("./ui/styles");
26
- var _isValidPercentageUnit = require("../utils/isValidPercentageUnit");
27
- var _getElementDimension = require("../utils/getElementDimension");
28
19
  var _inlinePlayerWrapper = require("./inlinePlayerWrapper");
20
+ var _useBreakpoint = require("./useBreakpoint");
21
+ var _mediaClientReact = require("@atlaskit/media-client-react");
29
22
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
30
23
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
31
- function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
32
- function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
33
24
  var getPreferredVideoArtifact = exports.getPreferredVideoArtifact = function getPreferredVideoArtifact(fileState) {
34
25
  if (fileState.status === 'processed' || fileState.status === 'processing') {
35
26
  var artifacts = fileState.artifacts;
@@ -40,265 +31,191 @@ var getPreferredVideoArtifact = exports.getPreferredVideoArtifact = function get
40
31
  }
41
32
  return undefined;
42
33
  };
43
- var InlinePlayerBase = exports.InlinePlayerBase = /*#__PURE__*/function (_Component) {
44
- (0, _inherits2.default)(InlinePlayerBase, _Component);
45
- var _super = _createSuper(InlinePlayerBase);
46
- function InlinePlayerBase() {
47
- var _this;
48
- (0, _classCallCheck2.default)(this, InlinePlayerBase);
49
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
50
- args[_key] = arguments[_key];
51
- }
52
- _this = _super.call.apply(_super, [this].concat(args));
53
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {});
54
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "divRef", /*#__PURE__*/_react.default.createRef());
55
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setFileSrc", function (fileSrc) {
56
- _this.setState({
57
- fileSrc: fileSrc
58
- });
59
- });
60
- // Tries to use the binary artifact to provide something to play while the video is still processing
61
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setBinaryURL", /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
62
- var _this$props, mediaClient, identifier, onError, id, collectionName, fileSrc;
63
- return _regenerator.default.wrap(function _callee$(_context) {
64
- while (1) switch (_context.prev = _context.next) {
65
- case 0:
66
- _this$props = _this.props, mediaClient = _this$props.mediaClient, identifier = _this$props.identifier, onError = _this$props.onError;
67
- id = identifier.id, collectionName = identifier.collectionName;
68
- _context.prev = 2;
69
- _context.next = 5;
70
- return mediaClient.file.getFileBinaryURL(id, collectionName);
71
- case 5:
72
- fileSrc = _context.sent;
73
- _this.setFileSrc(fileSrc);
74
- _context.next = 12;
75
- break;
76
- case 9:
77
- _context.prev = 9;
78
- _context.t0 = _context["catch"](2);
79
- if (onError && _context.t0 instanceof Error) {
80
- onError(_context.t0);
81
- }
82
- case 12:
83
- case "end":
84
- return _context.stop();
85
- }
86
- }, _callee, null, [[2, 9]]);
87
- })));
88
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "unsubscribe", function () {
89
- if (_this.subscription) {
90
- _this.subscription.unsubscribe();
91
- }
92
- });
93
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "revoke", function () {
94
- var fileSrc = _this.state.fileSrc;
95
- if (fileSrc) {
96
- URL.revokeObjectURL(fileSrc);
97
- }
98
- });
99
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onDownloadClick", function () {
100
- var _this$props2 = _this.props,
101
- mediaClient = _this$props2.mediaClient,
102
- identifier = _this$props2.identifier;
103
- var id = identifier.id,
104
- collectionName = identifier.collectionName;
105
- mediaClient.file.downloadBinary(id, undefined, collectionName);
106
- });
107
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onFirstPlay", function () {
108
- var identifier = _this.props.identifier;
109
- _mediaClient.globalMediaEventEmitter.emit('media-viewed', {
110
- fileId: identifier.id,
111
- viewingLevel: 'full'
112
- });
113
- });
114
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "saveElementWidth", function () {
115
- var dimensions = _this.props.dimensions;
116
- if (!dimensions) {
117
- return;
118
- }
119
- var width = dimensions.width;
120
- if (width && (0, _isValidPercentageUnit.isValidPercentageUnit)(width) && !!_this.divRef.current) {
121
- var elementWidth = (0, _getElementDimension.getElementDimension)(_this.divRef.current, 'width');
122
- _this.setState({
123
- elementWidth: elementWidth
124
- });
125
- }
126
- });
127
- return _this;
128
- }
129
- (0, _createClass2.default)(InlinePlayerBase, [{
130
- key: "componentDidMount",
131
- value: function componentDidMount() {
132
- var _this2 = this;
133
- this.saveElementWidth();
134
- var _this$props3 = this.props,
135
- mediaClient = _this$props3.mediaClient,
136
- identifier = _this$props3.identifier;
137
- var id = identifier.id,
138
- collectionName = identifier.collectionName;
139
- this.revoke();
140
- this.unsubscribe();
141
- this.subscription = mediaClient.file.getFileState(id, {
142
- collectionName: collectionName
143
- }).subscribe({
144
- next: function () {
145
- var _next = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(fileState) {
146
- var existingFileSrc, _yield$fileState$prev, value, fileSrc, artifactName, artifacts, _fileSrc, onError;
147
- return _regenerator.default.wrap(function _callee2$(_context2) {
148
- while (1) switch (_context2.prev = _context2.next) {
149
- case 0:
150
- if (fileState.status === 'uploading') {
151
- _this2.setState({
152
- isUploading: true,
153
- progress: fileState.progress
154
- });
155
- } else {
156
- _this2.setState({
157
- isUploading: false
158
- });
159
- }
160
- existingFileSrc = _this2.state.fileSrc; // we want to reuse the existing fileSrc to prevent re renders
161
- if (!existingFileSrc) {
162
- _context2.next = 4;
163
- break;
164
- }
165
- return _context2.abrupt("return");
166
- case 4:
167
- if (!(fileState.status !== 'error' && fileState.preview)) {
168
- _context2.next = 13;
169
- break;
170
- }
171
- _context2.next = 7;
172
- return fileState.preview;
173
- case 7:
174
- _yield$fileState$prev = _context2.sent;
175
- value = _yield$fileState$prev.value;
176
- if (!(value instanceof Blob && value.type.indexOf('video/') === 0)) {
177
- _context2.next = 13;
178
- break;
179
- }
180
- fileSrc = URL.createObjectURL(value);
181
- _this2.setFileSrc(fileSrc);
182
- return _context2.abrupt("return");
183
- case 13:
184
- if (!(fileState.status === 'processed' || fileState.status === 'processing')) {
185
- _context2.next = 30;
186
- break;
187
- }
188
- artifactName = getPreferredVideoArtifact(fileState);
189
- artifacts = fileState.artifacts;
190
- if (!(!artifactName || !artifacts)) {
191
- _context2.next = 19;
192
- break;
193
- }
194
- _this2.setBinaryURL();
195
- return _context2.abrupt("return");
196
- case 19:
197
- _context2.prev = 19;
198
- _context2.next = 22;
199
- return mediaClient.file.getArtifactURL(artifacts, artifactName, collectionName);
200
- case 22:
201
- _fileSrc = _context2.sent;
202
- _this2.setFileSrc(_fileSrc);
203
- _context2.next = 30;
204
- break;
205
- case 26:
206
- _context2.prev = 26;
207
- _context2.t0 = _context2["catch"](19);
208
- onError = _this2.props.onError;
209
- if (onError && _context2.t0 instanceof Error) {
210
- onError(_context2.t0);
211
- }
212
- case 30:
213
- case "end":
214
- return _context2.stop();
34
+ var InlinePlayerBase = exports.InlinePlayerBase = function InlinePlayerBase(_ref) {
35
+ var identifier = _ref.identifier,
36
+ onError = _ref.onError,
37
+ onClick = _ref.onClick,
38
+ _ref$dimensions = _ref.dimensions,
39
+ dimensions = _ref$dimensions === void 0 ? _utils.defaultImageCardDimensions : _ref$dimensions,
40
+ originalDimensions = _ref.originalDimensions,
41
+ selected = _ref.selected,
42
+ testId = _ref.testId,
43
+ forwardRef = _ref.forwardRef,
44
+ autoplay = _ref.autoplay,
45
+ cardPreview = _ref.cardPreview,
46
+ onFullscreenChange = _ref.onFullscreenChange,
47
+ videoControlsWrapperRef = _ref.videoControlsWrapperRef;
48
+ // === States ===
49
+ var _useState = (0, _react.useState)(),
50
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
51
+ fileSrc = _useState2[0],
52
+ setFileSrc = _useState2[1];
53
+ var _useState3 = (0, _react.useState)(),
54
+ _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
55
+ isUploading = _useState4[0],
56
+ setIsUploading = _useState4[1];
57
+ var _useState5 = (0, _react.useState)(),
58
+ _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
59
+ progress = _useState6[0],
60
+ setProgress = _useState6[1];
61
+
62
+ // === Refs and Local Variables ===
63
+ var divRef = (0, _react.useRef)(null);
64
+ var onErrorRef = (0, _react.useRef)(onError);
65
+ onErrorRef.current = onError;
66
+ var id = identifier.id,
67
+ collectionName = identifier.collectionName,
68
+ occurrenceKey = identifier.occurrenceKey;
69
+ var breakpoint = (0, _useBreakpoint.useBreakpoint)(dimensions === null || dimensions === void 0 ? void 0 : dimensions.width, divRef);
70
+ var mediaClient = (0, _mediaClientReact.useMediaClient)();
71
+ var _useFileState = (0, _mediaClientReact.useFileState)(id, {
72
+ collectionName: collectionName,
73
+ occurrenceKey: occurrenceKey
74
+ }),
75
+ fileState = _useFileState.fileState;
76
+ (0, _react.useEffect)(function () {
77
+ var subscribeFileState = /*#__PURE__*/function () {
78
+ var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(fileState) {
79
+ var _yield$fileState$prev, value, newFileSrc, artifactName, artifacts, _newFileSrc, _newFileSrc2;
80
+ return _regenerator.default.wrap(function _callee$(_context) {
81
+ while (1) switch (_context.prev = _context.next) {
82
+ case 0:
83
+ if (fileState.status === 'uploading') {
84
+ setIsUploading(true);
85
+ setProgress(fileState.progress);
86
+ } else {
87
+ setIsUploading(false);
88
+ }
89
+
90
+ // We reuse the existing fileSrc to prevent re renders, therefore we only perform fileSrc updates when there isn't any
91
+ if (!fileSrc) {
92
+ _context.next = 3;
93
+ break;
94
+ }
95
+ return _context.abrupt("return");
96
+ case 3:
97
+ if (!(fileState.status !== 'error' && fileState.preview)) {
98
+ _context.next = 12;
99
+ break;
215
100
  }
216
- }, _callee2, null, [[19, 26]]);
217
- }));
218
- function next(_x) {
219
- return _next.apply(this, arguments);
101
+ _context.next = 6;
102
+ return fileState.preview;
103
+ case 6:
104
+ _yield$fileState$prev = _context.sent;
105
+ value = _yield$fileState$prev.value;
106
+ if (!(value instanceof Blob && value.type.indexOf('video/') === 0)) {
107
+ _context.next = 12;
108
+ break;
109
+ }
110
+ newFileSrc = URL.createObjectURL(value);
111
+ setFileSrc(newFileSrc);
112
+ return _context.abrupt("return");
113
+ case 12:
114
+ if (!(fileState.status === 'processed' || fileState.status === 'processing')) {
115
+ _context.next = 37;
116
+ break;
117
+ }
118
+ artifactName = getPreferredVideoArtifact(fileState);
119
+ artifacts = fileState.artifacts;
120
+ if (!(!artifactName || !artifacts)) {
121
+ _context.next = 27;
122
+ break;
123
+ }
124
+ _context.prev = 16;
125
+ _context.next = 19;
126
+ return mediaClient.file.getFileBinaryURL(id, collectionName);
127
+ case 19:
128
+ _newFileSrc = _context.sent;
129
+ setFileSrc(_newFileSrc);
130
+ _context.next = 26;
131
+ break;
132
+ case 23:
133
+ _context.prev = 23;
134
+ _context.t0 = _context["catch"](16);
135
+ if (onErrorRef.current && _context.t0 instanceof Error) {
136
+ onErrorRef.current(_context.t0);
137
+ }
138
+ case 26:
139
+ return _context.abrupt("return");
140
+ case 27:
141
+ _context.prev = 27;
142
+ _context.next = 30;
143
+ return mediaClient.file.getArtifactURL(artifacts, artifactName, collectionName);
144
+ case 30:
145
+ _newFileSrc2 = _context.sent;
146
+ setFileSrc(_newFileSrc2);
147
+ _context.next = 37;
148
+ break;
149
+ case 34:
150
+ _context.prev = 34;
151
+ _context.t1 = _context["catch"](27);
152
+ if (onErrorRef.current && _context.t1 instanceof Error) {
153
+ onErrorRef.current(_context.t1);
154
+ }
155
+ case 37:
156
+ case "end":
157
+ return _context.stop();
220
158
  }
221
- return next;
222
- }()
223
- });
224
- }
225
- }, {
226
- key: "componentWillUnmount",
227
- value: function componentWillUnmount() {
228
- this.unsubscribe();
229
- this.revoke();
230
- }
231
- }, {
232
- key: "breakpoint",
233
- get: function get() {
234
- var width = this.state.elementWidth || (this.props.dimensions ? this.props.dimensions.width : '') || _utils.defaultImageCardDimensions.width;
235
- return (0, _styles.calcBreakpointSize)(parseInt("".concat(width), 10));
159
+ }, _callee, null, [[16, 23], [27, 34]]);
160
+ }));
161
+ return function subscribeFileState(_x) {
162
+ return _ref2.apply(this, arguments);
163
+ };
164
+ }();
165
+ if (fileState) {
166
+ subscribeFileState(fileState);
236
167
  }
237
- }, {
238
- key: "render",
239
- value: function render() {
240
- var _this3 = this;
241
- var _this$props4 = this.props,
242
- onClick = _this$props4.onClick,
243
- dimensions = _this$props4.dimensions,
244
- originalDimensions = _this$props4.originalDimensions,
245
- selected = _this$props4.selected,
246
- testId = _this$props4.testId,
247
- identifier = _this$props4.identifier,
248
- forwardRef = _this$props4.forwardRef,
249
- autoplay = _this$props4.autoplay,
250
- cardPreview = _this$props4.cardPreview,
251
- onFullscreenChange = _this$props4.onFullscreenChange,
252
- videoControlsWrapperRef = _this$props4.videoControlsWrapperRef;
253
- var _this$state = this.state,
254
- fileSrc = _this$state.fileSrc,
255
- isUploading = _this$state.isUploading,
256
- progress = _this$state.progress;
257
- if (!fileSrc) {
258
- return /*#__PURE__*/_react.default.createElement(_cardLoading.CardLoading, {
259
- testId: testId,
260
- dimensions: dimensions
261
- });
262
- }
263
- return /*#__PURE__*/_react.default.createElement(_inlinePlayerWrapper.InlinePlayerWrapper, {
264
- testId: testId || 'media-card-inline-player',
265
- selected: {
266
- selected: selected
267
- },
268
- onClick: onClick,
269
- innerRef: forwardRef || undefined,
270
- dimensions: dimensions
271
- }, /*#__PURE__*/_react.default.createElement(_mediaUi.InactivityDetector, null, function (checkMouseMovement) {
272
- return /*#__PURE__*/_react.default.createElement(_mediaUi.CustomMediaPlayer, {
273
- type: "video",
274
- src: fileSrc,
275
- onFullscreenChange: onFullscreenChange,
276
- fileId: identifier.id,
277
- isAutoPlay: autoplay,
278
- isHDAvailable: false,
279
- onDownloadClick: _this3.onDownloadClick,
280
- onFirstPlay: _this3.onFirstPlay,
281
- lastWatchTimeConfig: {
282
- contentId: identifier.id
283
- },
284
- originalDimensions: originalDimensions,
285
- showControls: checkMouseMovement,
286
- poster: cardPreview === null || cardPreview === void 0 ? void 0 : cardPreview.dataURI,
287
- videoControlsWrapperRef: videoControlsWrapperRef
168
+ }, [fileState, collectionName, fileSrc, id, mediaClient]);
169
+ (0, _react.useEffect)(function () {
170
+ return function () {
171
+ fileSrc && URL.revokeObjectURL(fileSrc);
172
+ };
173
+ }, [fileSrc]);
174
+
175
+ // === Render ===
176
+ return fileSrc ? /*#__PURE__*/_react.default.createElement(_inlinePlayerWrapper.InlinePlayerWrapper, {
177
+ testId: testId || 'media-card-inline-player',
178
+ selected: {
179
+ selected: selected
180
+ },
181
+ onClick: onClick,
182
+ innerRef: forwardRef || undefined,
183
+ dimensions: dimensions
184
+ }, /*#__PURE__*/_react.default.createElement(_mediaUi.InactivityDetector, null, function (checkMouseMovement) {
185
+ return /*#__PURE__*/_react.default.createElement(_mediaUi.CustomMediaPlayer, {
186
+ type: "video",
187
+ src: fileSrc,
188
+ onFullscreenChange: onFullscreenChange,
189
+ fileId: id,
190
+ isAutoPlay: autoplay,
191
+ isHDAvailable: false,
192
+ onDownloadClick: function onDownloadClick() {
193
+ mediaClient.file.downloadBinary(id, undefined, collectionName);
194
+ },
195
+ onFirstPlay: function onFirstPlay() {
196
+ _mediaClient.globalMediaEventEmitter.emit('media-viewed', {
197
+ fileId: id,
198
+ viewingLevel: 'full'
288
199
  });
289
- }), isUploading ? /*#__PURE__*/_react.default.createElement(_progressBar.ProgressBar, {
290
- progress: progress,
291
- breakpoint: this.breakpoint,
292
- positionBottom: true,
293
- showOnTop: true
294
- }) : null);
295
- }
296
- }]);
297
- return InlinePlayerBase;
298
- }(_react.Component);
299
- (0, _defineProperty2.default)(InlinePlayerBase, "defaultProps", {
300
- dimensions: _utils.defaultImageCardDimensions
301
- });
200
+ },
201
+ lastWatchTimeConfig: {
202
+ contentId: id
203
+ },
204
+ originalDimensions: originalDimensions,
205
+ showControls: checkMouseMovement,
206
+ poster: cardPreview === null || cardPreview === void 0 ? void 0 : cardPreview.dataURI,
207
+ videoControlsWrapperRef: videoControlsWrapperRef
208
+ });
209
+ }), isUploading && /*#__PURE__*/_react.default.createElement(_progressBar.ProgressBar, {
210
+ progress: progress,
211
+ breakpoint: breakpoint,
212
+ positionBottom: true,
213
+ showOnTop: true
214
+ })) : /*#__PURE__*/_react.default.createElement(_cardLoading.CardLoading, {
215
+ testId: testId,
216
+ dimensions: dimensions
217
+ });
218
+ };
302
219
  var InlinePlayerForwardRef = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
303
220
  return /*#__PURE__*/_react.default.createElement(InlinePlayerBase, (0, _extends2.default)({}, props, {
304
221
  forwardRef: ref
@@ -90,7 +90,7 @@ var WrappedMediaCardAnalyticsErrorBoundary = /*#__PURE__*/function (_React$Compo
90
90
  }(_react.default.Component);
91
91
  (0, _defineProperty2.default)(WrappedMediaCardAnalyticsErrorBoundary, "displayName", 'MediaCardAnalyticsErrorBoundary');
92
92
  var packageName = "@atlaskit/media-card";
93
- var packageVersion = "77.12.4";
93
+ var packageVersion = "78.0.1";
94
94
  var MediaCardAnalyticsErrorBoundary = (0, _mediaCommon.withMediaAnalyticsContext)({
95
95
  packageVersion: packageVersion,
96
96
  packageName: packageName,
@@ -10,17 +10,17 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
10
10
  var _react = require("@emotion/react");
11
11
  var _react2 = _interopRequireWildcard(require("react"));
12
12
  var _analyticsNext = require("@atlaskit/analytics-next");
13
- var _analytics = require("../../../utils/analytics");
14
- var _imageRenderer = require("../../ui/imageRenderer/imageRenderer");
15
- var _progressBar = require("../../ui/progressBar/progressBar");
16
- var _blanket = require("../../ui/blanket/blanket");
17
- var _wrapper = require("../../ui/wrapper");
18
- var _classnames = require("../../classnames");
19
- var _useBreakpoint = require("../../useBreakpoint");
13
+ var _analytics = require("../../utils/analytics");
14
+ var _imageRenderer = require("../ui/imageRenderer/imageRenderer");
15
+ var _progressBar = require("../ui/progressBar/progressBar");
16
+ var _blanket = require("../ui/blanket/blanket");
17
+ var _wrapper = require("../ui/wrapper");
18
+ var _classnames = require("../classnames");
19
+ var _useBreakpoint = require("../useBreakpoint");
20
20
  var _mediaSvg = _interopRequireDefault(require("@atlaskit/media-svg"));
21
21
  var _helpers = require("./helpers");
22
- var _openMediaViewerButton = _interopRequireDefault(require("../../ui/openMediaViewerButton/openMediaViewerButton"));
23
- var _errors = require("../../../errors");
22
+ var _openMediaViewerButton = _interopRequireDefault(require("../ui/openMediaViewerButton/openMediaViewerButton"));
23
+ var _errors = require("../../errors");
24
24
  var _errors2 = require("./errors");
25
25
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
26
26
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -119,7 +119,7 @@ var MediaInlineCardLoader = exports.default = /*#__PURE__*/function (_React$Pure
119
119
  ErrorBoundary = _this$state.ErrorBoundary;
120
120
  var analyticsContext = {
121
121
  packageVersion: "@atlaskit/media-card",
122
- packageName: "77.12.4",
122
+ packageName: "78.0.1",
123
123
  componentName: 'mediaInlineCard',
124
124
  component: 'mediaInlineCard'
125
125
  };
@@ -14,7 +14,7 @@ var _mediaClient = require("@atlaskit/media-client");
14
14
  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; }
15
15
  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; }
16
16
  var packageName = "@atlaskit/media-card";
17
- var packageVersion = "77.12.4";
17
+ var packageVersion = "78.0.1";
18
18
  var concurrentExperience;
19
19
  var getExperience = function getExperience(id) {
20
20
  if (!concurrentExperience) {