@atlaskit/editor-plugin-media 3.0.3 → 3.0.4

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/editor-plugin-media
 
+## 3.0.4
+
+### Patch Changes
+
+- [#153009](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/153009)
+  [`c8a0f30534d85`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c8a0f30534d85) -
+  Refactor to use sharedPluginStateHookMigratorFactory
+- Updated dependencies
+
 ## 3.0.3
 
 ### Patch Changes

package/dist/cjs/mediaPlugin.js

@@ -43,45 +43,66 @@ var _toolbar = require("./ui/toolbar");
 var _ToolbarMedia = _interopRequireDefault(require("./ui/ToolbarMedia"));
 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; }
+var useMediaPickerSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (api) {
+  var onPopupToggle = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.onPopupToggle');
+  var setBrowseFn = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.setBrowseFn');
+  return {
+    onPopupToggle: onPopupToggle,
+    setBrowseFn: setBrowseFn
+  };
+}, function (api) {
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['media']),
+    mediaState = _useSharedPluginState.mediaState;
+  return {
+    onPopupToggle: mediaState === null || mediaState === void 0 ? void 0 : mediaState.onPopupToggle,
+    setBrowseFn: mediaState === null || mediaState === void 0 ? void 0 : mediaState.setBrowseFn
+  };
+});
 var MediaPickerFunctionalComponent = function MediaPickerFunctionalComponent(_ref) {
   var api = _ref.api,
     editorDomElement = _ref.editorDomElement,
     appearance = _ref.appearance;
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['media']),
-    mediaState = _useSharedPluginState.mediaState;
-  if (!mediaState) {
+  var _useMediaPickerShared = useMediaPickerSharedState(api),
+    onPopupToggle = _useMediaPickerShared.onPopupToggle,
+    setBrowseFn = _useMediaPickerShared.setBrowseFn;
+  if (!onPopupToggle || !setBrowseFn) {
     return null;
   }
   return /*#__PURE__*/_react.default.createElement(_MediaPicker.MediaPickerComponents, {
+    onPopupToggle: onPopupToggle,
+    setBrowseFn: setBrowseFn,
     editorDomElement: editorDomElement,
-    mediaState: mediaState,
     appearance: appearance,
     api: api
   });
 };
+var useMediaViewerSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (api) {
+  var isMediaViewerVisible = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.isMediaViewerVisible');
+  var mediaViewerSelectedMedia = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.mediaViewerSelectedMedia');
+  var mediaClientConfig = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.mediaClientConfig');
+  return {
+    isMediaViewerVisible: isMediaViewerVisible,
+    mediaViewerSelectedMedia: mediaViewerSelectedMedia,
+    mediaClientConfig: mediaClientConfig
+  };
+}, function (api) {
+  var _useSharedPluginState2 = (0, _hooks.useSharedPluginState)(api, ['media']),
+    mediaState = _useSharedPluginState2.mediaState;
+  return {
+    isMediaViewerVisible: mediaState === null || mediaState === void 0 ? void 0 : mediaState.isMediaViewerVisible,
+    mediaViewerSelectedMedia: mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaViewerSelectedMedia,
+    mediaClientConfig: mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaClientConfig
+  };
+});
 var MediaViewerFunctionalComponent = function MediaViewerFunctionalComponent(_ref2) {
   var api = _ref2.api,
     editorView = _ref2.editorView;
-  var _useSharedPluginState2 = (0, _hooks.useSharedPluginState)(api, ['media'], {
-      disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true)
-    }),
-    mediaState = _useSharedPluginState2.mediaState;
-  var isMediaViewerVisibleSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.isMediaViewerVisible', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var mediaViewerSelectedMediaSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.mediaViewerSelectedMedia', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var mediaClientConfigSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.mediaClientConfig', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var isMediaViewerVisible = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? isMediaViewerVisibleSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.isMediaViewerVisible;
-  var mediaViewerSelectedMedia = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? mediaViewerSelectedMediaSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaViewerSelectedMedia;
-  var mediaClientConfig = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? mediaClientConfigSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaClientConfig;
-
   // Only traverse document once when media viewer is visible, media viewer items will not update
   // when document changes are made while media viewer is open
