@atlaskit/renderer 108.11.11 → 108.11.12

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 (11) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/cjs/react/nodes/mediaInline.js +2 -2
  3. package/dist/cjs/ui/MediaCard.js +37 -37
  4. package/dist/cjs/ui/Renderer/index.js +1 -1
  5. package/dist/es2019/react/nodes/mediaInline.js +2 -2
  6. package/dist/es2019/ui/MediaCard.js +2 -3
  7. package/dist/es2019/ui/Renderer/index.js +1 -1
  8. package/dist/esm/react/nodes/mediaInline.js +2 -2
  9. package/dist/esm/ui/MediaCard.js +37 -37
  10. package/dist/esm/ui/Renderer/index.js +1 -1
  11. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,15 @@
1
1
  # @atlaskit/renderer
2
2
 
3
+ ## 108.11.12
4
+
5
+ ### Patch Changes
6
+
7
+ - [`7b6a2c6671b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7b6a2c6671b) - Introducing 'media-state' for handling media internal file state.
8
+ Introducing 'media-client-react' to provide hooks for seamless media-client integration with React.
9
+ Introducing 'MediaCardV2' with a feature flag to replace rxjs based fileState subscription with 'useFileState' hook.
10
+ Removed unused feature flags APIs from 'media-client' and its helper functions from 'media-common'.
11
+ - Updated dependencies
12
+
3
13
  ## 108.11.11
4
14
 
5
15
  ### Patch Changes
package/dist/cjs/react/nodes/mediaInline.js CHANGED
@@ -74,7 +74,7 @@ var RenderMediaInline = function RenderMediaInline(_ref) {
74
74
  return _regenerator.default.wrap(function _callee2$(_context2) {
75
75
  while (1) switch (_context2.prev = _context2.next) {
76
76
  case 0:
77
- mediaClient = (0, _mediaClient.getMediaClient)(mediaClientConfig, featureFlags);
77
+ mediaClient = (0, _mediaClient.getMediaClient)(mediaClientConfig);
78
78
  options = {
79
79
  collectionName: collectionName
80
80
  };
@@ -98,7 +98,7 @@ var RenderMediaInline = function RenderMediaInline(_ref) {
98
98
  return function (_x2, _x3) {
99
99
  return _ref3.apply(this, arguments);
100
100
  };
101
- }(), [collectionName, featureFlags]);
101
+ }(), [collectionName]);
102
102
  (0, _react.useEffect)(function () {
103
103
  var id = identifier.id;
104
104
  var nodeIsInCache = id && _MediaCard.mediaIdentifierMap.has(id);
package/dist/cjs/ui/MediaCard.js CHANGED
@@ -70,12 +70,12 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
70
70
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {});
71
71
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "saveFileState", /*#__PURE__*/function () {
72
72
  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(id, mediaClientConfig) {
73
- var _this$props, collectionName, featureFlags, mediaClient, options, fileState;
73
+ var collectionName, mediaClient, options, fileState;
74
74
  return _regenerator.default.wrap(function _callee$(_context) {
75
75
  while (1) switch (_context.prev = _context.next) {
76
76
  case 0:
77
- _this$props = _this.props, collectionName = _this$props.collection, featureFlags = _this$props.featureFlags;
78
- mediaClient = (0, _mediaClient.getMediaClient)(mediaClientConfig, featureFlags);
77
+ collectionName = _this.props.collection;
78
+ mediaClient = (0, _mediaClient.getMediaClient)(mediaClientConfig);
79
79
  options = {
80
80
  collectionName: collectionName
81
81
  };
@@ -133,11 +133,11 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
133
133
  key: "componentDidMount",
134
134
  value: function () {
135
135
  var _componentDidMount = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
136
- var _this$props2, rendererContext, mediaProvider, contextIdentifierProvider, id, url, collectionName, mediaProviderObject, mediaClientConfig, nodeIsInCache;
136
+ var _this$props, rendererContext, mediaProvider, contextIdentifierProvider, id, url, collectionName, mediaProviderObject, mediaClientConfig, nodeIsInCache;
137
137
  return _regenerator.default.wrap(function _callee2$(_context2) {
138
138
  while (1) switch (_context2.prev = _context2.next) {
139
139
  case 0:
140
- _this$props2 = this.props, rendererContext = _this$props2.rendererContext, mediaProvider = _this$props2.mediaProvider, contextIdentifierProvider = _this$props2.contextIdentifierProvider, id = _this$props2.id, url = _this$props2.url, collectionName = _this$props2.collection;
140
+ _this$props = this.props, rendererContext = _this$props.rendererContext, mediaProvider = _this$props.mediaProvider, contextIdentifierProvider = _this$props.contextIdentifierProvider, id = _this$props.id, url = _this$props.url, collectionName = _this$props.collection;
141
141
  if (mediaProvider) {
142
142
  _context2.next = 3;
143
143
  break;
@@ -204,9 +204,9 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
204
204
  }, {
205
205
  key: "componentWillUnmount",
206
206
  value: function componentWillUnmount() {
207
- var _this$props3 = this.props,
208
- id = _this$props3.id,
209
- dataURI = _this$props3.url;
207
+ var _this$props2 = this.props,
208
+ id = _this$props2.id,
209
+ dataURI = _this$props2.url;
210
210
  if (id) {
211
211
  mediaIdentifierMap.delete(id);
212
212
  } else if (dataURI) {
@@ -217,18 +217,18 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
217
217
  key: "renderExternal",
218
218
  value: function renderExternal(shouldOpenMediaViewer) {
219
219
  var mediaClientConfig = this.state.mediaClientConfig;
220
- var _this$props4 = this.props,
221
- cardDimensions = _this$props4.cardDimensions,
222
- resizeMode = _this$props4.resizeMode,
223
- appearance = _this$props4.appearance,
224
- url = _this$props4.url,
225
- imageStatus = _this$props4.imageStatus,
226
- disableOverlay = _this$props4.disableOverlay,
227
- alt = _this$props4.alt,
228
- featureFlags = _this$props4.featureFlags,
229
- ssr = _this$props4.ssr,
230
- rendererAppearance = _this$props4.rendererAppearance,
231
- expandByPixel = _this$props4.expandByPixel;
220
+ var _this$props3 = this.props,
221
+ cardDimensions = _this$props3.cardDimensions,
222
+ resizeMode = _this$props3.resizeMode,
223
+ appearance = _this$props3.appearance,
224
+ url = _this$props3.url,
225
+ imageStatus = _this$props3.imageStatus,
226
+ disableOverlay = _this$props3.disableOverlay,
227
+ alt = _this$props3.alt,
228
+ featureFlags = _this$props3.featureFlags,
229
+ ssr = _this$props3.ssr,
230
+ rendererAppearance = _this$props3.rendererAppearance,
231
+ expandByPixel = _this$props3.expandByPixel;
232
232
  if (imageStatus === 'loading' || !url) {
233
233
  return this.renderLoadingCard();
234
234
  }
@@ -263,23 +263,23 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
263
263
  contextIdentifierProvider = _this$state.contextIdentifierProvider,
264
264
  mediaClientConfigInState = _this$state.mediaClientConfig,
265
265
  fileState = _this$state.fileState;
266
- var _this$props5 = this.props,
267
- id = _this$props5.id,
268
- alt = _this$props5.alt,
269
- type = _this$props5.type,
270
- collection = _this$props5.collection,
271
- occurrenceKey = _this$props5.occurrenceKey,
272
- cardDimensions = _this$props5.cardDimensions,
273
- resizeMode = _this$props5.resizeMode,
274
- rendererAppearance = _this$props5.rendererAppearance,
275
- disableOverlay = _this$props5.disableOverlay,
276
- useInlinePlayer = _this$props5.useInlinePlayer,
277
- originalDimensions = _this$props5.originalDimensions,
278
- forceOpenMediaViewer = _this$props5.shouldOpenMediaViewer,
279
- featureFlags = _this$props5.featureFlags,
280
- shouldEnableDownloadButton = _this$props5.shouldEnableDownloadButton,
281
- ssr = _this$props5.ssr,
282
- expandByPixel = _this$props5.expandByPixel;
266
+ var _this$props4 = this.props,
267
+ id = _this$props4.id,
268
+ alt = _this$props4.alt,
269
+ type = _this$props4.type,
270
+ collection = _this$props4.collection,
271
+ occurrenceKey = _this$props4.occurrenceKey,
272
+ cardDimensions = _this$props4.cardDimensions,
273
+ resizeMode = _this$props4.resizeMode,
274
+ rendererAppearance = _this$props4.rendererAppearance,
275
+ disableOverlay = _this$props4.disableOverlay,
276
+ useInlinePlayer = _this$props4.useInlinePlayer,
277
+ originalDimensions = _this$props4.originalDimensions,
278
+ forceOpenMediaViewer = _this$props4.shouldOpenMediaViewer,
279
+ featureFlags = _this$props4.featureFlags,
280
+ shouldEnableDownloadButton = _this$props4.shouldEnableDownloadButton,
281
+ ssr = _this$props4.ssr,
282
+ expandByPixel = _this$props4.expandByPixel;
283
283
  var isMobile = rendererAppearance === 'mobile';
284
284
  var shouldPlayInline = useInlinePlayer !== undefined ? useInlinePlayer : true;
285
285
  var isInlinePlayer = isMobile ? false : shouldPlayInline;
package/dist/cjs/ui/Renderer/index.js CHANGED
@@ -55,7 +55,7 @@ exports.NORMAL_SEVERITY_THRESHOLD = NORMAL_SEVERITY_THRESHOLD;
55
55
  var DEGRADED_SEVERITY_THRESHOLD = 3000;
56
56
  exports.DEGRADED_SEVERITY_THRESHOLD = DEGRADED_SEVERITY_THRESHOLD;
57
57
  var packageName = "@atlaskit/renderer";
58
- var packageVersion = "108.11.11";
58
+ var packageVersion = "108.11.12";
59
59
  var Renderer = /*#__PURE__*/function (_PureComponent) {
60
60
  (0, _inherits2.default)(Renderer, _PureComponent);
61
61
  var _super = _createSuper(Renderer);
package/dist/es2019/react/nodes/mediaInline.js CHANGED
@@ -26,7 +26,7 @@ export const RenderMediaInline = ({
26
26
  }
27
27
  };
28
28
  const updateFileState = useCallback(async (id, mediaClientConfig) => {
29
- const mediaClient = getMediaClient(mediaClientConfig, featureFlags);
29
+ const mediaClient = getMediaClient(mediaClientConfig);
30
30
  const options = {
31
31
  collectionName
32
32
  };
@@ -36,7 +36,7 @@ export const RenderMediaInline = ({
36
36
  } catch (error) {
37
37
  // do not set state on error
38
38
  }
39
- }, [collectionName, featureFlags]);
39
+ }, [collectionName]);
40
40
  useEffect(() => {
41
41
  const {
42
42
  id
package/dist/es2019/ui/MediaCard.js CHANGED
@@ -38,10 +38,9 @@ export class MediaCardInternal extends Component {
38
38
  _defineProperty(this, "state", {});
39
39
  _defineProperty(this, "saveFileState", async (id, mediaClientConfig) => {
40
40
  const {
41
- collection: collectionName,
42
- featureFlags
41
+ collection: collectionName
43
42
  } = this.props;
44
- const mediaClient = getMediaClient(mediaClientConfig, featureFlags);
43
+ const mediaClient = getMediaClient(mediaClientConfig);
45
44
  const options = {
46
45
  collectionName
47
46
  };
package/dist/es2019/ui/Renderer/index.js CHANGED
@@ -35,7 +35,7 @@ import { RenderTracking } from '../../react/utils/performance/RenderTracking';
35
35
  export const NORMAL_SEVERITY_THRESHOLD = 2000;
36
36
  export const DEGRADED_SEVERITY_THRESHOLD = 3000;
37
37
  const packageName = "@atlaskit/renderer";
38
- const packageVersion = "108.11.11";
38
+ const packageVersion = "108.11.12";
39
39
  export class Renderer extends PureComponent {
40
40
  constructor(props) {
41
41
  super(props);
package/dist/esm/react/nodes/mediaInline.js CHANGED
@@ -64,7 +64,7 @@ export var RenderMediaInline = function RenderMediaInline(_ref) {
64
64
  return _regeneratorRuntime.wrap(function _callee2$(_context2) {
65
65
  while (1) switch (_context2.prev = _context2.next) {
66
66
  case 0:
67
- mediaClient = getMediaClient(mediaClientConfig, featureFlags);
67
+ mediaClient = getMediaClient(mediaClientConfig);
68
68
  options = {
69
69
  collectionName: collectionName
70
70
  };
@@ -88,7 +88,7 @@ export var RenderMediaInline = function RenderMediaInline(_ref) {
88
88
  return function (_x2, _x3) {
89
89
  return _ref3.apply(this, arguments);
90
90
  };
91
- }(), [collectionName, featureFlags]);
91
+ }(), [collectionName]);
92
92
  useEffect(function () {
93
93
  var id = identifier.id;
94
94
  var nodeIsInCache = id && mediaIdentifierMap.has(id);
package/dist/esm/ui/MediaCard.js CHANGED
@@ -58,12 +58,12 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
58
58
  _defineProperty(_assertThisInitialized(_this), "state", {});
59
59
  _defineProperty(_assertThisInitialized(_this), "saveFileState", /*#__PURE__*/function () {
60
60
  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(id, mediaClientConfig) {
61
- var _this$props, collectionName, featureFlags, mediaClient, options, fileState;
61
+ var collectionName, mediaClient, options, fileState;
62
62
  return _regeneratorRuntime.wrap(function _callee$(_context) {
63
63
  while (1) switch (_context.prev = _context.next) {
64
64
  case 0:
65
- _this$props = _this.props, collectionName = _this$props.collection, featureFlags = _this$props.featureFlags;
66
- mediaClient = getMediaClient(mediaClientConfig, featureFlags);
65
+ collectionName = _this.props.collection;
66
+ mediaClient = getMediaClient(mediaClientConfig);
67
67
  options = {
68
68
  collectionName: collectionName
69
69
  };
@@ -121,11 +121,11 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
121
121
  key: "componentDidMount",
122
122
  value: function () {
123
123
  var _componentDidMount = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
124
- var _this$props2, rendererContext, mediaProvider, contextIdentifierProvider, id, url, collectionName, mediaProviderObject, mediaClientConfig, nodeIsInCache;
124
+ var _this$props, rendererContext, mediaProvider, contextIdentifierProvider, id, url, collectionName, mediaProviderObject, mediaClientConfig, nodeIsInCache;
125
125
  return _regeneratorRuntime.wrap(function _callee2$(_context2) {
126
126
  while (1) switch (_context2.prev = _context2.next) {
127
127
  case 0:
128
- _this$props2 = this.props, rendererContext = _this$props2.rendererContext, mediaProvider = _this$props2.mediaProvider, contextIdentifierProvider = _this$props2.contextIdentifierProvider, id = _this$props2.id, url = _this$props2.url, collectionName = _this$props2.collection;
128
+ _this$props = this.props, rendererContext = _this$props.rendererContext, mediaProvider = _this$props.mediaProvider, contextIdentifierProvider = _this$props.contextIdentifierProvider, id = _this$props.id, url = _this$props.url, collectionName = _this$props.collection;
129
129
  if (mediaProvider) {
130
130
  _context2.next = 3;
131
131
  break;
@@ -192,9 +192,9 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
192
192
  }, {
193
193
  key: "componentWillUnmount",
194
194
  value: function componentWillUnmount() {
195
- var _this$props3 = this.props,
196
- id = _this$props3.id,
197
- dataURI = _this$props3.url;
195
+ var _this$props2 = this.props,
196
+ id = _this$props2.id,
197
+ dataURI = _this$props2.url;
198
198
  if (id) {
199
199
  mediaIdentifierMap.delete(id);
200
200
  } else if (dataURI) {
@@ -205,18 +205,18 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
205
205
  key: "renderExternal",
206
206
  value: function renderExternal(shouldOpenMediaViewer) {
207
207
  var mediaClientConfig = this.state.mediaClientConfig;
208
- var _this$props4 = this.props,
209
- cardDimensions = _this$props4.cardDimensions,
210
- resizeMode = _this$props4.resizeMode,
211
- appearance = _this$props4.appearance,
212
- url = _this$props4.url,
213
- imageStatus = _this$props4.imageStatus,
214
- disableOverlay = _this$props4.disableOverlay,
215
- alt = _this$props4.alt,
216
- featureFlags = _this$props4.featureFlags,
217
- ssr = _this$props4.ssr,
218
- rendererAppearance = _this$props4.rendererAppearance,
219
- expandByPixel = _this$props4.expandByPixel;
208
+ var _this$props3 = this.props,
209
+ cardDimensions = _this$props3.cardDimensions,
210
+ resizeMode = _this$props3.resizeMode,
211
+ appearance = _this$props3.appearance,
212
+ url = _this$props3.url,
213
+ imageStatus = _this$props3.imageStatus,
214
+ disableOverlay = _this$props3.disableOverlay,
215
+ alt = _this$props3.alt,
216
+ featureFlags = _this$props3.featureFlags,
217
+ ssr = _this$props3.ssr,
218
+ rendererAppearance = _this$props3.rendererAppearance,
219
+ expandByPixel = _this$props3.expandByPixel;
220
220
  if (imageStatus === 'loading' || !url) {
221
221
  return this.renderLoadingCard();
222
222
  }
@@ -251,23 +251,23 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
251
251
  contextIdentifierProvider = _this$state.contextIdentifierProvider,
252
252
  mediaClientConfigInState = _this$state.mediaClientConfig,
253
253
  fileState = _this$state.fileState;
254
- var _this$props5 = this.props,
255
- id = _this$props5.id,
256
- alt = _this$props5.alt,
257
- type = _this$props5.type,
258
- collection = _this$props5.collection,
259
- occurrenceKey = _this$props5.occurrenceKey,
260
- cardDimensions = _this$props5.cardDimensions,
261
- resizeMode = _this$props5.resizeMode,
262
- rendererAppearance = _this$props5.rendererAppearance,
263
- disableOverlay = _this$props5.disableOverlay,
264
- useInlinePlayer = _this$props5.useInlinePlayer,
265
- originalDimensions = _this$props5.originalDimensions,
266
- forceOpenMediaViewer = _this$props5.shouldOpenMediaViewer,
267
- featureFlags = _this$props5.featureFlags,
268
- shouldEnableDownloadButton = _this$props5.shouldEnableDownloadButton,
269
- ssr = _this$props5.ssr,
270
- expandByPixel = _this$props5.expandByPixel;
254
+ var _this$props4 = this.props,
255
+ id = _this$props4.id,
256
+ alt = _this$props4.alt,
257
+ type = _this$props4.type,
258
+ collection = _this$props4.collection,
259
+ occurrenceKey = _this$props4.occurrenceKey,
260
+ cardDimensions = _this$props4.cardDimensions,
261
+ resizeMode = _this$props4.resizeMode,
262
+ rendererAppearance = _this$props4.rendererAppearance,
263
+ disableOverlay = _this$props4.disableOverlay,
264
+ useInlinePlayer = _this$props4.useInlinePlayer,
265
+ originalDimensions = _this$props4.originalDimensions,
266
+ forceOpenMediaViewer = _this$props4.shouldOpenMediaViewer,
267
+ featureFlags = _this$props4.featureFlags,
268
+ shouldEnableDownloadButton = _this$props4.shouldEnableDownloadButton,
269
+ ssr = _this$props4.ssr,
270
+ expandByPixel = _this$props4.expandByPixel;
271
271
  var isMobile = rendererAppearance === 'mobile';
272
272
  var shouldPlayInline = useInlinePlayer !== undefined ? useInlinePlayer : true;
273
273
  var isInlinePlayer = isMobile ? false : shouldPlayInline;
package/dist/esm/ui/Renderer/index.js CHANGED
@@ -45,7 +45,7 @@ import { RenderTracking } from '../../react/utils/performance/RenderTracking';
45
45
  export var NORMAL_SEVERITY_THRESHOLD = 2000;
46
46
  export var DEGRADED_SEVERITY_THRESHOLD = 3000;
47
47
  var packageName = "@atlaskit/renderer";
48
- var packageVersion = "108.11.11";
48
+ var packageVersion = "108.11.12";
49
49
  export var Renderer = /*#__PURE__*/function (_PureComponent) {
50
50
  _inherits(Renderer, _PureComponent);
51
51
  var _super = _createSuper(Renderer);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/renderer",
3
- "version": "108.11.11",
3
+ "version": "108.11.12",
4
4
  "description": "Renderer component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -39,9 +39,9 @@
39
39
  "@atlaskit/emoji": "^67.4.0",
40
40
  "@atlaskit/icon": "^21.12.0",
41
41
  "@atlaskit/link-datasource": "^1.0.0",
42
- "@atlaskit/media-card": "^76.1.0",
43
- "@atlaskit/media-client": "^23.2.0",
44
- "@atlaskit/media-common": "^8.2.0",
42
+ "@atlaskit/media-card": "^76.2.0",
43
+ "@atlaskit/media-client": "^24.0.0",
44
+ "@atlaskit/media-common": "^9.0.0",
45
45
  "@atlaskit/media-filmstrip": "^47.0.0",
46
46
  "@atlaskit/media-ui": "^24.0.0",
47
47
  "@atlaskit/media-viewer": "^48.0.0",