@atlaskit/renderer 124.12.1 → 124.13.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/renderer
 
+## 124.13.0
+
+### Minor Changes
+
+- [`7ecc830bdd14e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7ecc830bdd14e) -
+  Updated media group resizing mode from stretchy fit to crop to match editor and enabling removing
+  of late mutation caused by dependancy of stretchy-fit on image rendered dimensions
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 124.12.1
 
 ### Patch Changes

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

@@ -16,6 +16,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _react = _interopRequireWildcard(require("react"));
 var _mediaCard = require("@atlaskit/media-card");
 var _mediaFilmstrip = require("@atlaskit/media-filmstrip");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _vcMedia = require("@atlaskit/react-ufo/vc-media");
 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); }
 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; }
@@ -98,7 +99,9 @@ var MediaGroup = exports.default = /*#__PURE__*/function (_PureComponent) {
     key: "renderSingleFile",
     value: function renderSingleFile(child) {
       return /*#__PURE__*/_react.default.cloneElement(child, {
-        resizeMode: 'stretchy-fit',
+        // the media group component renders in crop mode in editor thus this enables consistency
+        // also crop is much easier to make consistent across SSR and hydration
+        resizeMode: (0, _platformFeatureFlags.fg)('media-perf-uplift-mutation-fix') ? 'crop' : 'stretchy-fit',
         cardDimensions: _mediaCard.defaultImageCardDimensions,
         useInlinePlayer: false,
         featureFlags: this.props.featureFlags,

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

@@ -69,7 +69,7 @@ var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 // we want to calculate all the table widths (which causes reflows) after the renderer has finished loading to mitigate performance impact
 var TABLE_INFO_TIMEOUT = 10000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "124.12.0";
+var packageVersion = "124.12.1";
 var setAsQueryContainerStyles = (0, _react2.css)({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

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

@@ -3,6 +3,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React, { PureComponent } from 'react';
 import { defaultImageCardDimensions } from '@atlaskit/media-card';
 import { FilmstripView } from '@atlaskit/media-filmstrip';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { VcMediaWrapperProps } from '@atlaskit/react-ufo/vc-media';
 // Ignored via go/ees005
 // eslint-disable-next-line @repo/internal/react/no-class-components
@@ -64,7 +65,9 @@ export default class MediaGroup extends PureComponent {
   }
   renderSingleFile(child) {
     return /*#__PURE__*/React.cloneElement(child, {
-      resizeMode: 'stretchy-fit',
+      // the media group component renders in crop mode in editor thus this enables consistency
+      // also crop is much easier to make consistent across SSR and hydration
+      resizeMode: fg('media-perf-uplift-mutation-fix') ? 'crop' : 'stretchy-fit',
       cardDimensions: defaultImageCardDimensions,
       useInlinePlayer: false,
       featureFlags: this.props.featureFlags,

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

@@ -55,7 +55,7 @@ export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 // we want to calculate all the table widths (which causes reflows) after the renderer has finished loading to mitigate performance impact
 const TABLE_INFO_TIMEOUT = 10000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "124.12.0";
+const packageVersion = "124.12.1";
 const setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

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

@@ -12,6 +12,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 import React, { PureComponent } from 'react';
 import { defaultImageCardDimensions } from '@atlaskit/media-card';
 import { FilmstripView } from '@atlaskit/media-filmstrip';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { VcMediaWrapperProps } from '@atlaskit/react-ufo/vc-media';
 // Ignored via go/ees005
 // eslint-disable-next-line @repo/internal/react/no-class-components
@@ -89,7 +90,9 @@ var MediaGroup = /*#__PURE__*/function (_PureComponent) {
     key: "renderSingleFile",
     value: function renderSingleFile(child) {
       return /*#__PURE__*/React.cloneElement(child, {
-        resizeMode: 'stretchy-fit',
+        // the media group component renders in crop mode in editor thus this enables consistency
+        // also crop is much easier to make consistent across SSR and hydration
+        resizeMode: fg('media-perf-uplift-mutation-fix') ? 'crop' : 'stretchy-fit',
         cardDimensions: defaultImageCardDimensions,
         useInlinePlayer: false,
         featureFlags: this.props.featureFlags,

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

@@ -60,7 +60,7 @@ export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 // we want to calculate all the table widths (which causes reflows) after the renderer has finished loading to mitigate performance impact
 var TABLE_INFO_TIMEOUT = 10000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "124.12.0";
+var packageVersion = "124.12.1";
 var setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "124.12.1",
+	"version": "124.13.0",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -44,7 +44,7 @@
 		"@atlaskit/link-datasource": "^4.29.0",
 		"@atlaskit/link-extractors": "^2.4.0",
 		"@atlaskit/linking-common": "^9.8.0",
-		"@atlaskit/media-card": "^79.6.0",
+		"@atlaskit/media-card": "^79.7.0",
 		"@atlaskit/media-client": "^35.6.0",
 		"@atlaskit/media-client-react": "^4.1.0",
 		"@atlaskit/media-common": "^12.3.0",
@@ -58,7 +58,7 @@
 		"@atlaskit/status": "^3.0.0",
 		"@atlaskit/task-decision": "^19.2.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^13.35.0",
+		"@atlaskit/tmp-editor-statsig": "^13.36.0",
 		"@atlaskit/tokens": "^8.0.0",
 		"@atlaskit/tooltip": "^20.8.0",
 		"@atlaskit/visually-hidden": "^3.0.0",