-
+  var _useMediaViewerShared = useMediaViewerSharedState(api),
+    isMediaViewerVisible = _useMediaViewerShared.isMediaViewerVisible,
+    mediaViewerSelectedMedia = _useMediaViewerShared.mediaViewerSelectedMedia,
+    mediaClientConfig = _useMediaViewerShared.mediaClientConfig;
   var mediaItems = (0, _react.useMemo)(function () {
     if (isMediaViewerVisible) {
       var mediaNodes = (0, _mediaCommon2.extractMediaNodes)(editorView.state.doc);

package/dist/cjs/nodeviews/mediaGroup.js

@@ -309,26 +309,30 @@ var MediaGroup = /*#__PURE__*/function (_React$Component) {
 (0, _defineProperty2.default)(MediaGroup, "displayName", 'MediaGroup');
 var IntlMediaGroup = (0, _reactIntlNext.injectIntl)(MediaGroup);
 var _default = exports.default = IntlMediaGroup;
+var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (pluginInjectionApi) {
+  var editorDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'editorDisabled.editorDisabled');
+  var editorViewMode = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'editorViewMode.mode');
+  return {
+    editorDisabled: editorDisabled,
+    editorViewMode: editorViewMode
+  };
+}, function (pluginInjectionApi) {
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['editorDisabled', 'editorViewMode']),
+    editorDisabledPlugin = _useSharedPluginState.editorDisabledState,
+    editorViewModePlugin = _useSharedPluginState.editorViewModeState;
+  return {
+    editorDisabled: editorDisabledPlugin === null || editorDisabledPlugin === void 0 ? void 0 : editorDisabledPlugin.editorDisabled,
+    editorViewMode: editorViewModePlugin === null || editorViewModePlugin === void 0 ? void 0 : editorViewModePlugin.mode
+  };
+});
 function MediaGroupNodeViewInternal(_ref3) {
   var renderFn = _ref3.renderFn,
     pluginInjectionApi = _ref3.pluginInjectionApi;
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['editorDisabled', 'editorViewMode'], {
-      disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true)
-    }),
-    editorDisabledPlugin = _useSharedPluginState.editorDisabledState,
-    editorViewModePlugin = _useSharedPluginState.editorViewModeState;
-  var editorDisabledSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'editorDisabled.editorDisabled', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var editorViewModeSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'editorViewMode.mode', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var editorDisabled = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? editorDisabledSelector : editorDisabledPlugin === null || editorDisabledPlugin === void 0 ? void 0 : editorDisabledPlugin.editorDisabled;
-  var editorViewMode = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? editorViewModeSelector : editorViewModePlugin === null || editorViewModePlugin === void 0 ? void 0 : editorViewModePlugin.mode;
+  var _useSharedState = useSharedState(pluginInjectionApi),
+    editorDisabled = _useSharedState.editorDisabled,
+    editorViewMode = _useSharedState.editorViewMode;
   var mediaProvider = (0, _useMediaProvider.useMediaProvider)(pluginInjectionApi);
   return renderFn({
-    editorDisabledPlugin: editorDisabledPlugin,
-    editorViewModePlugin: editorViewModePlugin,
     editorDisabled: editorDisabled,
     editorViewMode: editorViewMode,
     mediaProvider: mediaProvider
@@ -354,9 +358,7 @@ var MediaGroupNodeView = /*#__PURE__*/function (_ReactNodeView) {
         renderNode: function renderNode(_ref4) {
           var contextIdentifierProvider = _ref4.contextIdentifierProvider;
           var renderFn = function renderFn(_ref5) {
-            var editorDisabledPlugin = _ref5.editorDisabledPlugin,
-              editorViewModePlugin = _ref5.editorViewModePlugin,
-              mediaProviderFromState = _ref5.mediaProvider,
+            var mediaProviderFromState = _ref5.mediaProvider,
               editorDisabled = _ref5.editorDisabled,
               editorViewMode = _ref5.editorViewMode;
             var mediaProvider = mediaProviderFromState ? Promise.resolve(mediaProviderFromState) : undefined;
@@ -385,7 +387,7 @@ var MediaGroupNodeView = /*#__PURE__*/function (_ReactNodeView) {
               getPos: getPos,
               view: _this3.view,
               forwardRef: forwardRef,
-              disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? editorDisabled : (editorDisabledPlugin || {}).editorDisabled,
+              disabled: editorDisabled,
               allowLazyLoading: mediaOptions.allowLazyLoading,
               mediaProvider: mediaProvider,
               contextIdentifierProvider: contextIdentifierProvider,
@@ -393,7 +395,7 @@ var MediaGroupNodeView = /*#__PURE__*/function (_ReactNodeView) {
               anchorPos: _this3.view.state.selection.$anchor.pos,
               headPos: _this3.view.state.selection.$head.pos,
               mediaOptions: mediaOptions,
-              editorViewMode: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? editorViewMode === 'view' : (editorViewModePlugin === null || editorViewModePlugin === void 0 ? void 0 : editorViewModePlugin.mode) === 'view'
+              editorViewMode: editorViewMode === 'view'
             });
           };
           return /*#__PURE__*/_react.default.createElement(MediaGroupNodeViewInternal, {

package/dist/cjs/nodeviews/mediaInline.js

@@ -25,7 +25,6 @@ var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-
 var _mediaCard = require("@atlaskit/media-card");
 var _mediaClientReact = require("@atlaskit/media-client-react");
 var _mediaUi = require("@atlaskit/media-ui");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _isType = require("../pm-plugins/utils/is-type");
 var _MediaViewerContainer = require("../ui/MediaViewer/MediaViewerContainer");
 var _mediaNodeUpdater = require("./mediaNodeUpdater");
@@ -223,6 +222,40 @@ var MediaInline = exports.MediaInline = function MediaInline(props) {
     mediaClientConfig: viewMediaClientConfig
   }));
 };
+var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (api) {
+  var viewMode = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'editorViewMode.mode');
+  var mediaProvider = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.mediaProvider');
+  var handleMediaNodeMount = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.handleMediaNodeMount');
+  var handleMediaNodeUnmount = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.handleMediaNodeUnmount');
+  var allowInlineImages = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.allowInlineImages');
+  var addPendingTask = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.addPendingTask');
+  var selectedMediaContainerNode = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.selectedMediaContainerNode');
+  var mediaClientConfig = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.mediaClientConfig');
+  return {
+    viewMode: viewMode,
+    mediaProvider: mediaProvider,
+    handleMediaNodeMount: handleMediaNodeMount,
+    handleMediaNodeUnmount: handleMediaNodeUnmount,
+    allowInlineImages: allowInlineImages,
+    addPendingTask: addPendingTask,
+    selectedMediaContainerNode: selectedMediaContainerNode,
+    mediaClientConfig: mediaClientConfig
+  };
+}, function (api) {
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['editorViewMode', 'media']),
+    editorViewModeState = _useSharedPluginState.editorViewModeState,
+    mediaState = _useSharedPluginState.mediaState;
+  return {
+    viewMode: editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode,
+    mediaProvider: mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider,
+    handleMediaNodeMount: mediaState === null || mediaState === void 0 ? void 0 : mediaState.handleMediaNodeMount,
+    handleMediaNodeUnmount: mediaState === null || mediaState === void 0 ? void 0 : mediaState.handleMediaNodeUnmount,
+    allowInlineImages: mediaState === null || mediaState === void 0 ? void 0 : mediaState.allowInlineImages,
+    addPendingTask: mediaState === null || mediaState === void 0 ? void 0 : mediaState.addPendingTask,
+    selectedMediaContainerNode: mediaState === null || mediaState === void 0 ? void 0 : mediaState.selectedMediaContainerNode,
+    mediaClientConfig: mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaClientConfig
+  };
+});
 var MediaInlineSharedState = function MediaInlineSharedState(_ref3) {
   var identifier = _ref3.identifier,
     node = _ref3.node,
@@ -231,43 +264,15 @@ var MediaInlineSharedState = function MediaInlineSharedState(_ref3) {
     contextIdentifierProvider = _ref3.contextIdentifierProvider,
     api = _ref3.api,
     view = _ref3.view;
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['editorViewMode', 'media'], {
-      disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true)
-    }),
-    editorViewModeState = _useSharedPluginState.editorViewModeState,
-    mediaState = _useSharedPluginState.mediaState;
-  var viewModeSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'editorViewMode.mode', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var mediaProviderSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.mediaProvider', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var handleMediaNodeMountSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.handleMediaNodeMount', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var handleMediaNodeUnmountSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.handleMediaNodeUnmount', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var allowInlineImagesSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.allowInlineImages', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var addPendingTaskSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.addPendingTask', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var selectedMediaContainerNodeSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.selectedMediaContainerNode', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var mediaClientConfigSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'media.mediaClientConfig', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var viewMode = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? viewModeSelector : editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode;
-  var mediaProvider = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? mediaProviderSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider;
-  var handleMediaNodeMount = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? handleMediaNodeMountSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.handleMediaNodeMount;
-  var handleMediaNodeUnmount = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? handleMediaNodeUnmountSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.handleMediaNodeUnmount;
-  var allowInlineImages = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? allowInlineImagesSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.allowInlineImages;
-  var addPendingTask = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? addPendingTaskSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.addPendingTask;
-  var selectedMediaContainerNode = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? selectedMediaContainerNodeSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.selectedMediaContainerNode;
-  var mediaClientConfig = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? mediaClientConfigSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaClientConfig;
+  var _useSharedState = useSharedState(api),
+    mediaProvider = _useSharedState.mediaProvider,
+    allowInlineImages = _useSharedState.allowInlineImages,
+    handleMediaNodeMount = _useSharedState.handleMediaNodeMount,
+    handleMediaNodeUnmount = _useSharedState.handleMediaNodeUnmount,
+    addPendingTask = _useSharedState.addPendingTask,
+    selectedMediaContainerNode = _useSharedState.selectedMediaContainerNode,
+    mediaClientConfig = _useSharedState.mediaClientConfig,
+    viewMode = _useSharedState.viewMode;
   var newMediaProvider = (0, _react.useMemo)(function () {
     return mediaProvider ? Promise.resolve(mediaProvider) : undefined;
   }, [mediaProvider]);

