@atlaskit/editor-plugin-media 1.42.18 → 1.43.1

package/dist/cjs/pm-plugins/alt-text/ui/AltTextEdit.js

@@ -7,10 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.MAX_ALT_TEXT_LENGTH = exports.CONTAINER_WIDTH_IN_PX = exports.AltTextEditComponent = void 0;
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
@@ -25,7 +24,7 @@ var _chevronLeftLarge = _interopRequireDefault(require("@atlaskit/icon/glyph/che
 var _crossCircle = _interopRequireDefault(require("@atlaskit/icon/glyph/cross-circle"));
 var _colors = require("@atlaskit/theme/colors");
 var _commands = require("../commands");
-function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -74,18 +73,16 @@ var clearTextStyles = (0, _react2.css)({
 });
 // eslint-disable-next-line @repo/internal/react/no-class-components
 var AltTextEditComponent = exports.AltTextEditComponent = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(AltTextEditComponent, _React$Component);
-  var _super = _createSuper(AltTextEditComponent);
   function AltTextEditComponent(props) {
     var _this;
     (0, _classCallCheck2.default)(this, AltTextEditComponent);
-    _this = _super.call(this, props);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
+    _this = _callSuper(this, AltTextEditComponent, [props]);
+    (0, _defineProperty2.default)(_this, "state", {
       showClearTextButton: Boolean(_this.props.value),
       validationErrors: _this.props.value ? _this.getValidationErrors(_this.props.value) : [],
       lastValue: _this.props.value
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "closeMediaAltTextMenu", function () {
+    (0, _defineProperty2.default)(_this, "closeMediaAltTextMenu", function () {
       var view = _this.props.view;
       if (_this.state.validationErrors.length === 0) {
         (0, _commands.closeMediaAltTextMenuAndSave)(_this.state.lastValue || '')(view.state, view.dispatch);
@@ -93,7 +90,7 @@ var AltTextEditComponent = exports.AltTextEditComponent = /*#__PURE__*/function
         (0, _commands.closeMediaAltTextMenu)(view.state, view.dispatch);
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "dispatchCancelEvent", function (event) {
+    (0, _defineProperty2.default)(_this, "dispatchCancelEvent", function (event) {
       var _this$props = _this.props,
         view = _this$props.view,
         onEscape = _this$props.onEscape;
@@ -106,7 +103,7 @@ var AltTextEditComponent = exports.AltTextEditComponent = /*#__PURE__*/function
       });
       onEscape === null || onEscape === void 0 || onEscape();
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleOnChange", function (newAltText) {
+    (0, _defineProperty2.default)(_this, "handleOnChange", function (newAltText) {
       var _this$state;
       var validationErrors = _this.getValidationErrors(newAltText);
       if (((_this$state = _this.state) === null || _this$state === void 0 || (_this$state = _this$state.validationErrors) === null || _this$state === void 0 ? void 0 : _this$state.length) !== (validationErrors === null || validationErrors === void 0 ? void 0 : validationErrors.length)) {
@@ -125,12 +122,12 @@ var AltTextEditComponent = exports.AltTextEditComponent = /*#__PURE__*/function
         lastValue: newAltText
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleOnBlur", function (e) {
+    (0, _defineProperty2.default)(_this, "handleOnBlur", function (e) {
       // prevent other selection transaction gets triggered
       e.stopPropagation();
       _this.closeMediaAltTextMenu();
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleClearText", function () {
+    (0, _defineProperty2.default)(_this, "handleClearText", function () {
       _this.handleOnChange('');
     });
     var createAnalyticsEvent = props.createAnalyticsEvent;
@@ -138,7 +135,8 @@ var AltTextEditComponent = exports.AltTextEditComponent = /*#__PURE__*/function
     _this.errorsListRef = /*#__PURE__*/_react.default.createRef();
     return _this;
   }
-  (0, _createClass2.default)(AltTextEditComponent, [{
+  (0, _inherits2.default)(AltTextEditComponent, _React$Component);
+  return (0, _createClass2.default)(AltTextEditComponent, [{
     key: "componentDidMount",
     value: function componentDidMount() {
       this.prevValue = this.props.value;
@@ -255,6 +253,5 @@ var AltTextEditComponent = exports.AltTextEditComponent = /*#__PURE__*/function
       }
     }
   }]);
-  return AltTextEditComponent;
 }(_react.default.Component);
 var _default = exports.default = (0, _analyticsNext.withAnalyticsEvents)()((0, _reactIntlNext.injectIntl)(AltTextEditComponent));

package/dist/cjs/pm-plugins/main.js

@@ -452,7 +452,7 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
     this.errorReporter = options.errorReporter || new _utils.ErrorReporter();
     this.singletonCreatedAt = (performance || Date).now();
   }
-  (0, _createClass2.default)(MediaPluginStateImplementation, [{
+  return (0, _createClass2.default)(MediaPluginStateImplementation, [{
     key: "clone",
     value: function clone() {
       var clonedAt = (performance || Date).now();
@@ -754,7 +754,6 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
       }
     }
   }]);
-  return MediaPluginStateImplementation;
 }();
 var getMediaPluginState = exports.getMediaPluginState = function getMediaPluginState(state) {
   return _pluginKey.stateKey.getState(state);

package/dist/cjs/pm-plugins/picker-facade.js

@@ -114,7 +114,7 @@ var PickerFacade = exports.default = /*#__PURE__*/function () {
     this.analyticsName = analyticsName;
     this.erroredFiles = new Set();
   }
-  (0, _createClass2.default)(PickerFacade, [{
+  return (0, _createClass2.default)(PickerFacade, [{
     key: "init",
     value: function () {
       var _init = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
@@ -188,5 +188,4 @@ var PickerFacade = exports.default = /*#__PURE__*/function () {
       this.onDragListeners.push(cb);
     }
   }]);
-  return PickerFacade;
 }();

package/dist/cjs/ui/MediaLinkingToolbar.js

@@ -8,10 +8,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
@@ -26,7 +25,7 @@ var _unlink = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/unlink
 var _colors = require("@atlaskit/theme/colors");
 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" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.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; }
-function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -47,26 +46,24 @@ var buttonWrapper = (0, _react2.css)({
 
 // eslint-disable-next-line @repo/internal/react/no-class-components
 var LinkAddToolbar = /*#__PURE__*/function (_React$PureComponent) {
-  (0, _inherits2.default)(LinkAddToolbar, _React$PureComponent);
-  var _super = _createSuper(LinkAddToolbar);
   function LinkAddToolbar() {
     var _this;
     (0, _classCallCheck2.default)(this, LinkAddToolbar);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
+    _this = _callSuper(this, LinkAddToolbar, [].concat(args));
+    (0, _defineProperty2.default)(_this, "state", {
       validationErrors: []
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleSubmit", function (_ref) {
+    (0, _defineProperty2.default)(_this, "handleSubmit", function (_ref) {
       var url = _ref.url,
         inputMethod = _ref.inputMethod;
       _this.props.onSubmit(url, {
         inputMethod: inputMethod
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleOnBack", function (_ref2) {
+    (0, _defineProperty2.default)(_this, "handleOnBack", function (_ref2) {
       var url = _ref2.url,
         inputMethod = _ref2.inputMethod;
       var onBack = _this.props.onBack;
@@ -76,22 +73,22 @@ var LinkAddToolbar = /*#__PURE__*/function (_React$PureComponent) {
         });
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleCancel", function () {
+    (0, _defineProperty2.default)(_this, "handleCancel", function () {
       var onCancel = _this.props.onCancel;
       if (onCancel) {
         onCancel();
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleUnlink", function () {
+    (0, _defineProperty2.default)(_this, "handleUnlink", function () {
       var onUnlink = _this.props.onUnlink;
       if (onUnlink) {
         onUnlink();
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleOnBlur", function (options) {
+    (0, _defineProperty2.default)(_this, "handleOnBlur", function (options) {
       _this.props.onBlur(options.url);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderContainer", function (_ref3) {
+    (0, _defineProperty2.default)(_this, "renderContainer", function (_ref3) {
       var activityProvider = _ref3.activityProvider,
         _ref3$inputProps = _ref3.inputProps,
         _onChange = _ref3$inputProps.onChange,
@@ -173,7 +170,8 @@ var LinkAddToolbar = /*#__PURE__*/function (_React$PureComponent) {
     });
     return _this;
   }
-  (0, _createClass2.default)(LinkAddToolbar, [{
+  (0, _inherits2.default)(LinkAddToolbar, _React$PureComponent);
+  return (0, _createClass2.default)(LinkAddToolbar, [{
     key: "getValidationErrors",
     value: function getValidationErrors(value, inputMethod) {
       var formatMessage = this.props.intl.formatMessage;
@@ -208,6 +206,5 @@ var LinkAddToolbar = /*#__PURE__*/function (_React$PureComponent) {
       });
     }
   }]);
-  return LinkAddToolbar;
 }(_react.default.PureComponent);
 var _default = exports.default = LinkAddToolbar;

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

@@ -7,17 +7,16 @@ Object.defineProperty(exports, "__esModule", {
 exports.MediaPickerComponents = void 0;
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _hooks = require("@atlaskit/editor-common/hooks");
 var _BrowserWrapper = require("./BrowserWrapper");
 var _ClipboardWrapper = require("./ClipboardWrapper");
 var _DropzoneWrapper = require("./DropzoneWrapper");
-function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 var MediaPicker = function MediaPicker(_ref) {
   var _editorDom$parentElem;
@@ -27,8 +26,9 @@ var MediaPicker = function MediaPicker(_ref) {
     mediaState = _ref.mediaState,
     onBrowseFn = _ref.onBrowseFn,
     editorDomElement = _ref.editorDomElement;
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['focus']),
-    focusState = _useSharedPluginState.focusState;
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['focus', 'connectivity']),
+    focusState = _useSharedPluginState.focusState,
+    connectivityState = _useSharedPluginState.connectivityState;
   var featureFlags = mediaState.mediaOptions && mediaState.mediaOptions.featureFlags;
   var editorDom = editorDomElement;
   var editorParent = (_editorDom$parentElem = editorDom.parentElement) !== null && _editorDom$parentElem !== void 0 ? _editorDom$parentElem : undefined;
@@ -47,7 +47,9 @@ var MediaPicker = function MediaPicker(_ref) {
   }) : null;
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, clipboard, /*#__PURE__*/_react.default.createElement(_DropzoneWrapper.DropzoneWrapper, {
     mediaState: mediaState,
-    isActive: !isPopupOpened,
+    isActive: !isPopupOpened &&
+    // If we're offline don't show the dropzone
+    (connectivityState === null || connectivityState === void 0 ? void 0 : connectivityState.mode) !== 'offline',
     featureFlags: featureFlags,
     editorDomElement: editorDomElement,
     appearance: appearance
@@ -60,25 +62,24 @@ var MediaPicker = function MediaPicker(_ref) {
 
 // eslint-disable-next-line @repo/internal/react/no-class-components
 var MediaPickerComponents = exports.MediaPickerComponents = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(MediaPickerComponents, _React$Component);
-  var _super = _createSuper(MediaPickerComponents);
   function MediaPickerComponents() {
     var _this;
     (0, _classCallCheck2.default)(this, MediaPickerComponents);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
+    _this = _callSuper(this, MediaPickerComponents, [].concat(args));
+    (0, _defineProperty2.default)(_this, "state", {
       isPopupOpened: false
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onBrowseFn", function (nativeBrowseFn) {
+    (0, _defineProperty2.default)(_this, "onBrowseFn", function (nativeBrowseFn) {
       var mediaState = _this.props.mediaState;
       mediaState && mediaState.setBrowseFn(nativeBrowseFn);
     });
     return _this;
   }
-  (0, _createClass2.default)(MediaPickerComponents, [{
+  (0, _inherits2.default)(MediaPickerComponents, _React$Component);
+  return (0, _createClass2.default)(MediaPickerComponents, [{
     key: "componentDidMount",
     value: function componentDidMount() {
       var _this2 = this;
@@ -108,6 +109,5 @@ var MediaPickerComponents = exports.MediaPickerComponents = /*#__PURE__*/functio
       });
     }
   }]);
-  return MediaPickerComponents;
 }(_react.default.Component);
 (0, _defineProperty2.default)(MediaPickerComponents, "displayName", 'MediaPickerComponents');

package/dist/cjs/ui/ResizableMediaSingle/ResizableMediaSingleNext.js

@@ -12,10 +12,9 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
@@ -39,7 +38,7 @@ var _ResizableMediaMigrationNotification = require("./ResizableMediaMigrationNot
 var _styled = require("./styled");
 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" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.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; }
-function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -47,14 +46,12 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 var resizerNextTestId = exports.resizerNextTestId = 'mediaSingle.resizerNext.testid';
 // eslint-disable-next-line @repo/internal/react/no-class-components
 var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(ResizableMediaSingleNext, _React$Component);
-  var _super = _createSuper(ResizableMediaSingleNext);
   function ResizableMediaSingleNext(props) {
     var _this;
     (0, _classCallCheck2.default)(this, ResizableMediaSingleNext);
-    _this = _super.call(this, props);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "lastSnappedGuidelineKeys", []);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "updateGuidelines", function () {
+    _this = _callSuper(this, ResizableMediaSingleNext, [props]);
+    (0, _defineProperty2.default)(_this, "lastSnappedGuidelineKeys", []);
+    (0, _defineProperty2.default)(_this, "updateGuidelines", function () {
       var _this$props = _this.props,
         view = _this$props.view,
         lineLength = _this$props.lineLength;
@@ -75,7 +72,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
         guidelines: [].concat((0, _toConsumableArray2.default)(defaultGuidelines), (0, _toConsumableArray2.default)(dynamicGuidelines))
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcNewLayout", function (newWidth, stop) {
+    (0, _defineProperty2.default)(_this, "calcNewLayout", function (newWidth, stop) {
       var _this$props2 = _this.props,
         layout = _this$props2.layout,
         containerWidth = _this$props2.containerWidth,
@@ -89,7 +86,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       }
       return _this.calcUnwrappedLayout(newWidth, containerWidth || 0, lineLength, fullWidthMode, _this.isAdjacentMode());
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcUnwrappedLayout", function (width, containerWidth, contentWidth, fullWidthMode, isNestedNode) {
+    (0, _defineProperty2.default)(_this, "calcUnwrappedLayout", function (width, containerWidth, contentWidth, fullWidthMode, isNestedNode) {
       if (isNestedNode) {
         return 'center';
       }
@@ -113,20 +110,20 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       // so that we have image aligned with text
       return 'full-width';
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcPxHeight", function (newWidth) {
+    (0, _defineProperty2.default)(_this, "calcPxHeight", function (newWidth) {
       var _this$props3 = _this.props,
         _this$props3$width = _this$props3.width,
         width = _this$props3$width === void 0 ? newWidth : _this$props3$width,
         height = _this$props3.height;
       return Math.round(height / width * newWidth);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "displayGuideline", function (guidelines) {
+    (0, _defineProperty2.default)(_this, "displayGuideline", function (guidelines) {
       var _this$props$pluginInj;
       return (_this$props$pluginInj = _this.props.pluginInjectionApi) === null || _this$props$pluginInj === void 0 || (_this$props$pluginInj = _this$props$pluginInj.guideline) === null || _this$props$pluginInj === void 0 || (_this$props$pluginInj = _this$props$pluginInj.actions) === null || _this$props$pluginInj === void 0 ? void 0 : _this$props$pluginInj.displayGuideline(_this.props.view)({
         guidelines: guidelines
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setIsResizing", function (isResizing) {
+    (0, _defineProperty2.default)(_this, "setIsResizing", function (isResizing) {
       var _this$props$view = _this.props.view,
         state = _this$props$view.state,
         dispatch = _this$props$view.dispatch;
@@ -135,7 +132,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       tr.setMeta('is-resizer-resizing', isResizing);
       return dispatch(tr);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "updateSizeInPluginState", (0, _throttle.default)(function (width) {
+    (0, _defineProperty2.default)(_this, "updateSizeInPluginState", (0, _throttle.default)(function (width) {
       var _this$props$view2 = _this.props.view,
         state = _this$props$view2.state,
         dispatch = _this$props$view2.dispatch;
@@ -143,16 +140,16 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       tr.setMeta(_main.MEDIA_PLUGIN_RESIZING_WIDTH_KEY, width);
       return dispatch(tr);
     }, _mediaSingle.MEDIA_SINGLE_RESIZE_THROTTLE_TIME));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcMaxWidth", (0, _memoizeOne.default)(function (contentWidth, containerWidth, fullWidthMode) {
+    (0, _defineProperty2.default)(_this, "calcMaxWidth", (0, _memoizeOne.default)(function (contentWidth, containerWidth, fullWidthMode) {
       if (_this.isAdjacentMode() || fullWidthMode) {
         return contentWidth;
       }
       return (0, _mediaSingle.calcMediaSingleMaxWidth)(containerWidth, _this.props.editorAppearance);
     }));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcMinWidth", (0, _memoizeOne.default)(function (isVideoFile, contentWidth) {
+    (0, _defineProperty2.default)(_this, "calcMinWidth", (0, _memoizeOne.default)(function (isVideoFile, contentWidth) {
       return Math.min(contentWidth || _editorSharedStyles.akEditorDefaultLayoutWidth, isVideoFile ? _mediaSingle.MEDIA_SINGLE_VIDEO_MIN_PIXEL_WIDTH : _mediaSingle.MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH);
     }));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getRelativeGuides", function () {
+    (0, _defineProperty2.default)(_this, "getRelativeGuides", function () {
       var _this$props$pluginInj2;
       var guidelinePluginState = (_this$props$pluginInj2 = _this.props.pluginInjectionApi) === null || _this$props$pluginInj2 === void 0 || (_this$props$pluginInj2 = _this$props$pluginInj2.guideline) === null || _this$props$pluginInj2 === void 0 || (_this$props$pluginInj2 = _this$props$pluginInj2.sharedState) === null || _this$props$pluginInj2 === void 0 ? void 0 : _this$props$pluginInj2.currentState();
       var _ref = (guidelinePluginState === null || guidelinePluginState === void 0 ? void 0 : guidelinePluginState.rect) || {
@@ -167,7 +164,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       }, _this.props.view, _this.props.lineLength, topOffset, _this.state.size) : [];
       return relativeGuides;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "updateActiveGuidelines", function () {
+    (0, _defineProperty2.default)(_this, "updateActiveGuidelines", function () {
       var width = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
       var guidelines = arguments.length > 1 ? arguments[1] : undefined;
       var guidelineSnapsReference = arguments.length > 2 ? arguments[2] : undefined;
@@ -182,7 +179,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
         _this.displayGuideline([].concat((0, _toConsumableArray2.default)((0, _guideline.getGuidelinesWithHighlights)(gap, _mediaSingle.MEDIA_SINGLE_SNAP_GAP, activeGuidelineKeys, guidelines)), (0, _toConsumableArray2.default)(relativeGuidelines)));
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calculateSizeState", function (size, delta) {
+    (0, _defineProperty2.default)(_this, "calculateSizeState", function (size, delta) {
       var onResizeStop = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
       var calculatedWidth = Math.round(size.width + delta.width);
       var calculatedWidthWithLayout = _this.calcNewLayout(calculatedWidth, onResizeStop);
@@ -192,14 +189,14 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
         layout: calculatedWidthWithLayout
       };
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "selectCurrentMediaNode", function () {
+    (0, _defineProperty2.default)(_this, "selectCurrentMediaNode", function () {
       // TODO: if adding !this.props.selected, it doesn't work if media single node is at top postion
       if (_this.pos === null) {
         return;
       }
       (0, _utils.setNodeSelection)(_this.props.view, _this.pos);
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleResizeStart", function () {
+    (0, _defineProperty2.default)(_this, "handleResizeStart", function () {
       _this.setState({
         isResizing: true
       });
@@ -211,7 +208,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
         _this.updateGuidelines();
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleResize", function (size, delta) {
+    (0, _defineProperty2.default)(_this, "handleResize", function (size, delta) {
       var _this$props4 = _this.props,
         layout = _this$props4.layout,
         updateSize = _this$props4.updateSize,
@@ -246,7 +243,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
         updateSize(width, newLayout);
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleResizeStop", function (size, delta) {
+    (0, _defineProperty2.default)(_this, "handleResizeStop", function (size, delta) {
       var _this$props5 = _this.props,
         updateSize = _this$props5.updateSize,
         dispatchAnalyticsEvent = _this$props5.dispatchAnalyticsEvent,
@@ -287,7 +284,7 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
         updateSize(newWidth, newLayout);
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getMaxWidth", function () {
+    (0, _defineProperty2.default)(_this, "getMaxWidth", function () {
       var _this$props6 = _this.props,
         lineLength = _this$props6.lineLength,
         containerWidth = _this$props6.containerWidth,
@@ -316,7 +313,8 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
     };
     return _this;
   }
-  (0, _createClass2.default)(ResizableMediaSingleNext, [{
+  (0, _inherits2.default)(ResizableMediaSingleNext, _React$Component);
+  return (0, _createClass2.default)(ResizableMediaSingleNext, [{
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
       if (prevProps.mediaSingleWidth !== this.props.mediaSingleWidth && this.props.mediaSingleWidth) {
@@ -581,7 +579,6 @@ var ResizableMediaSingleNext = /*#__PURE__*/function (_React$Component) {
       }, children, showLegacyNotification && (0, _react2.jsx)(_ResizableMediaMigrationNotification.ResizableMediaMigrationNotification, null)));
     }
   }]);
-  return ResizableMediaSingleNext;
 }(_react.default.Component);
 var calcPxHeight = function calcPxHeight(props) {
   var newWidth = props.newWidth,
@@ -1080,7 +1077,9 @@ var ResizableMediaSingleToggle = function ResizableMediaSingleToggle(_ref9) {
     forceHandlePositioning = _ref9.forceHandlePositioning;
   if ((0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single')) {
     return (0, _react2.jsx)(ResizableMediaSingleNextFunctional, {
-      allowBreakoutSnapPoints: allowBreakoutSnapPoints,
+      allowBreakoutSnapPoints: allowBreakoutSnapPoints
+      // eslint-disable-next-line react/no-children-prop
+      ,
       children: children
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
       ,
@@ -1115,7 +1114,9 @@ var ResizableMediaSingleToggle = function ResizableMediaSingleToggle(_ref9) {
     });
   }
   return (0, _react2.jsx)(ResizableMediaSingleNext, {
-    allowBreakoutSnapPoints: allowBreakoutSnapPoints,
+    allowBreakoutSnapPoints: allowBreakoutSnapPoints
+    // eslint-disable-next-line react/no-children-prop
+    ,
     children: children
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,

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

@@ -10,10 +10,9 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
@@ -24,28 +23,26 @@ var _utils2 = require("@atlaskit/editor-prosemirror/utils");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _checkMediaType = require("../../pm-plugins/utils/check-media-type");
 var _styled = require("./styled");
-function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
  * @jsxRuntime classic
  * @jsx jsx
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 // eslint-disable-next-line @repo/internal/react/no-class-components
 var ResizableMediaSingle = exports.default = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2.default)(ResizableMediaSingle, _React$Component);
-  var _super = _createSuper(ResizableMediaSingle);
   function ResizableMediaSingle() {
     var _this;
     (0, _classCallCheck2.default)(this, ResizableMediaSingle);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
+    _this = _callSuper(this, ResizableMediaSingle, [].concat(args));
+    (0, _defineProperty2.default)(_this, "state", {
       offsetLeft: (0, _mediaSingle.calculateOffsetLeft)(_this.insideInlineLike, _this.insideLayout, _this.props.view.dom, undefined),
       // We default to true until we resolve the file type
       isVideoFile: true
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "displayGrid", function (visible, gridType, highlight) {
+    (0, _defineProperty2.default)(_this, "displayGrid", function (visible, gridType, highlight) {
       var _pluginInjectionApi$g;
       var _this$props = _this.props,
         pluginInjectionApi = _this$props.pluginInjectionApi,
@@ -56,7 +53,7 @@ var ResizableMediaSingle = exports.default = /*#__PURE__*/function (_React$Compo
         highlight: highlight
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcNewSize", function (newWidth, stop) {
+    (0, _defineProperty2.default)(_this, "calcNewSize", function (newWidth, stop) {
       var _this$props2 = _this.props,
         layout = _this$props2.layout,
         state = _this$props2.view.state;
@@ -80,7 +77,7 @@ var ResizableMediaSingle = exports.default = /*#__PURE__*/function (_React$Compo
         };
       }
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcUnwrappedLayout", function (pct, width) {
+    (0, _defineProperty2.default)(_this, "calcUnwrappedLayout", function (pct, width) {
       if (pct <= 100) {
         return 'center';
       }
@@ -89,11 +86,11 @@ var ResizableMediaSingle = exports.default = /*#__PURE__*/function (_React$Compo
       }
       return 'full-width';
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcColumnLeftOffset", function () {
+    (0, _defineProperty2.default)(_this, "calcColumnLeftOffset", function () {
       var offsetLeft = _this.state.offsetLeft;
       return _this.insideInlineLike ? (0, _ui.calcColumnsFromPx)(offsetLeft, _this.props.lineLength, _this.props.gridSize) : 0;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "calcPxWidth", function (useLayout) {
+    (0, _defineProperty2.default)(_this, "calcPxWidth", function (useLayout) {
       var _this$props3 = _this.props,
         _this$props3$width = _this$props3.width,
         origWidth = _this$props3$width === void 0 ? 0 : _this$props3$width,
@@ -122,7 +119,7 @@ var ResizableMediaSingle = exports.default = /*#__PURE__*/function (_React$Compo
         resizedPctWidth: resizedPctWidth
       });
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "highlights", function (newWidth, snapPoints) {
+    (0, _defineProperty2.default)(_this, "highlights", function (newWidth, snapPoints) {
       var snapWidth = (0, _ui.snapTo)(newWidth, snapPoints);
       var _this$props$view$stat = _this.props.view.state.schema.nodes,
         layoutColumn = _this$props$view$stat.layoutColumn,
@@ -154,12 +151,13 @@ var ResizableMediaSingle = exports.default = /*#__PURE__*/function (_React$Compo
       }
       return highlight;
     });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "saveWrapper", function (wrapper) {
+    (0, _defineProperty2.default)(_this, "saveWrapper", function (wrapper) {
       return _this.wrapper = wrapper;
     });
     return _this;
   }
-  (0, _createClass2.default)(ResizableMediaSingle, [{
+  (0, _inherits2.default)(ResizableMediaSingle, _React$Component);
+  return (0, _createClass2.default)(ResizableMediaSingle, [{
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
       var offsetLeft = (0, _mediaSingle.calculateOffsetLeft)(this.insideInlineLike, this.insideLayout, this.props.view.dom, this.wrapper);
@@ -425,5 +423,4 @@ var ResizableMediaSingle = exports.default = /*#__PURE__*/function (_React$Compo
       }), children));
     }
   }]);
-  return ResizableMediaSingle;
 }(_react.default.Component);

package/dist/es2019/index.js

@@ -1 +1,4 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+// Entry file in package.json
+
 export { mediaPlugin } from './mediaPlugin';