@atlaskit/renderer 108.11.10 → 108.11.12

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/renderer
 
+## 108.11.12
+
+### Patch Changes
+
+- [`7b6a2c6671b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7b6a2c6671b) - Introducing 'media-state' for handling media internal file state.
+  Introducing 'media-client-react' to provide hooks for seamless media-client integration with React.
+  Introducing 'MediaCardV2' with a feature flag to replace rxjs based fileState subscription with 'useFileState' hook.
+  Removed unused feature flags APIs from 'media-client' and its helper functions from 'media-common'.
+- Updated dependencies
+
+## 108.11.11
+
+### Patch Changes
+
+- [`e0de9e09b5f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e0de9e09b5f) - Use table container width when calculating column widths to scale down, in renderer. Behind feature flag platform.editor.custom-table-width-scale-down-undefined-column_nkyvx
+- Updated dependencies
+
 ## 108.11.10
 
 ### Patch Changes

package/dist/cjs/react/nodes/mediaInline.js

@@ -74,7 +74,7 @@ var RenderMediaInline = function RenderMediaInline(_ref) {
       return _regenerator.default.wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
-            mediaClient = (0, _mediaClient.getMediaClient)(mediaClientConfig, featureFlags);
+            mediaClient = (0, _mediaClient.getMediaClient)(mediaClientConfig);
             options = {
               collectionName: collectionName
             };
@@ -98,7 +98,7 @@ var RenderMediaInline = function RenderMediaInline(_ref) {
     return function (_x2, _x3) {
       return _ref3.apply(this, arguments);
     };
-  }(), [collectionName, featureFlags]);
+  }(), [collectionName]);
   (0, _react.useEffect)(function () {
     var id = identifier.id;
     var nodeIsInCache = id && _MediaCard.mediaIdentifierMap.has(id);

package/dist/cjs/react/nodes/table/colgroup.js

@@ -61,22 +61,27 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
     renderWidth = props.renderWidth,
     tableNode = props.tableNode,
     rendererAppearance = props.rendererAppearance;
-  var tableContainerWidth;
   if (!columnWidths) {
     return [];
   }
-  var columnAmount = columnWidths.length;
+  var tableContainerWidth;
   var tableResized = isTableResized(columnWidths);
+  var noOfColumns = columnWidths.length;
   var targetWidths;
+  if ((0, _table.isTableResizingEnabled)(rendererAppearance) && tableNode) {
+    tableContainerWidth = (0, _nodeWidth.getTableContainerWidth)(tableNode);
+  } else {
+    tableContainerWidth = getTableLayoutWidth(layout);
+  }
   if ((0, _table.isTableResizingEnabled)(rendererAppearance) && !tableResized) {
     if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.custom-table-width-scale-down-undefined-column_nkyvx')) {
-      // Code path executed when feature flag is on
-      var tableDefaultWidth = isNumberColumnEnabled ? _editorSharedStyles.akEditorDefaultLayoutWidth - _editorSharedStyles.akEditorTableNumberColumnWidth : _editorSharedStyles.akEditorDefaultLayoutWidth;
-      // take off 1 px for border incase column width wider than table width
-      var defaultColumnWidth = Math.floor((tableDefaultWidth - 1) / columnAmount);
-      targetWidths = new Array(columnAmount).fill(defaultColumnWidth);
+      // for tables with no column widths defined, assume that the real table width
+      // is defined by node.attrs.width
+      var _tableWidth2 = isNumberColumnEnabled ? tableContainerWidth - _editorSharedStyles.akEditorTableNumberColumnWidth : tableContainerWidth;
+      var defaultColumnWidth = Math.floor(_tableWidth2 / noOfColumns);
+      targetWidths = new Array(noOfColumns).fill(defaultColumnWidth);
     } else {
-      return new Array(columnAmount).fill({
+      return new Array(noOfColumns).fill({
         minWidth: "".concat(_styles.tableCellMinWidth, "px")
       });
     }
@@ -84,11 +89,6 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
     return null;
   }
   targetWidths = targetWidths || columnWidths;
-  if ((0, _table.isTableResizingEnabled)(rendererAppearance) && tableNode) {
-    tableContainerWidth = (0, _nodeWidth.getTableContainerWidth)(tableNode);
-  } else {
-    tableContainerWidth = getTableLayoutWidth(layout);
-  }
 
   // @see ED-6056
   var maxTableWidth = renderWidth < tableContainerWidth ? renderWidth : tableContainerWidth;

package/dist/cjs/ui/MediaCard.js

@@ -70,12 +70,12 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {});
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "saveFileState", /*#__PURE__*/function () {
       var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(id, mediaClientConfig) {
-        var _this$props, collectionName, featureFlags, mediaClient, options, fileState;
+        var collectionName, mediaClient, options, fileState;
         return _regenerator.default.wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
-              _this$props = _this.props, collectionName = _this$props.collection, featureFlags = _this$props.featureFlags;
-              mediaClient = (0, _mediaClient.getMediaClient)(mediaClientConfig, featureFlags);
+              collectionName = _this.props.collection;
+              mediaClient = (0, _mediaClient.getMediaClient)(mediaClientConfig);
               options = {
                 collectionName: collectionName
               };
@@ -133,11 +133,11 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
     key: "componentDidMount",
     value: function () {
       var _componentDidMount = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
-        var _this$props2, rendererContext, mediaProvider, contextIdentifierProvider, id, url, collectionName, mediaProviderObject, mediaClientConfig, nodeIsInCache;
+        var _this$props, rendererContext, mediaProvider, contextIdentifierProvider, id, url, collectionName, mediaProviderObject, mediaClientConfig, nodeIsInCache;
         return _regenerator.default.wrap(function _callee2$(_context2) {
           while (1) switch (_context2.prev = _context2.next) {
             case 0:
-              _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;
+              _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;
               if (mediaProvider) {
                 _context2.next = 3;
                 break;
@@ -204,9 +204,9 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
   }, {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
-      var _this$props3 = this.props,
-        id = _this$props3.id,
-        dataURI = _this$props3.url;
+      var _this$props2 = this.props,
+        id = _this$props2.id,
+        dataURI = _this$props2.url;
       if (id) {
         mediaIdentifierMap.delete(id);
       } else if (dataURI) {
@@ -217,18 +217,18 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
     key: "renderExternal",
     value: function renderExternal(shouldOpenMediaViewer) {
       var mediaClientConfig = this.state.mediaClientConfig;
-      var _this$props4 = this.props,
-        cardDimensions = _this$props4.cardDimensions,
-        resizeMode = _this$props4.resizeMode,
-        appearance = _this$props4.appearance,
-        url = _this$props4.url,
-        imageStatus = _this$props4.imageStatus,
-        disableOverlay = _this$props4.disableOverlay,
-        alt = _this$props4.alt,
-        featureFlags = _this$props4.featureFlags,
-        ssr = _this$props4.ssr,
-        rendererAppearance = _this$props4.rendererAppearance,
-        expandByPixel = _this$props4.expandByPixel;
+      var _this$props3 = this.props,
+        cardDimensions = _this$props3.cardDimensions,
+        resizeMode = _this$props3.resizeMode,
+        appearance = _this$props3.appearance,
+        url = _this$props3.url,
+        imageStatus = _this$props3.imageStatus,
+        disableOverlay = _this$props3.disableOverlay,
+        alt = _this$props3.alt,
+        featureFlags = _this$props3.featureFlags,
+        ssr = _this$props3.ssr,
+        rendererAppearance = _this$props3.rendererAppearance,
+        expandByPixel = _this$props3.expandByPixel;
       if (imageStatus === 'loading' || !url) {
         return this.renderLoadingCard();
       }
@@ -263,23 +263,23 @@ var MediaCardInternal = /*#__PURE__*/function (_Component) {
         contextIdentifierProvider = _this$state.contextIdentifierProvider,
         mediaClientConfigInState = _this$state.mediaClientConfig,
         fileState = _this$state.fileState;
-      var _this$props5 = this.props,
-        id = _this$props5.id,
-        alt = _this$props5.alt,
-        type = _this$props5.type,
-        collection = _this$props5.collection,
-        occurrenceKey = _this$props5.occurrenceKey,
-        cardDimensions = _this$props5.cardDimensions,
-        resizeMode = _this$props5.resizeMode,
-        rendererAppearance = _this$props5.rendererAppearance,
-        disableOverlay = _this$props5.disableOverlay,
-        useInlinePlayer = _this$props5.useInlinePlayer,
-        originalDimensions = _this$props5.originalDimensions,
-        forceOpenMediaViewer = _this$props5.shouldOpenMediaViewer,
-        featureFlags = _this$props5.featureFlags,
-        shouldEnableDownloadButton = _this$props5.shouldEnableDownloadButton,
-        ssr = _this$props5.ssr,
-        expandByPixel = _this$props5.expandByPixel;
+      var _this$props4 = this.props,
+        id = _this$props4.id,
+        alt = _this$props4.alt,
+        type = _this$props4.type,
+        collection = _this$props4.collection,
+        occurrenceKey = _this$props4.occurrenceKey,
+        cardDimensions = _this$props4.cardDimensions,
+        resizeMode = _this$props4.resizeMode,
+        rendererAppearance = _this$props4.rendererAppearance,
+        disableOverlay = _this$props4.disableOverlay,
+        useInlinePlayer = _this$props4.useInlinePlayer,
+        originalDimensions = _this$props4.originalDimensions,
+        forceOpenMediaViewer = _this$props4.shouldOpenMediaViewer,
+        featureFlags = _this$props4.featureFlags,
+        shouldEnableDownloadButton = _this$props4.shouldEnableDownloadButton,
+        ssr = _this$props4.ssr,
+        expandByPixel = _this$props4.expandByPixel;
       var isMobile = rendererAppearance === 'mobile';
       var shouldPlayInline = useInlinePlayer !== undefined ? useInlinePlayer : true;
       var isInlinePlayer = isMobile ? false : shouldPlayInline;

package/dist/cjs/ui/Renderer/index.js

@@ -55,7 +55,7 @@ exports.NORMAL_SEVERITY_THRESHOLD = NORMAL_SEVERITY_THRESHOLD;
 var DEGRADED_SEVERITY_THRESHOLD = 3000;
 exports.DEGRADED_SEVERITY_THRESHOLD = DEGRADED_SEVERITY_THRESHOLD;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "108.11.10";
+var packageVersion = "108.11.12";
 var Renderer = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/dist/es2019/react/nodes/mediaInline.js

@@ -26,7 +26,7 @@ export const RenderMediaInline = ({
     }
   };
   const updateFileState = useCallback(async (id, mediaClientConfig) => {
-    const mediaClient = getMediaClient(mediaClientConfig, featureFlags);
+    const mediaClient = getMediaClient(mediaClientConfig);
     const options = {
       collectionName
     };
@@ -36,7 +36,7 @@ export const RenderMediaInline = ({
     } catch (error) {
       // do not set state on error
     }
-  }, [collectionName, featureFlags]);
+  }, [collectionName]);
   useEffect(() => {
     const {
       id

package/dist/es2019/react/nodes/table/colgroup.js

@@ -55,22 +55,27 @@ const renderScaleDownColgroup = props => {
     tableNode,
     rendererAppearance
   } = props;
-  let tableContainerWidth;
   if (!columnWidths) {
     return [];
   }
-  const columnAmount = columnWidths.length;
+  let tableContainerWidth;
   const tableResized = isTableResized(columnWidths);
+  const noOfColumns = columnWidths.length;
   let targetWidths;
+  if (isTableResizingEnabled(rendererAppearance) && tableNode) {
+    tableContainerWidth = getTableContainerWidth(tableNode);
+  } else {
+    tableContainerWidth = getTableLayoutWidth(layout);
+  }
   if (isTableResizingEnabled(rendererAppearance) && !tableResized) {
     if (getBooleanFF('platform.editor.custom-table-width-scale-down-undefined-column_nkyvx')) {
-      // Code path executed when feature flag is on
-      const tableDefaultWidth = isNumberColumnEnabled ? akEditorDefaultLayoutWidth - akEditorTableNumberColumnWidth : akEditorDefaultLayoutWidth;
-      // take off 1 px for border incase column width wider than table width
-      const defaultColumnWidth = Math.floor((tableDefaultWidth - 1) / columnAmount);
-      targetWidths = new Array(columnAmount).fill(defaultColumnWidth);
+      // for tables with no column widths defined, assume that the real table width
+      // is defined by node.attrs.width
+      const tableWidth = isNumberColumnEnabled ? tableContainerWidth - akEditorTableNumberColumnWidth : tableContainerWidth;
+      const defaultColumnWidth = Math.floor(tableWidth / noOfColumns);
+      targetWidths = new Array(noOfColumns).fill(defaultColumnWidth);
     } else {
-      return new Array(columnAmount).fill({
+      return new Array(noOfColumns).fill({
         minWidth: `${tableCellMinWidth}px`
       });
     }
@@ -78,11 +83,6 @@ const renderScaleDownColgroup = props => {
     return null;
   }
   targetWidths = targetWidths || columnWidths;
-  if (isTableResizingEnabled(rendererAppearance) && tableNode) {
-    tableContainerWidth = getTableContainerWidth(tableNode);
-  } else {
-    tableContainerWidth = getTableLayoutWidth(layout);
-  }
 
   // @see ED-6056
   const maxTableWidth = renderWidth < tableContainerWidth ? renderWidth : tableContainerWidth;

package/dist/es2019/ui/MediaCard.js

@@ -38,10 +38,9 @@ export class MediaCardInternal extends Component {
     _defineProperty(this, "state", {});
     _defineProperty(this, "saveFileState", async (id, mediaClientConfig) => {
       const {
-        collection: collectionName,
-        featureFlags
+        collection: collectionName
       } = this.props;
-      const mediaClient = getMediaClient(mediaClientConfig, featureFlags);
+      const mediaClient = getMediaClient(mediaClientConfig);
       const options = {
         collectionName
       };

package/dist/es2019/ui/Renderer/index.js

@@ -35,7 +35,7 @@ import { RenderTracking } from '../../react/utils/performance/RenderTracking';
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "108.11.10";
+const packageVersion = "108.11.12";
 export class Renderer extends PureComponent {
   constructor(props) {
     super(props);

package/dist/esm/react/nodes/mediaInline.js

@@ -64,7 +64,7 @@ export var RenderMediaInline = function RenderMediaInline(_ref) {
       return _regeneratorRuntime.wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
-            mediaClient = getMediaClient(mediaClientConfig, featureFlags);
+            mediaClient = getMediaClient(mediaClientConfig);
             options = {
               collectionName: collectionName
             };
@@ -88,7 +88,7 @@ export var RenderMediaInline = function RenderMediaInline(_ref) {
     return function (_x2, _x3) {
       return _ref3.apply(this, arguments);
     };
-  }(), [collectionName, featureFlags]);
+  }(), [collectionName]);
   useEffect(function () {
     var id = identifier.id;
     var nodeIsInCache = id && mediaIdentifierMap.has(id);

package/dist/esm/react/nodes/table/colgroup.js

@@ -54,22 +54,27 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
     renderWidth = props.renderWidth,
     tableNode = props.tableNode,
     rendererAppearance = props.rendererAppearance;
-  var tableContainerWidth;
   if (!columnWidths) {
     return [];
   }
-  var columnAmount = columnWidths.length;
+  var tableContainerWidth;
   var tableResized = isTableResized(columnWidths);
+  var noOfColumns = columnWidths.length;
   var targetWidths;
+  if (isTableResizingEnabled(rendererAppearance) && tableNode) {
+    tableContainerWidth = getTableContainerWidth(tableNode);
+  } else {
+    tableContainerWidth = getTableLayoutWidth(layout);
+  }
   if (isTableResizingEnabled(rendererAppearance) && !tableResized) {
     if (getBooleanFF('platform.editor.custom-table-width-scale-down-undefined-column_nkyvx')) {
-      // Code path executed when feature flag is on
-      var tableDefaultWidth = isNumberColumnEnabled ? akEditorDefaultLayoutWidth - akEditorTableNumberColumnWidth : akEditorDefaultLayoutWidth;
-      // take off 1 px for border incase column width wider than table width
-      var defaultColumnWidth = Math.floor((tableDefaultWidth - 1) / columnAmount);
-      targetWidths = new Array(columnAmount).fill(defaultColumnWidth);
+      // for tables with no column widths defined, assume that the real table width
+      // is defined by node.attrs.width
+      var _tableWidth2 = isNumberColumnEnabled ? tableContainerWidth - akEditorTableNumberColumnWidth : tableContainerWidth;
+      var defaultColumnWidth = Math.floor(_tableWidth2 / noOfColumns);
+      targetWidths = new Array(noOfColumns).fill(defaultColumnWidth);
     } else {
-      return new Array(columnAmount).fill({
+      return new Array(noOfColumns).fill({
         minWidth: "".concat(tableCellMinWidth, "px")
       });
     }
@@ -77,11 +82,6 @@ var renderScaleDownColgroup = function renderScaleDownColgroup(props) {
     return null;
   }
   targetWidths = targetWidths || columnWidths;
-  if (isTableResizingEnabled(rendererAppearance) && tableNode) {
-    tableContainerWidth = getTableContainerWidth(tableNode);
-  } else {
-    tableContainerWidth = getTableLayoutWidth(layout);
-  }
 
   // @see ED-6056
   var maxTableWidth = renderWidth < tableContainerWidth ? renderWidth : tableContainerWidth;

package/dist/esm/ui/MediaCard.js

@@ -58,12 +58,12 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
     _defineProperty(_assertThisInitialized(_this), "state", {});
     _defineProperty(_assertThisInitialized(_this), "saveFileState", /*#__PURE__*/function () {
       var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(id, mediaClientConfig) {
-        var _this$props, collectionName, featureFlags, mediaClient, options, fileState;
+        var collectionName, mediaClient, options, fileState;
         return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
-              _this$props = _this.props, collectionName = _this$props.collection, featureFlags = _this$props.featureFlags;
-              mediaClient = getMediaClient(mediaClientConfig, featureFlags);
+              collectionName = _this.props.collection;
+              mediaClient = getMediaClient(mediaClientConfig);
               options = {
                 collectionName: collectionName
               };
@@ -121,11 +121,11 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
     key: "componentDidMount",
     value: function () {
       var _componentDidMount = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-        var _this$props2, rendererContext, mediaProvider, contextIdentifierProvider, id, url, collectionName, mediaProviderObject, mediaClientConfig, nodeIsInCache;
+        var _this$props, rendererContext, mediaProvider, contextIdentifierProvider, id, url, collectionName, mediaProviderObject, mediaClientConfig, nodeIsInCache;
         return _regeneratorRuntime.wrap(function _callee2$(_context2) {
           while (1) switch (_context2.prev = _context2.next) {
             case 0:
-              _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;
+              _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;
               if (mediaProvider) {
                 _context2.next = 3;
                 break;
@@ -192,9 +192,9 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
   }, {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
-      var _this$props3 = this.props,
-        id = _this$props3.id,
-        dataURI = _this$props3.url;
+      var _this$props2 = this.props,
+        id = _this$props2.id,
+        dataURI = _this$props2.url;
       if (id) {
         mediaIdentifierMap.delete(id);
       } else if (dataURI) {
@@ -205,18 +205,18 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
     key: "renderExternal",
     value: function renderExternal(shouldOpenMediaViewer) {
       var mediaClientConfig = this.state.mediaClientConfig;
-      var _this$props4 = this.props,
-        cardDimensions = _this$props4.cardDimensions,
-        resizeMode = _this$props4.resizeMode,
-        appearance = _this$props4.appearance,
-        url = _this$props4.url,
-        imageStatus = _this$props4.imageStatus,
-        disableOverlay = _this$props4.disableOverlay,
-        alt = _this$props4.alt,
-        featureFlags = _this$props4.featureFlags,
-        ssr = _this$props4.ssr,
-        rendererAppearance = _this$props4.rendererAppearance,
-        expandByPixel = _this$props4.expandByPixel;
+      var _this$props3 = this.props,
+        cardDimensions = _this$props3.cardDimensions,
+        resizeMode = _this$props3.resizeMode,
+        appearance = _this$props3.appearance,
+        url = _this$props3.url,
+        imageStatus = _this$props3.imageStatus,
+        disableOverlay = _this$props3.disableOverlay,
+        alt = _this$props3.alt,
+        featureFlags = _this$props3.featureFlags,
+        ssr = _this$props3.ssr,
+        rendererAppearance = _this$props3.rendererAppearance,
+        expandByPixel = _this$props3.expandByPixel;
       if (imageStatus === 'loading' || !url) {
         return this.renderLoadingCard();
       }
@@ -251,23 +251,23 @@ export var MediaCardInternal = /*#__PURE__*/function (_Component) {
         contextIdentifierProvider = _this$state.contextIdentifierProvider,
         mediaClientConfigInState = _this$state.mediaClientConfig,
         fileState = _this$state.fileState;
-      var _this$props5 = this.props,
-        id = _this$props5.id,
-        alt = _this$props5.alt,
-        type = _this$props5.type,
-        collection = _this$props5.collection,
-        occurrenceKey = _this$props5.occurrenceKey,
-        cardDimensions = _this$props5.cardDimensions,
-        resizeMode = _this$props5.resizeMode,
-        rendererAppearance = _this$props5.rendererAppearance,
-        disableOverlay = _this$props5.disableOverlay,
-        useInlinePlayer = _this$props5.useInlinePlayer,
-        originalDimensions = _this$props5.originalDimensions,
-        forceOpenMediaViewer = _this$props5.shouldOpenMediaViewer,
-        featureFlags = _this$props5.featureFlags,
-        shouldEnableDownloadButton = _this$props5.shouldEnableDownloadButton,
-        ssr = _this$props5.ssr,
-        expandByPixel = _this$props5.expandByPixel;
+      var _this$props4 = this.props,
+        id = _this$props4.id,
+        alt = _this$props4.alt,
+        type = _this$props4.type,
+        collection = _this$props4.collection,
+        occurrenceKey = _this$props4.occurrenceKey,
+        cardDimensions = _this$props4.cardDimensions,
+        resizeMode = _this$props4.resizeMode,
+        rendererAppearance = _this$props4.rendererAppearance,
+        disableOverlay = _this$props4.disableOverlay,
+        useInlinePlayer = _this$props4.useInlinePlayer,
+        originalDimensions = _this$props4.originalDimensions,
+        forceOpenMediaViewer = _this$props4.shouldOpenMediaViewer,
+        featureFlags = _this$props4.featureFlags,
+        shouldEnableDownloadButton = _this$props4.shouldEnableDownloadButton,
+        ssr = _this$props4.ssr,
+        expandByPixel = _this$props4.expandByPixel;
       var isMobile = rendererAppearance === 'mobile';
       var shouldPlayInline = useInlinePlayer !== undefined ? useInlinePlayer : true;
       var isInlinePlayer = isMobile ? false : shouldPlayInline;

package/dist/esm/ui/Renderer/index.js

@@ -45,7 +45,7 @@ import { RenderTracking } from '../../react/utils/performance/RenderTracking';
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "108.11.10";
+var packageVersion = "108.11.12";
 export var Renderer = /*#__PURE__*/function (_PureComponent) {
   _inherits(Renderer, _PureComponent);
   var _super = _createSuper(Renderer);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/renderer",
-  "version": "108.11.10",
+  "version": "108.11.12",
   "description": "Renderer component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -31,7 +31,7 @@
     "@atlaskit/analytics-next": "^9.1.0",
     "@atlaskit/button": "^16.9.0",
     "@atlaskit/code": "^14.6.0",
-    "@atlaskit/editor-common": "^74.55.0",
+    "@atlaskit/editor-common": "^74.56.0",
     "@atlaskit/editor-json-transformer": "^8.10.0",
     "@atlaskit/editor-palette": "1.5.1",
     "@atlaskit/editor-prosemirror": "1.1.0",
@@ -39,18 +39,18 @@
     "@atlaskit/emoji": "^67.4.0",
     "@atlaskit/icon": "^21.12.0",
     "@atlaskit/link-datasource": "^1.0.0",
-    "@atlaskit/media-card": "^76.1.0",
-    "@atlaskit/media-client": "^23.1.0",
-    "@atlaskit/media-common": "^8.1.0",
+    "@atlaskit/media-card": "^76.2.0",
+    "@atlaskit/media-client": "^24.0.0",
+    "@atlaskit/media-common": "^9.0.0",
     "@atlaskit/media-filmstrip": "^47.0.0",
     "@atlaskit/media-ui": "^24.0.0",
     "@atlaskit/media-viewer": "^48.0.0",
     "@atlaskit/platform-feature-flags": "^0.2.0",
-    "@atlaskit/smart-card": "^26.19.0",
+    "@atlaskit/smart-card": "^26.20.0",
     "@atlaskit/status": "^1.3.0",
     "@atlaskit/task-decision": "^17.7.0",
-    "@atlaskit/theme": "^12.5.0",
-    "@atlaskit/tokens": "^1.18.0",
+    "@atlaskit/theme": "^12.6.0",
+    "@atlaskit/tokens": "^1.20.0",
     "@atlaskit/tooltip": "^17.8.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",