package/dist/cjs/nodeviews/mediaNodeView/index.js

@@ -20,7 +20,6 @@ var _providerFactory = require("@atlaskit/editor-common/provider-factory");
 var _selectionBasedNodeView = require("@atlaskit/editor-common/selection-based-node-view");
 var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
 var _mediaClient = require("@atlaskit/media-client");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _helpers = require("../../pm-plugins/commands/helpers");
 var _mediaCommon = require("../../pm-plugins/utils/media-common");
 var _media = _interopRequireDefault(require("./media"));
@@ -31,20 +30,30 @@ function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0,
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 function _superPropGet(t, o, e, r) { var p = (0, _get2.default)((0, _getPrototypeOf2.default)(1 & r ? t.prototype : t), o, e); return 2 & r && "function" == typeof p ? function (t) { return p.apply(e, t); } : p; } // Ignored via go/ees005
 // eslint-disable-next-line import/no-named-as-default
+var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (pluginInjectionApi) {
+  var mediaProvider = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'media.mediaProvider');
+  return {
+    mediaProvider: mediaProvider,
+    widthState: undefined
+  };
+}, function (pluginInjectionApi) {
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['width', 'media']),
+    widthState = _useSharedPluginState.widthState,
+    mediaState = _useSharedPluginState.mediaState;
+  return {
+    mediaProvider: mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider,
+    widthState: widthState
+  };
+});
 var MediaNodeWithProviders = function MediaNodeWithProviders(_ref) {
   var pluginInjectionApi = _ref.pluginInjectionApi,
     innerComponent = _ref.innerComponent;
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['width', 'media'], {
-      disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true)
-    }),
-    widthState = _useSharedPluginState.widthState,
-    mediaState = _useSharedPluginState.mediaState;
-  var mediaProviderSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'media.mediaProvider', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var mediaProvider = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? mediaProviderSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider;
+  var _useSharedState = useSharedState(pluginInjectionApi),
+    mediaProvider = _useSharedState.mediaProvider,
+    widthState = _useSharedState.widthState;
   return innerComponent({
-    width: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? widthState : undefined,
+    width: widthState,
+    // Remove when platform_editor_usesharedpluginstateselector is cleaned up
     mediaProvider: mediaProvider ? Promise.resolve(mediaProvider) : undefined
   });
 };

