@atlaskit/editor-plugin-media 4.0.0 → 4.1.1

package/dist/cjs/ui/toolbar/alt-text.js

@@ -13,7 +13,6 @@ var _styles = require("@atlaskit/editor-common/styles");
 var _ui = require("@atlaskit/editor-common/ui");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _text = _interopRequireDefault(require("@atlaskit/icon/core/text"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _commands = require("../../pm-plugins/alt-text/commands");
 var _AltTextEdit = _interopRequireDefault(require("../../pm-plugins/alt-text/ui/AltTextEdit"));
@@ -61,7 +60,7 @@ var altTextEditComponent = function altTextEditComponent(options) {
         var _options$forceFocusSe;
         var tr = view.state.tr,
           dispatch = view.dispatch;
-        var elementSelector = options !== null && options !== void 0 && options.triggerButtonSelector && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_8') ? options.triggerButtonSelector : "[data-testid=\"".concat(testId, "\"]");
+        var elementSelector = options !== null && options !== void 0 && options.triggerButtonSelector && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? options.triggerButtonSelector : "[data-testid=\"".concat(testId, "\"]");
         var newTr = options === null || options === void 0 || (_options$forceFocusSe = options.forceFocusSelector) === null || _options$forceFocusSe === void 0 ? void 0 : _options$forceFocusSe.call(options, elementSelector)(tr);
         if (newTr) {
           dispatch(newTr);

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

@@ -435,7 +435,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
             icon: /*#__PURE__*/_react.default.createElement(_imageInline.default, {
               color: "currentColor",
               spacing: "spacious",
-              label: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_7') ? '' : inlineTitle
+              label: ""
             }),
             tooltip: hasCaption ? inlineSwitcherTitle : undefined
           }, {
@@ -445,14 +445,10 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
             onClick: function onClick() {
               return true;
             },
-            icon: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_7') ? /*#__PURE__*/_react.default.createElement(_maximize.default, {
+            icon: /*#__PURE__*/_react.default.createElement(_maximize.default, {
               color: "currentColor",
               spacing: "spacious",
               label: ""
-            }) : /*#__PURE__*/_react.default.createElement(_imageFullscreen.default, {
-              color: "currentColor",
-              spacing: "spacious",
-              label: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_7') ? '' : floatingSwitcherTitle
             })
           }];
           var switchFromBlockToInline;
@@ -466,11 +462,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
               options: _options2,
               title: intl.formatMessage(_mediaUi.messages.sizeOptions),
               icon: function icon() {
-                return (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_7') ? /*#__PURE__*/_react.default.createElement(_maximize.default, {
-                  color: "currentColor",
-                  spacing: "spacious",
-                  label: intl.formatMessage(_mediaUi.messages.sizeOptions)
-                }) : /*#__PURE__*/_react.default.createElement(_imageFullscreen.default, {
+                return /*#__PURE__*/_react.default.createElement(_maximize.default, {
                   color: "currentColor",
                   spacing: "spacious",
                   label: intl.formatMessage(_mediaUi.messages.sizeOptions)
@@ -783,7 +775,7 @@ var floatingToolbar = exports.floatingToolbar = function floatingToolbar(state,
 
   // testId is required to show focus on trigger button on ESC key press
   // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
-  var overflowButtonSelector = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_8') ? "[data-testid=\"".concat(overflowDropdwonBtnTriggerTestId, "\"]") : undefined;
+  var overflowButtonSelector = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? "[data-testid=\"".concat(overflowDropdwonBtnTriggerTestId, "\"]") : undefined;
   if (allowAltTextOnImages) {
     var mediaAltTextPluginState = (0, _altText.getPluginState)(state);
     if (mediaAltTextPluginState.isAltTextEditorOpen) {

package/dist/cjs/ui/toolbar/linking.js

@@ -14,7 +14,6 @@ var _messages = require("@atlaskit/editor-common/messages");
 var _ui = require("@atlaskit/editor-common/ui");
 var _link = _interopRequireDefault(require("@atlaskit/icon/core/link"));
 var _linkExternal = _interopRequireDefault(require("@atlaskit/icon/core/link-external"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _linking = require("../../pm-plugins/commands/linking");
 var _linking2 = require("../../pm-plugins/linking");
@@ -63,7 +62,7 @@ var getLinkingToolbar = exports.getLinkingToolbar = function getLinkingToolbar(t
               return null;
             }
             var setFocusOnFloatingToolbar = function setFocusOnFloatingToolbar(setFocus) {
-              if (setFocus && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_8')) {
+              if (setFocus && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
                 var _pluginInjectionApi$f;
                 var tr = view.state.tr,
                   dispatch = view.dispatch;
@@ -98,7 +97,7 @@ var getLinkingToolbar = exports.getLinkingToolbar = function getLinkingToolbar(t
                  */
                 var tr = view.state.tr,
                   dispatch = view.dispatch;
-                var selector = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_8') ? FORCE_FOCUS_SELECTOR_EDITOR_CONTROLS : FORCE_FOCUS_SELECTOR;
+                var selector = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? FORCE_FOCUS_SELECTOR_EDITOR_CONTROLS : FORCE_FOCUS_SELECTOR;
                 pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f2 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f2 === void 0 || (_pluginInjectionApi$f2 = _pluginInjectionApi$f2.actions) === null || _pluginInjectionApi$f2 === void 0 || _pluginInjectionApi$f2.forceFocusSelector(selector)(tr);
                 dispatch(tr);
               },
@@ -152,7 +151,7 @@ var getLinkingDropdownOptions = exports.getLinkingDropdownOptions = function get
         return true;
       },
       icon: /*#__PURE__*/_react.default.createElement(_link.default, {
-        label: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_7') ? '' : title
+        label: ""
       })
     }];
   } else {

package/dist/cjs/ui/toolbar/mediaInline.js

@@ -321,20 +321,16 @@ var getMediaInlineImageToolbar = function getMediaInlineImageToolbar(state, intl
       icon: /*#__PURE__*/_react.default.createElement(_imageInline.default, {
         color: "currentColor",
         spacing: "spacious",
-        label: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_7') ? '' : mediaInlineImageTitle
+        label: ""
       })
     }, {
       id: 'editor.media.convert.mediasingle',
       title: mediaSingleTitle,
       onClick: (0, _commands.changeMediaInlineToMediaSingle)(editorAnalyticsAPI, widthPluginState),
-      icon: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_7') ? /*#__PURE__*/_react.default.createElement(_maximize.default, {
+      icon: /*#__PURE__*/_react.default.createElement(_maximize.default, {
         color: "currentColor",
         spacing: "spacious",
         label: ""
-      }) : /*#__PURE__*/_react.default.createElement(_imageFullscreen.default, {
-        color: "currentColor",
-        spacing: "spacious",
-        label: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_7') ? '' : mediaSingleTitle
       })
     }];
     var switchFromInlineToBlock;

package/dist/cjs/ui/toolbar/pixel-resizing.js

@@ -9,9 +9,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _react = _interopRequireDefault(require("react"));
 var _media = require("@atlaskit/editor-common/media");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
-var _growHorizontal = _interopRequireDefault(require("@atlaskit/icon/core/grow-horizontal"));
 var _imageFullscreen = _interopRequireDefault(require("@atlaskit/icon/core/image-fullscreen"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _commands = require("../../pm-plugins/pixel-resizing/commands");
 var _ui = require("../../pm-plugins/pixel-resizing/ui");
 var _constants = require("../../pm-plugins/pixel-resizing/ui/constants");
@@ -66,9 +64,7 @@ var getResizeDropdownOption = exports.getResizeDropdownOption = function getResi
     return [{
       title: formatMessage(_media.pixelEntryMessages.resizeOption),
       onClick: (0, _commands.openPixelEditor)(),
-      icon: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_7') ? /*#__PURE__*/_react.default.createElement(_imageFullscreen.default, {
-        label: ""
-      }) : /*#__PURE__*/_react.default.createElement(_growHorizontal.default, {
+      icon: /*#__PURE__*/_react.default.createElement(_imageFullscreen.default, {
         label: ""
       }),
       testId: 'media-pixel-resizing-dropdown-option'

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

@@ -2,9 +2,7 @@ import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ReactMediaGroupNode } from './mediaGroup';
 export const lazyMediaGroupView = (portalProviderAPI, eventDispatcher, providerFactory, options = {}, api) => {
-  if (editorExperiment('platform_editor_exp_lazy_node_views', false) || editorExperiment('platform_editor_exp_disable_lnv', true, {
-    exposure: true
-  })) {
+  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

@@ -2,9 +2,7 @@ import { withLazyLoading } from '@atlaskit/editor-common/lazy-node-view';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { ReactMediaInlineNode } from './mediaInline';
 export const lazyMediaInlineView = (portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent) => {
-  if (editorExperiment('platform_editor_exp_lazy_node_views', false) || editorExperiment('platform_editor_exp_disable_lnv', true, {
-    exposure: true
-  })) {
+  if (editorExperiment('platform_editor_exp_lazy_node_views', false)) {
     return ReactMediaInlineNode(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent);
   }
   return withLazyLoading({

package/dist/es2019/nodeviews/mediaGroup.js

@@ -1,264 +1,10 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
-import { injectIntl } from 'react-intl-next';
 import { sharedPluginStateHookMigratorFactory, useSharedPluginState } from '@atlaskit/editor-common/hooks';
-import { nodeViewsMessages as messages } from '@atlaskit/editor-common/media';
 import { WithProviders } from '@atlaskit/editor-common/provider-factory';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
 import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
-import { isNodeSelectedOrInRange, SelectedState, setNodeSelection } from '@atlaskit/editor-common/utils';
-import EditorCloseIcon from '@atlaskit/icon/core/migration/close--editor-close';
-import { getMediaFeatureFlag } from '@atlaskit/media-common';
-import { Filmstrip } from '@atlaskit/media-filmstrip';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
-import { stateKey as mediaStateKey } from '../pm-plugins/plugin-key';
 import { useMediaProvider } from '../ui/hooks/useMediaProvider';
 import { MediaGroupNext } from './mediaGroupNext';
-import { MediaNodeUpdater } from './mediaNodeUpdater';
-const isMediaGroupSelectedFromProps = props => {
-  /**
-   *  ED-19831
-   *  There is a getPos issue coming from this code. We need to apply this workaround for now and apply a patch
-   *  directly to confluence since this bug is now in production.
-   */
-  let pos;
-  try {
-    pos = props.getPos ? props.getPos() : undefined;
-  } catch (e) {
-    pos = undefined;
-  }
-  if (typeof pos !== 'number') {
-    return false;
-  }
-  return isNodeSelectedOrInRange(props.anchorPos, props.headPos, pos, props.node.nodeSize);
-};
-const hasSelectionChanged = (oldProps, newProps) => {
-  if (isMediaGroupSelectedFromProps(oldProps) !== isMediaGroupSelectedFromProps(newProps)) {
-    return true;
-  }
-  if (isMediaGroupSelectedFromProps(newProps) === SelectedState.selectedInside) {
-    return oldProps.anchorPos !== newProps.anchorPos;
-  }
-  return false;
-};
-
-// eslint-disable-next-line @repo/internal/react/no-class-components
-class MediaGroup extends React.Component {
-  constructor(_props) {
-    super(_props);
-    _defineProperty(this, "state", {
-      viewMediaClientConfig: undefined
-    });
-    _defineProperty(this, "updateNodeAttrs", (props, node, getPos) => {
-      const {
-        view,
-        mediaProvider,
-        contextIdentifierProvider
-      } = props;
-      const mediaNodeUpdater = new MediaNodeUpdater({
-        view,
-        mediaProvider,
-        contextIdentifierProvider,
-        node,
-        isMediaSingle: false
-      });
-      mediaNodeUpdater.updateNodeAttrs(getPos);
-    });
-    _defineProperty(this, "setMediaItems", (props, updatedAttrs = false) => {
-      var _this$mediaPluginStat;
-      const {
-        node
-      } = props;
-      const oldMediaNodes = this.mediaNodes;
-      this.mediaNodes = [];
-      node.forEach((item, childOffset) => {
-        const getPos = () => {
-          const pos = props.getPos();
-          if (typeof pos !== 'number') {
-            // That may seems weird, but the previous type wasn't match with the real ProseMirror code. And a lot of Media API was built expecting a number
-            // Because the original code would return NaN on runtime
-            // We are just make it explict now.
-            // We may run a deep investagation on Media code to figure out a better fix. But, for now, we want to keep the current behavior.
-            // TODO: ED-13910 - prosemirror-bump leftovers
-            return NaN;
-          }
-          return pos + childOffset + 1;
-        };
-        this.mediaNodes.push(item);
-        if (updatedAttrs) {
-          this.updateNodeAttrs(props, item, getPos);
-        }
-      });
-      (_this$mediaPluginStat = this.mediaPluginState) === null || _this$mediaPluginStat === void 0 ? void 0 : _this$mediaPluginStat.handleMediaGroupUpdate(oldMediaNodes, this.mediaNodes);
-    });
-    _defineProperty(this, "getIdentifier", item => {
-      if (item.attrs.type === 'external') {
-        return {
-          mediaItemType: 'external-image',
-          dataURI: item.attrs.url
-        };
-      }
-      return {
-        id: item.attrs.id,
-        mediaItemType: 'file',
-        collectionName: item.attrs.collection
-      };
-    });
-    _defineProperty(this, "isNodeSelected", nodePos => {
-      const selected = isMediaGroupSelectedFromProps(this.props);
-      if (selected === SelectedState.selectedInRange) {
-        return true;
-      }
-      if (selected === SelectedState.selectedInside && this.props.anchorPos === nodePos) {
-        return true;
-      }
-      return false;
-    });
-    _defineProperty(this, "renderChildNodes", () => {
-      const {
-        viewMediaClientConfig
-      } = this.state;
-      const {
-        getPos,
-        allowLazyLoading,
-        disabled,
-        mediaOptions,
-        editorViewMode
-      } = this.props;
-      const items = this.mediaNodes.map((item, idx) => {
-        // We declared this to get a fresh position every time
-        const getNodePos = () => {
-          const pos = getPos();
-          if (typeof pos !== 'number') {
-            // That may seems weird, but the previous type wasn't match with the real ProseMirror code. And a lot of Media API was built expecting a number
-            // Because the original code would return NaN on runtime
-            // We are just make it explict now.
-            // We may run a deep investagation on Media code to figure out a better fix. But, for now, we want to keep the current behavior.
-            // TODO: ED-13910 - prosemirror-bump leftovers
-            return NaN;
-          }
-          return pos + idx + 1;
-        };
-
-        // Media Inline creates a floating toolbar with the same options, excludes these options if enabled
-        const mediaInlineOptions = (allowMediaInline = false) => {
-          if (!allowMediaInline) {
-            return {
-              shouldEnableDownloadButton: mediaOptions.enableDownloadButton,
-              actions: [{
-                handler: disabled || !this.mediaPluginState ? () => {} : this.mediaPluginState.handleMediaNodeRemoval.bind(null, undefined, getNodePos),
-                icon: /*#__PURE__*/React.createElement(EditorCloseIcon, {
-                  label: this.props.intl.formatMessage(messages.mediaGroupDeleteLabel)
-                })
-              }]
-            };
-          }
-        };
-        return {
-          identifier: this.getIdentifier(item),
-          isLazy: allowLazyLoading,
-          selected: this.isNodeSelected(getNodePos()),
-          onClick: () => {
-            setNodeSelection(this.props.view, getNodePos());
-          },
-          ...mediaInlineOptions(fg('platform_editor_remove_media_inline_feature_flag') ? mediaOptions.allowMediaInlineImages : getMediaFeatureFlag('mediaInline', mediaOptions.featureFlags))
-        };
-      });
-      return /*#__PURE__*/React.createElement(Filmstrip, {
-        items: items,
-        mediaClientConfig: viewMediaClientConfig,
-        featureFlags: mediaOptions.featureFlags,
-        shouldOpenMediaViewer: editorViewMode && editorExperiment('platform_editor_controls', 'control')
-      });
-    });
-    this.mediaNodes = [];
-    this.mediaPluginState = mediaStateKey.getState(_props.view.state);
-    this.setMediaItems(_props);
-    this.state = {
-      viewMediaClientConfig: undefined
-    };
-  }
-  componentDidMount() {
-    this.updateMediaClientConfig();
-    this.mediaNodes.forEach(async node => {
-      if (node.attrs.type === 'external') {
-        return;
-      }
-      const {
-        view,
-        mediaProvider,
-        contextIdentifierProvider
-      } = this.props;
-      const mediaNodeUpdater = new MediaNodeUpdater({
-        view,
-        mediaProvider,
-        contextIdentifierProvider,
-        node,
-        isMediaSingle: false
-      });
-      const getPos = () => {
-        const pos = this.props.getPos();
-        if (typeof pos !== 'number') {
-          // That may seems weird, but the previous type wasn't match with the real ProseMirror code. And a lot of Media API was built expecting a number
-          // Because the original code would return NaN on runtime
-          // We are just make it explict now.
-          // We may run a deep investagation on Media code to figure out a better fix. But, for now, we want to keep the current behavior.
-          // TODO: ED-13910 - prosemirror-bump leftovers
-          return NaN;
-        }
-        return pos + 1;
-      };
-      const contextId = mediaNodeUpdater.getNodeContextId();
-      if (!contextId) {
-        await mediaNodeUpdater.updateNodeContextId(getPos);
-      }
-      const shouldNodeBeDeepCopied = await mediaNodeUpdater.shouldNodeBeDeepCopied();
-      if (shouldNodeBeDeepCopied) {
-        await mediaNodeUpdater.copyNodeFromPos(getPos, {
-          traceId: node.attrs.__mediaTraceId
-        });
-      }
-    });
-  }
-  componentWillUnmount() {
-    var _this$mediaPluginStat2;
-    (_this$mediaPluginStat2 = this.mediaPluginState) === null || _this$mediaPluginStat2 === void 0 ? void 0 : _this$mediaPluginStat2.handleMediaGroupUpdate(this.mediaNodes, []);
-  }
-
-  // Ignored via go/ees005
-  // eslint-disable-next-line react/no-unsafe
-  UNSAFE_componentWillReceiveProps(props) {
-    this.updateMediaClientConfig();
-    this.setMediaItems(props, props.isCopyPasteEnabled || props.isCopyPasteEnabled === undefined);
-  }
-  shouldComponentUpdate(nextProps) {
-    var _this$mediaPluginStat3;
-    if (hasSelectionChanged(this.props, nextProps) || this.props.node !== nextProps.node || this.state.viewMediaClientConfig !== ((_this$mediaPluginStat3 = this.mediaPluginState) === null || _this$mediaPluginStat3 === void 0 ? void 0 : _this$mediaPluginStat3.mediaClientConfig)) {
-      return true;
-    }
-    return false;
-  }
-  updateMediaClientConfig() {
-    const {
-      viewMediaClientConfig
-    } = this.state;
-    const {
-      mediaClientConfig
-    } = this.mediaPluginState || {};
-    if (!viewMediaClientConfig && mediaClientConfig) {
-      this.setState({
-        viewMediaClientConfig: mediaClientConfig
-      });
-    }
-  }
-  render() {
-    return this.renderChildNodes();
-  }
-}
-_defineProperty(MediaGroup, "displayName", 'MediaGroup');
-const IntlMediaGroup = injectIntl(MediaGroup);
-export default IntlMediaGroup;
 const useSharedState = sharedPluginStateHookMigratorFactory(pluginInjectionApi => {
   const editorDisabled = useSharedPluginStateSelector(pluginInjectionApi, 'editorDisabled.editorDisabled');
   const editorViewMode = useSharedPluginStateSelector(pluginInjectionApi, 'editorViewMode.mode');
@@ -314,24 +60,7 @@ class MediaGroupNodeView extends ReactNodeView {
           if (!mediaProvider) {
             return null;
           }
-          if (fg('platform_editor_react18_phase2__media_single') || fg('platform_editor_react18_phase2__media_single_jira')) {
-            return /*#__PURE__*/React.createElement(MediaGroupNext, {
-              node: this.node,
-              getPos: getPos,
-              view: this.view,
-              forwardRef: forwardRef,
-              disabled: editorDisabled,
-              allowLazyLoading: mediaOptions.allowLazyLoading,
-              mediaProvider: mediaProvider,
-              contextIdentifierProvider: contextIdentifierProvider,
-              isCopyPasteEnabled: mediaOptions.isCopyPasteEnabled,
-              anchorPos: this.view.state.selection.$anchor.pos,
-              headPos: this.view.state.selection.$head.pos,
-              mediaOptions: mediaOptions,
-              editorViewMode: editorViewMode === 'view'
-            });
-          }
-          return /*#__PURE__*/React.createElement(IntlMediaGroup, {
+          return /*#__PURE__*/React.createElement(MediaGroupNext, {
             node: this.node,
             getPos: getPos,
             view: this.view,