@atlaskit/editor-plugin-media 1.30.0 → 1.31.1

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/editor-plugin-media
 
+## 1.31.1
+
+### Patch Changes
+
+- [#139034](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/139034)
+  [`517cdc0f7ea1a`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/517cdc0f7ea1a) -
+  Used experiment for lazy node view
+
+## 1.31.0
+
+### Minor Changes
+
+- [#138140](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/138140)
+  [`d912a8053c5f9`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/d912a8053c5f9) -
+  [ED-24869] ensure images inserted from outside media plugin are given pixel widthType
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 1.30.0
 
 ### Minor Changes

package/dist/cjs/nodeviews/lazy-media-group.js

@@ -7,14 +7,14 @@ Object.defineProperty(exports, "__esModule", {
 exports.lazyMediaGroupView = void 0;
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _mediaGroup = require("./mediaGroup");
 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); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != (0, _typeof2.default)(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; }
 var lazyMediaGroupView = exports.lazyMediaGroupView = function lazyMediaGroupView(portalProviderAPI, eventDispatcher, providerFactory) {
   var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
   var api = arguments.length > 4 ? arguments[4] : undefined;
-  if (!(0, _platformFeatureFlags.fg)('platform_editor_lazy-node-views')) {
+  if ((0, _experiments.editorExperiment)('platform_editor_exp_lazy_node_views', false)) {
     return (0, _mediaGroup.ReactMediaGroupNode)(portalProviderAPI, eventDispatcher, providerFactory, options, api);
   }
   return (0, _lazyNodeView.withLazyLoading)({

package/dist/cjs/nodeviews/lazy-media-inline.js

@@ -7,12 +7,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.lazyMediaInlineView = void 0;
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _mediaInline = require("./mediaInline");
 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); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != (0, _typeof2.default)(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; }
 var lazyMediaInlineView = exports.lazyMediaInlineView = function lazyMediaInlineView(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent) {
-  if (!(0, _platformFeatureFlags.fg)('platform_editor_lazy-node-views')) {
+  if ((0, _experiments.editorExperiment)('platform_editor_exp_lazy_node_views', false)) {
     return (0, _mediaInline.ReactMediaInlineNode)(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent);
   }
   return (0, _lazyNodeView.withLazyLoading)({

package/dist/cjs/nodeviews/lazy-media-single.js

@@ -7,13 +7,13 @@ Object.defineProperty(exports, "__esModule", {
 exports.lazyMediaSingleView = void 0;
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _mediaSingle = require("./mediaSingle");
 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); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != (0, _typeof2.default)(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; }
 var lazyMediaSingleView = exports.lazyMediaSingleView = function lazyMediaSingleView(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent) {
   var options = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : {};
-  if (!(0, _platformFeatureFlags.fg)('platform_editor_lazy-node-views')) {
+  if ((0, _experiments.editorExperiment)('platform_editor_exp_lazy_node_views', false)) {
     return (0, _mediaSingle.ReactMediaSingleNode)(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent, options);
   }
   return (0, _lazyNodeView.withLazyLoading)({

package/dist/cjs/nodeviews/lazy-media.js

@@ -7,14 +7,14 @@ Object.defineProperty(exports, "__esModule", {
 exports.lazyMediaView = void 0;
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _lazyNodeView = require("@atlaskit/editor-common/lazy-node-view");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _mediaNodeView = require("./mediaNodeView");
 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); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != (0, _typeof2.default)(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; }
 var lazyMediaView = exports.lazyMediaView = function lazyMediaView(portalProviderAPI, eventDispatcher, providerFactory) {
   var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
   var api = arguments.length > 4 ? arguments[4] : undefined;
-  if (!(0, _platformFeatureFlags.fg)('platform_editor_lazy-node-views')) {
+  if ((0, _experiments.editorExperiment)('platform_editor_exp_lazy_node_views', false)) {
     return (0, _mediaNodeView.ReactMediaNode)(portalProviderAPI, eventDispatcher, providerFactory, options, api);
   }
   return (0, _lazyNodeView.withLazyLoading)({

package/dist/cjs/toDOM-fixes/media.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.mediaSpecWithFixedToDOM = exports.defaultImageCardDimensions = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _adfSchema = require("@atlaskit/adf-schema");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _toDOMAttrs = require("./toDOMAttrs");
 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; }
 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; }
@@ -31,7 +31,7 @@ var defaultImageCardDimensions = exports.defaultImageCardDimensions = {
 
 // @nodeSpecException:toDOM patch
 var mediaSpecWithFixedToDOM = exports.mediaSpecWithFixedToDOM = function mediaSpecWithFixedToDOM() {
-  if (!(0, _platformFeatureFlags.fg)('platform_editor_lazy-node-views')) {
+  if ((0, _experiments.editorExperiment)('platform_editor_exp_lazy_node_views', false)) {
     return _adfSchema.media;
   }
   return _objectSpread(_objectSpread({}, _adfSchema.media), {}, {

package/dist/cjs/toDOM-fixes/mediaGroup.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.mediaGroupSpecWithFixedToDOM = exports.getDefaultCardDimensions = exports.defaultSquareCardDimensions = exports.defaultImageCardDimensions = exports.defaultHorizontalCardDimensions = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _adfSchema = require("@atlaskit/adf-schema");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 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; }
 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; }
 /**
@@ -61,7 +61,7 @@ var getDefaultCardDimensions = exports.getDefaultCardDimensions = function getDe
 
 // @nodeSpecException:toDOM patch
 var mediaGroupSpecWithFixedToDOM = exports.mediaGroupSpecWithFixedToDOM = function mediaGroupSpecWithFixedToDOM() {
-  if (!(0, _platformFeatureFlags.fg)('platform_editor_lazy-node-views')) {
+  if ((0, _experiments.editorExperiment)('platform_editor_exp_lazy_node_views', false)) {
     return _adfSchema.mediaGroup;
   }
   return _objectSpread(_objectSpread({}, _adfSchema.mediaGroup), {}, {

package/dist/cjs/toDOM-fixes/mediaInline.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.mediaInlineSpecWithFixedToDOM = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _adfSchema = require("@atlaskit/adf-schema");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _toDOMAttrs = require("./toDOMAttrs");
 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; }
 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; }
@@ -17,7 +17,7 @@ var fallbackAspectRatio = 1.25;
 
 // @nodeSpecException:toDOM patch
 var mediaInlineSpecWithFixedToDOM = exports.mediaInlineSpecWithFixedToDOM = function mediaInlineSpecWithFixedToDOM() {
-  if (!(0, _platformFeatureFlags.fg)('platform_editor_lazy-node-views')) {
+  if ((0, _experiments.editorExperiment)('platform_editor_exp_lazy_node_views', false)) {
     return _adfSchema.mediaInline;
   }
   return _objectSpread(_objectSpread({}, _adfSchema.mediaInline), {}, {

package/dist/cjs/toDOM-fixes/mediaSingle.js

@@ -8,7 +8,7 @@ exports.getMediaSinglePixelWidth = getMediaSinglePixelWidth;
 exports.wrappedLayouts = exports.shouldAddDefaultWrappedWidth = exports.mediaSingleSpecWithFixedToDOM = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _adfSchema = require("@atlaskit/adf-schema");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _toDOMAttrs = require("./toDOMAttrs");
 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; }
 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; }
@@ -120,7 +120,7 @@ function computeLayoutStyles(width, layout) {
 // @nodeSpecException:toDOM patch
 var mediaSingleSpecWithFixedToDOM = exports.mediaSingleSpecWithFixedToDOM = function mediaSingleSpecWithFixedToDOM(mediaSingleOption) {
   var mediaSingleNode = (0, _adfSchema.mediaSingleSpec)(mediaSingleOption);
-  if (!(0, _platformFeatureFlags.fg)('platform_editor_lazy-node-views')) {
+  if ((0, _experiments.editorExperiment)('platform_editor_exp_lazy_node_views', false)) {
     return mediaSingleNode;
   }
   return _objectSpread(_objectSpread({}, mediaSingleNode), {}, {

package/dist/cjs/utils/media-single.js

@@ -79,6 +79,7 @@ var isMediaSingle = exports.isMediaSingle = function isMediaSingle(schema, fileM
   return !!schema.nodes.mediaSingle && (0, _isType.isImage)(fileMimeType);
 };
 var insertMediaAsMediaSingle = exports.insertMediaAsMediaSingle = function insertMediaAsMediaSingle(view, node, inputMethod, editorAnalyticsAPI) {
+  var _node$attrs$width;
   var state = view.state,
     dispatch = view.dispatch;
   var _state$schema$nodes = state.schema.nodes,
@@ -92,7 +93,14 @@ var insertMediaAsMediaSingle = exports.insertMediaAsMediaSingle = function inser
   if (node.type !== media || !(0, _isType.isImage)(node.attrs.__fileMimeType) && node.attrs.type !== 'external') {
     return false;
   }
-  var mediaSingleNode = mediaSingle.create({}, node);
+  var resizeExperience = (0, _platformFeatureFlags.fg)('platform.editor.media.extended-resize-experience');
+  var insertMediaPopup = (0, _platformFeatureFlags.fg)('platform_editor_insert_media_plugin_phase_one');
+  var mediaSingleAttrs = resizeExperience && insertMediaPopup ? {
+    widthType: 'pixel',
+    width: (0, _mediaSingle.getMediaSingleInitialWidth)((_node$attrs$width = node.attrs.width) !== null && _node$attrs$width !== void 0 ? _node$attrs$width : _mediaSingle.DEFAULT_IMAGE_WIDTH),
+    layout: 'center'
+  } : {};
+  var mediaSingleNode = mediaSingle.create(mediaSingleAttrs, node);
   var nodes = [mediaSingleNode];
   var analyticsAttributes = {
     inputMethod: inputMethod,

package/dist/es2019/nodeviews/lazy-media-group.js

@@ -1,8 +1,8 @@
 import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ReactMediaGroupNode } from './mediaGroup';
 export const lazyMediaGroupView = (portalProviderAPI, eventDispatcher, providerFactory, options = {}, api) => {
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return ReactMediaGroupNode(portalProviderAPI, eventDispatcher, providerFactory, options, api);
   }
   return withLazyLoading({

package/dist/es2019/nodeviews/lazy-media-inline.js

@@ -1,8 +1,8 @@
 import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ReactMediaInlineNode } from './mediaInline';
 export const lazyMediaInlineView = (portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent) => {
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return ReactMediaInlineNode(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent);
   }
   return withLazyLoading({

package/dist/es2019/nodeviews/lazy-media-single.js

@@ -1,8 +1,8 @@
 import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ReactMediaSingleNode } from './mediaSingle';
 export const lazyMediaSingleView = (portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent, options = {}) => {
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return ReactMediaSingleNode(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent, options);
   }
   return withLazyLoading({

package/dist/es2019/nodeviews/lazy-media.js

@@ -1,8 +1,8 @@
 import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ReactMediaNode } from './mediaNodeView';
 export const lazyMediaView = (portalProviderAPI, eventDispatcher, providerFactory, options = {}, api) => {
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return ReactMediaNode(portalProviderAPI, eventDispatcher, providerFactory, options, api);
   }
   return withLazyLoading({

package/dist/es2019/toDOM-fixes/media.js

@@ -1,5 +1,5 @@
 import { media } from '@atlaskit/adf-schema';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { getMediaAttrs } from './toDOMAttrs';
 const skeletonStyling = `background: ${"var(--ds-background-neutral, #091E420F)"}; outline: none;`;
 
@@ -21,7 +21,7 @@ export const defaultImageCardDimensions = {
 
 // @nodeSpecException:toDOM patch
 export const mediaSpecWithFixedToDOM = () => {
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return media;
   }
   return {

package/dist/es2019/toDOM-fixes/mediaGroup.js

@@ -1,5 +1,5 @@
 import { mediaGroup } from '@atlaskit/adf-schema';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 
 /**
  * Duplicate consts from `media-card`.
@@ -51,7 +51,7 @@ export const getDefaultCardDimensions = (appearance = 'auto') => {
 
 // @nodeSpecException:toDOM patch
 export const mediaGroupSpecWithFixedToDOM = () => {
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return mediaGroup;
   }
   return {

package/dist/es2019/toDOM-fixes/mediaInline.js

@@ -1,5 +1,5 @@
 import { mediaInline } from '@atlaskit/adf-schema';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { getMediaAttrs } from './toDOMAttrs';
 const skeletonStyling = `background: ${"var(--ds-background-neutral, #091E420F)"};`;
 // Matches media
@@ -7,7 +7,7 @@ const fallbackAspectRatio = 1.25;
 
 // @nodeSpecException:toDOM patch
 export const mediaInlineSpecWithFixedToDOM = () => {
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return mediaInline;
   }
   return {

package/dist/es2019/toDOM-fixes/mediaSingle.js

@@ -1,5 +1,5 @@
 import { mediaSingleSpec } from '@atlaskit/adf-schema';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { getAttrsFromNodeMediaSingle } from './toDOMAttrs';
 const skeletonStyling = `background: ${"var(--ds-background-neutral, #091E420F)"}; outline: none;`;
 export const wrappedLayouts = ['wrap-left', 'wrap-right', 'align-end', 'align-start'];
@@ -108,7 +108,7 @@ function computeLayoutStyles(width, layout) {
 // @nodeSpecException:toDOM patch
 export const mediaSingleSpecWithFixedToDOM = mediaSingleOption => {
   const mediaSingleNode = mediaSingleSpec(mediaSingleOption);
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return mediaSingleNode;
   }
   return {

package/dist/es2019/utils/media-single.js

@@ -1,7 +1,7 @@
 import memoizeOne from 'memoize-one';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { safeInsert, shouldSplitSelectedNodeOnNodeInsertion } from '@atlaskit/editor-common/insert';
-import { getMaxWidthForNestedNodeNext, getMediaSingleInitialWidth, MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH, MEDIA_SINGLE_VIDEO_MIN_PIXEL_WIDTH } from '@atlaskit/editor-common/media-single';
+import { DEFAULT_IMAGE_WIDTH, getMaxWidthForNestedNodeNext, getMediaSingleInitialWidth, MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH, MEDIA_SINGLE_VIDEO_MIN_PIXEL_WIDTH } from '@atlaskit/editor-common/media-single';
 import { atTheBeginningOfBlock } from '@atlaskit/editor-common/selection';
 import { checkNodeDown, isEmptyParagraph } from '@atlaskit/editor-common/utils';
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
@@ -67,6 +67,7 @@ function insertNodesWithOptionalParagraph(nodes, analyticsAttributes = {}, edito
 }
 export const isMediaSingle = (schema, fileMimeType) => !!schema.nodes.mediaSingle && isImage(fileMimeType);
 export const insertMediaAsMediaSingle = (view, node, inputMethod, editorAnalyticsAPI) => {
+  var _node$attrs$width;
   const {
     state,
     dispatch
@@ -83,7 +84,14 @@ export const insertMediaAsMediaSingle = (view, node, inputMethod, editorAnalytic
   if (node.type !== media || !isImage(node.attrs.__fileMimeType) && node.attrs.type !== 'external') {
     return false;
   }
-  const mediaSingleNode = mediaSingle.create({}, node);
+  const resizeExperience = fg('platform.editor.media.extended-resize-experience');
+  const insertMediaPopup = fg('platform_editor_insert_media_plugin_phase_one');
+  const mediaSingleAttrs = resizeExperience && insertMediaPopup ? {
+    widthType: 'pixel',
+    width: getMediaSingleInitialWidth((_node$attrs$width = node.attrs.width) !== null && _node$attrs$width !== void 0 ? _node$attrs$width : DEFAULT_IMAGE_WIDTH),
+    layout: 'center'
+  } : {};
+  const mediaSingleNode = mediaSingle.create(mediaSingleAttrs, node);
   const nodes = [mediaSingleNode];
   const analyticsAttributes = {
     inputMethod,

package/dist/esm/nodeviews/lazy-media-group.js

@@ -1,10 +1,10 @@
 import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ReactMediaGroupNode } from './mediaGroup';
 export var lazyMediaGroupView = function lazyMediaGroupView(portalProviderAPI, eventDispatcher, providerFactory) {
   var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
   var api = arguments.length > 4 ? arguments[4] : undefined;
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return ReactMediaGroupNode(portalProviderAPI, eventDispatcher, providerFactory, options, api);
   }
   return withLazyLoading({

package/dist/esm/nodeviews/lazy-media-inline.js

@@ -1,8 +1,8 @@
 import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ReactMediaInlineNode } from './mediaInline';
 export var lazyMediaInlineView = function lazyMediaInlineView(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent) {
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return ReactMediaInlineNode(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent);
   }
   return withLazyLoading({

package/dist/esm/nodeviews/lazy-media-single.js

@@ -1,9 +1,9 @@
 import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ReactMediaSingleNode } from './mediaSingle';
 export var lazyMediaSingleView = function lazyMediaSingleView(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent) {
   var options = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : {};
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return ReactMediaSingleNode(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent, options);
   }
   return withLazyLoading({

package/dist/esm/nodeviews/lazy-media.js

@@ -1,10 +1,10 @@
 import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ReactMediaNode } from './mediaNodeView';
 export var lazyMediaView = function lazyMediaView(portalProviderAPI, eventDispatcher, providerFactory) {
   var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
   var api = arguments.length > 4 ? arguments[4] : undefined;
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return ReactMediaNode(portalProviderAPI, eventDispatcher, providerFactory, options, api);
   }
   return withLazyLoading({

package/dist/esm/toDOM-fixes/media.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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; }
 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) { _defineProperty(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; }
 import { media } from '@atlaskit/adf-schema';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { getMediaAttrs } from './toDOMAttrs';
 var skeletonStyling = "background: ".concat("var(--ds-background-neutral, #091E420F)", "; outline: none;");
 
@@ -24,7 +24,7 @@ export var defaultImageCardDimensions = {
 
 // @nodeSpecException:toDOM patch
 export var mediaSpecWithFixedToDOM = function mediaSpecWithFixedToDOM() {
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return media;
   }
   return _objectSpread(_objectSpread({}, media), {}, {

package/dist/esm/toDOM-fixes/mediaGroup.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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; }
 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) { _defineProperty(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; }
 import { mediaGroup } from '@atlaskit/adf-schema';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 
 /**
  * Duplicate consts from `media-card`.
@@ -55,7 +55,7 @@ export var getDefaultCardDimensions = function getDefaultCardDimensions() {
 
 // @nodeSpecException:toDOM patch
 export var mediaGroupSpecWithFixedToDOM = function mediaGroupSpecWithFixedToDOM() {
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return mediaGroup;
   }
   return _objectSpread(_objectSpread({}, mediaGroup), {}, {

package/dist/esm/toDOM-fixes/mediaInline.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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; }
 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) { _defineProperty(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; }
 import { mediaInline } from '@atlaskit/adf-schema';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { getMediaAttrs } from './toDOMAttrs';
 var skeletonStyling = "background: ".concat("var(--ds-background-neutral, #091E420F)", ";");
 // Matches media
@@ -10,7 +10,7 @@ var fallbackAspectRatio = 1.25;
 
 // @nodeSpecException:toDOM patch
 export var mediaInlineSpecWithFixedToDOM = function mediaInlineSpecWithFixedToDOM() {
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return mediaInline;
   }
   return _objectSpread(_objectSpread({}, mediaInline), {}, {

package/dist/esm/toDOM-fixes/mediaSingle.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 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; }
 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) { _defineProperty(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; }
 import { mediaSingleSpec } from '@atlaskit/adf-schema';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { getAttrsFromNodeMediaSingle } from './toDOMAttrs';
 var skeletonStyling = "background: ".concat("var(--ds-background-neutral, #091E420F)", "; outline: none;");
 export var wrappedLayouts = ['wrap-left', 'wrap-right', 'align-end', 'align-start'];
@@ -112,7 +112,7 @@ function computeLayoutStyles(width, layout) {
 // @nodeSpecException:toDOM patch
 export var mediaSingleSpecWithFixedToDOM = function mediaSingleSpecWithFixedToDOM(mediaSingleOption) {
   var mediaSingleNode = mediaSingleSpec(mediaSingleOption);
-  if (!fg('platform_editor_lazy-node-views')) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return mediaSingleNode;
   }
   return _objectSpread(_objectSpread({}, mediaSingleNode), {}, {

package/dist/esm/utils/media-single.js

@@ -4,7 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import memoizeOne from 'memoize-one';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { safeInsert, shouldSplitSelectedNodeOnNodeInsertion } from '@atlaskit/editor-common/insert';
-import { getMaxWidthForNestedNodeNext, getMediaSingleInitialWidth, MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH, MEDIA_SINGLE_VIDEO_MIN_PIXEL_WIDTH } from '@atlaskit/editor-common/media-single';
+import { DEFAULT_IMAGE_WIDTH, getMaxWidthForNestedNodeNext, getMediaSingleInitialWidth, MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH, MEDIA_SINGLE_VIDEO_MIN_PIXEL_WIDTH } from '@atlaskit/editor-common/media-single';
 import { atTheBeginningOfBlock } from '@atlaskit/editor-common/selection';
 import { checkNodeDown, isEmptyParagraph } from '@atlaskit/editor-common/utils';
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
@@ -72,6 +72,7 @@ export var isMediaSingle = function isMediaSingle(schema, fileMimeType) {
   return !!schema.nodes.mediaSingle && isImage(fileMimeType);
 };
 export var insertMediaAsMediaSingle = function insertMediaAsMediaSingle(view, node, inputMethod, editorAnalyticsAPI) {
+  var _node$attrs$width;
   var state = view.state,
     dispatch = view.dispatch;
   var _state$schema$nodes = state.schema.nodes,
@@ -85,7 +86,14 @@ export var insertMediaAsMediaSingle = function insertMediaAsMediaSingle(view, no
   if (node.type !== media || !isImage(node.attrs.__fileMimeType) && node.attrs.type !== 'external') {
     return false;
   }
-  var mediaSingleNode = mediaSingle.create({}, node);
+  var resizeExperience = fg('platform.editor.media.extended-resize-experience');
+  var insertMediaPopup = fg('platform_editor_insert_media_plugin_phase_one');
+  var mediaSingleAttrs = resizeExperience && insertMediaPopup ? {
+    widthType: 'pixel',
+    width: getMediaSingleInitialWidth((_node$attrs$width = node.attrs.width) !== null && _node$attrs$width !== void 0 ? _node$attrs$width : DEFAULT_IMAGE_WIDTH),
+    layout: 'center'
+  } : {};
+  var mediaSingleNode = mediaSingle.create(mediaSingleAttrs, node);
   var nodes = [mediaSingleNode];
   var analyticsAttributes = {
     inputMethod: inputMethod,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-media",
-	"version": "1.30.0",
+	"version": "1.31.1",
 	"description": "Media plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -36,7 +36,7 @@
 		"@atlaskit/analytics-namespaced-context": "^6.12.0",
 		"@atlaskit/analytics-next": "^10.1.0",
 		"@atlaskit/button": "^20.1.0",
-		"@atlaskit/editor-common": "^88.12.0",
+		"@atlaskit/editor-common": "^88.13.0",
 		"@atlaskit/editor-palette": "1.6.0",
 		"@atlaskit/editor-plugin-analytics": "^1.8.0",
 		"@atlaskit/editor-plugin-annotation": "1.19.4",
@@ -66,6 +66,7 @@
 		"@atlaskit/primitives": "^12.1.0",
 		"@atlaskit/textfield": "^6.5.0",
 		"@atlaskit/theme": "^13.0.0",
+		"@atlaskit/tmp-editor-statsig": "^2.1.8",
 		"@atlaskit/tokens": "^1.59.0",
 		"@atlaskit/tooltip": "^18.7.0",
 		"@babel/runtime": "^7.0.0",
@@ -143,9 +144,6 @@
 		"platform-editor-a11y-image-border-options-dropdown": {
 			"type": "boolean"
 		},
-		"platform_editor_lazy-node-views": {
-			"type": "boolean"
-		},
 		"platform_editor_insert_media_plugin_phase_one": {
 			"type": "boolean"
 		},