package/dist/cjs/nodeviews/mediaSingle.js

@@ -31,7 +31,6 @@ var _utils2 = require("@atlaskit/editor-prosemirror/utils");
 var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
 var _mediaClient = require("@atlaskit/media-client");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _captions = require("../pm-plugins/commands/captions");
 var _main = require("../pm-plugins/main");
 var _mediaCommon = require("../pm-plugins/utils/media-common");
@@ -553,6 +552,43 @@ var MediaSingleNode = exports.default = /*#__PURE__*/function (_Component) {
   mediaOptions: {}
 });
 (0, _defineProperty2.default)(MediaSingleNode, "displayName", 'MediaSingleNode');
+var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (pluginInjectionApi) {
+  var mediaProviderPromise = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'media.mediaProvider');
+  var addPendingTask = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'media.addPendingTask');
+  var isDrafting = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'annotation.isDrafting');
+  var targetNodeId = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'annotation.targetNodeId');
+  var width = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'width.width');
+  var lineLength = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'width.lineLength');
+  var editorDisabled = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'editorDisabled.editorDisabled');
+  var viewMode = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'editorViewMode.mode');
+  return {
+    mediaProviderPromise: mediaProviderPromise,
+    addPendingTask: addPendingTask,
+    isDrafting: isDrafting,
+    targetNodeId: targetNodeId,
+    width: width,
+    lineLength: lineLength,
+    editorDisabled: editorDisabled,
+    viewMode: viewMode
+  };
+}, function (pluginInjectionApi) {
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['width', 'media', 'annotation', 'editorDisabled', 'editorViewMode']),
+    widthState = _useSharedPluginState.widthState,
+    mediaState = _useSharedPluginState.mediaState,
+    annotationState = _useSharedPluginState.annotationState,
+    editorDisabledState = _useSharedPluginState.editorDisabledState,
+    editorViewModeState = _useSharedPluginState.editorViewModeState;
+  return {
+    mediaProviderPromise: mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider,
+    addPendingTask: mediaState === null || mediaState === void 0 ? void 0 : mediaState.addPendingTask,
+    isDrafting: annotationState === null || annotationState === void 0 ? void 0 : annotationState.isDrafting,
+    targetNodeId: annotationState === null || annotationState === void 0 ? void 0 : annotationState.targetNodeId,
+    width: widthState === null || widthState === void 0 ? void 0 : widthState.width,
+    lineLength: widthState === null || widthState === void 0 ? void 0 : widthState.lineLength,
+    editorDisabled: editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled,
+    viewMode: editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode
+  };
+});
 var MediaSingleNodeWrapper = function MediaSingleNodeWrapper(_ref6) {
   var pluginInjectionApi = _ref6.pluginInjectionApi,
     contextIdentifierProvider = _ref6.contextIdentifierProvider,
@@ -566,50 +602,19 @@ var MediaSingleNodeWrapper = function MediaSingleNodeWrapper(_ref6) {
     dispatchAnalyticsEvent = _ref6.dispatchAnalyticsEvent,
     forwardRef = _ref6.forwardRef,
     editorAppearance = _ref6.editorAppearance;
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['width', 'media', 'annotation', 'editorDisabled', 'editorViewMode'], {
-      disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true)
-    }),
-    widthState = _useSharedPluginState.widthState,
-    mediaState = _useSharedPluginState.mediaState,
-    annotationState = _useSharedPluginState.annotationState,
-    editorDisabledState = _useSharedPluginState.editorDisabledState,
-    editorViewModeState = _useSharedPluginState.editorViewModeState;
-  var mediaProviderSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'media.mediaProvider', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var addPendingTaskSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'media.addPendingTask', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var isDraftingSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'annotation.isDrafting', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var targetNodeIdSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'annotation.targetNodeId', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var widthSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'width.width', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var lineLengthSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'width.lineLength', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var editorDisabledSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'editorDisabled.editorDisabled', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var viewModeSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'editorViewMode.mode', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var mediaProviderState = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? mediaProviderSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider;
-  var addPendingTask = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? addPendingTaskSelector : mediaState === null || mediaState === void 0 ? void 0 : mediaState.addPendingTask;
-  var isDrafting = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? isDraftingSelector : annotationState === null || annotationState === void 0 ? void 0 : annotationState.isDrafting;
-  var targetNodeId = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? targetNodeIdSelector : annotationState === null || annotationState === void 0 ? void 0 : annotationState.targetNodeId;
-  var width = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? widthSelector : widthState === null || widthState === void 0 ? void 0 : widthState.width;
-  var lineLength = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? lineLengthSelector : widthState === null || widthState === void 0 ? void 0 : widthState.lineLength;
-  var editorDisabled = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? editorDisabledSelector : editorDisabledState === null || editorDisabledState === void 0 ? void 0 : editorDisabledState.editorDisabled;
-  var viewMode = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? viewModeSelector : editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode;
+  var _useSharedState = useSharedState(pluginInjectionApi),
+    mediaProviderPromise = _useSharedState.mediaProviderPromise,
+    addPendingTask = _useSharedState.addPendingTask,
+    isDrafting = _useSharedState.isDrafting,
+    targetNodeId = _useSharedState.targetNodeId,
+    width = _useSharedState.width,
+    lineLength = _useSharedState.lineLength,
+    editorDisabled = _useSharedState.editorDisabled,
+    viewMode = _useSharedState.viewMode;
   var hasHadInteraction = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'interaction.hasHadInteraction');
   var mediaProvider = (0, _react.useMemo)(function () {
-    return mediaProviderState ? Promise.resolve(mediaProviderState) : undefined;
-  }, [mediaProviderState]);
+    return mediaProviderPromise ? Promise.resolve(mediaProviderPromise) : undefined;
+  }, [mediaProviderPromise]);
   var isSelectedAndInteracted = (0, _react.useCallback)(function () {
     return Boolean(selected() && hasHadInteraction !== false);
   }, [hasHadInteraction, selected]);

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

@@ -13,9 +13,26 @@ var _analytics = require("@atlaskit/editor-common/analytics");
 var _hooks = require("@atlaskit/editor-common/hooks");
 var _mediaSingle = require("@atlaskit/editor-common/media-single");
 var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 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; }
+var useSharedState = (0, _hooks.sharedPluginStateHookMigratorFactory)(function (api) {
+  var selectedAnnotations = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'annotation.selectedAnnotations');
+  var isInlineCommentViewClosed = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'annotation.isInlineCommentViewClosed');
+  var annotations = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'annotation.annotations');
+  return {
+    selectedAnnotations: selectedAnnotations,
+    isInlineCommentViewClosed: isInlineCommentViewClosed,
+    annotations: annotations
+  };
+}, function (api) {
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['annotation']),
+    annotationState = _useSharedPluginState.annotationState;
+  return {
+    selectedAnnotations: annotationState === null || annotationState === void 0 ? void 0 : annotationState.selectedAnnotations,
+    isInlineCommentViewClosed: annotationState === null || annotationState === void 0 ? void 0 : annotationState.isInlineCommentViewClosed,
+    annotations: annotationState === null || annotationState === void 0 ? void 0 : annotationState.annotations
+  };
+});
 var CommentBadgeWrapper = function CommentBadgeWrapper(_ref) {
   var api = _ref.api,
     mediaNode = _ref.mediaNode,
@@ -24,26 +41,14 @@ var CommentBadgeWrapper = function CommentBadgeWrapper(_ref) {
     intl = _ref.intl,
     isDrafting = _ref.isDrafting,
     badgeOffsetRight = _ref.badgeOffsetRight;
+  var _useSharedState = useSharedState(api),
+    selectedAnnotations = _useSharedState.selectedAnnotations,
+    isInlineCommentViewClosed = _useSharedState.isInlineCommentViewClosed,
+    annotations = _useSharedState.annotations;
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     entered = _useState2[0],
     setEntered = _useState2[1];
-  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(api, ['annotation'], {
-      disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true)
-    }),
-    annotationState = _useSharedPluginState.annotationState;
-  var selectedAnnotationsSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'annotation.selectedAnnotations', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var isInlineCommentViewClosedSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'annotation.isInlineCommentViewClosed', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var annotationsSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'annotation.annotations', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var selectedAnnotations = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? selectedAnnotationsSelector : annotationState === null || annotationState === void 0 ? void 0 : annotationState.selectedAnnotations;
-  var isInlineCommentViewClosed = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? isInlineCommentViewClosedSelector : annotationState === null || annotationState === void 0 ? void 0 : annotationState.isInlineCommentViewClosed;
-  var annotations = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? annotationsSelector : annotationState === null || annotationState === void 0 ? void 0 : annotationState.annotations;
   var _view$state$schema = view.state.schema,
     media = _view$state$schema.nodes.media,
     annotation = _view$state$schema.marks.annotation,
@@ -114,22 +119,10 @@ var CommentBadgeNextWrapper = exports.CommentBadgeNextWrapper = function Comment
     _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
     entered = _useState4[0],
     setEntered = _useState4[1];
-  var _useSharedPluginState2 = (0, _hooks.useSharedPluginState)(api, ['annotation'], {
-      disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true)
-    }),
-    annotationState = _useSharedPluginState2.annotationState;
-  var selectedAnnotationsSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'annotation.selectedAnnotations', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var isInlineCommentViewClosedSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'annotation.isInlineCommentViewClosed', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var annotationsSelector = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'annotation.annotations', {
-    disabled: (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', false)
-  });
-  var selectedAnnotations = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? selectedAnnotationsSelector : annotationState === null || annotationState === void 0 ? void 0 : annotationState.selectedAnnotations;
-  var isInlineCommentViewClosed = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? isInlineCommentViewClosedSelector : annotationState === null || annotationState === void 0 ? void 0 : annotationState.isInlineCommentViewClosed;
-  var annotations = (0, _experiments.editorExperiment)('platform_editor_usesharedpluginstateselector', true) ? annotationsSelector : annotationState === null || annotationState === void 0 ? void 0 : annotationState.annotations;
+  var _useSharedState2 = useSharedState(api),
+    selectedAnnotations = _useSharedState2.selectedAnnotations,
+    isInlineCommentViewClosed = _useSharedState2.isInlineCommentViewClosed,
+    annotations = _useSharedState2.annotations;
   var _view$state$schema2 = view.state.schema,
     media = _view$state$schema2.nodes.media,
     annotation = _view$state$schema2.marks.annotation,

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

@@ -12,12 +12,12 @@ var _PickerFacadeProvider = _interopRequireDefault(require("./PickerFacadeProvid
 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; }
 var BrowserWrapper = exports.BrowserWrapper = function BrowserWrapper(_ref) {
-  var mediaState = _ref.mediaState,
+  var api = _ref.api,
     isOpen = _ref.isOpen,
     onBrowseFn = _ref.onBrowseFn,
     featureFlags = _ref.featureFlags;
   return /*#__PURE__*/_react.default.createElement(_PickerFacadeProvider.default, {
-    mediaState: mediaState,
+    api: api,
     analyticsName: "browser"
   }, function (_ref2) {
     var mediaClientConfig = _ref2.mediaClientConfig,

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

@@ -9,11 +9,11 @@ var _react = _interopRequireDefault(require("react"));
 var _mediaPicker = require("@atlaskit/media-picker");
 var _PickerFacadeProvider = _interopRequireDefault(require("./PickerFacadeProvider"));
 var ClipboardWrapper = exports.ClipboardWrapper = function ClipboardWrapper(_ref) {
-  var mediaState = _ref.mediaState,
-    featureFlags = _ref.featureFlags,
-    container = _ref.container;
+  var api = _ref.api,
+    container = _ref.container,
+    featureFlags = _ref.featureFlags;
   return /*#__PURE__*/_react.default.createElement(_PickerFacadeProvider.default, {
-    mediaState: mediaState,
+    api: api,
     analyticsName: "clipboard"
   }, function (_ref2) {
     var mediaClientConfig = _ref2.mediaClientConfig,