@atlaskit/editor-core 188.2.11 → 188.3.1

package/dist/es2019/plugins/media/commands/linking.js

@@ -1,169 +0,0 @@
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
-import { createToggleBlockMarkOnRange } from '@atlaskit/editor-common/commands';
-import { normalizeUrl } from '@atlaskit/editor-common/utils';
-import { createMediaLinkingCommand, getMediaLinkingState, mediaLinkingPluginKey } from '../pm-plugins/linking';
-import { MediaLinkingActionsTypes } from '../pm-plugins/linking/actions';
-import { getMediaPluginState } from '../pm-plugins/main';
-import { checkMediaType } from '../utils/check-media-type';
-import { currentMediaNode } from '../utils/current-media-node';
-export const showLinkingToolbar = createMediaLinkingCommand(state => {
-  const mediaLinkingState = getMediaLinkingState(state);
-  if (mediaLinkingState && mediaLinkingState.mediaPos !== null) {
-    const mediaSingle = state.doc.nodeAt(mediaLinkingState.mediaPos);
-    if (mediaSingle) {
-      return {
-        type: MediaLinkingActionsTypes.showToolbar
-      };
-    }
-  }
-  return false;
-});
-export const showLinkingToolbarWithMediaTypeCheck = (editorState, dispatch, editorView) => {
-  if (dispatch && editorView) {
-    const mediaNode = currentMediaNode(editorState);
-    if (!mediaNode) {
-      return false;
-    }
-    const {
-      mediaClientConfig
-    } = getMediaPluginState(editorState);
-    if (!mediaClientConfig) {
-      return false;
-    }
-    checkMediaType(mediaNode, mediaClientConfig).then(mediaType => {
-      if ((mediaType === 'external' || mediaType === 'image') &&
-      // We make sure the selection and the node hasn't changed.
-      currentMediaNode(editorView.state) === mediaNode) {
-        dispatch(editorView.state.tr.setMeta(mediaLinkingPluginKey, {
-          type: MediaLinkingActionsTypes.showToolbar
-        }));
-      }
-    });
-  }
-  return true;
-};
-const hideLinkingToolbarCommand = createMediaLinkingCommand({
-  type: MediaLinkingActionsTypes.hideToolbar
-});
-export const hideLinkingToolbar = (state, dispatch, view, focusFloatingToolbar) => {
-  hideLinkingToolbarCommand(state, dispatch, view);
-
-  // restore focus on the editor so keyboard shortcuts aren't lost to the browser
-  if (view && !focusFloatingToolbar) {
-    view.focus();
-  }
-};
-function getCurrentUrl(state) {
-  const {
-    link: linkType
-  } = state.schema.marks;
-  const mediaLinkingState = getMediaLinkingState(state);
-  if (!mediaLinkingState || mediaLinkingState.mediaPos === null) {
-    return;
-  }
-  const $pos = state.doc.resolve(mediaLinkingState.mediaPos);
-  const node = state.doc.nodeAt($pos.pos);
-  if (!node) {
-    return;
-  }
-  const hasLink = linkType.isInSet(node.marks);
-  if (!hasLink) {
-    return;
-  }
-  const link = node.marks.find(mark => mark.type === linkType); // Already check exist
-  const url = link.attrs.href;
-  return url;
-}
-function toggleLinkMark(tr, state, {
-  forceRemove = false,
-  url
-}) {
-  const mediaLinkingState = getMediaLinkingState(state);
-  if (!mediaLinkingState || mediaLinkingState.mediaPos === null) {
-    return tr;
-  }
-  const $pos = state.doc.resolve(mediaLinkingState.mediaPos);
-  const node = state.doc.nodeAt($pos.pos);
-  if (!node) {
-    return tr;
-  }
-  const linkMark = state.schema.marks.link;
-  const {
-    media
-  } = state.schema.nodes;
-  const toggleBlockLinkMark = createToggleBlockMarkOnRange(linkMark, (prevAttrs, node) => {
-    // Only add mark to media
-    if (!node || node.type !== media) {
-      return; //No op
-    }
-
-    if (forceRemove) {
-      return false;
-    }
-    const href = normalizeUrl(url);
-    if (prevAttrs && prevAttrs.href === href) {
-      return; //No op
-    }
-
-    if (href.trim() === '') {
-      return false; // remove
-    }
-
-    return {
-      ...prevAttrs,
-      href: href
-    };
-  }, [media]);
-  toggleBlockLinkMark($pos.pos, $pos.pos + node.nodeSize, tr, state);
-  return tr;
-}
-const fireAnalyticForMediaLink = (tr, action, attributes = undefined, editorAnalyticsAPI) => {
-  editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
-    action,
-    eventType: EVENT_TYPE.TRACK,
-    actionSubject: ACTION_SUBJECT.MEDIA,
-    actionSubjectId: ACTION_SUBJECT_ID.LINK,
-    attributes
-  })(tr);
-  return tr;
-};
-export const unlink = editorAnalyticsAPI => createMediaLinkingCommand({
-  type: MediaLinkingActionsTypes.unlink
-}, (tr, state) => {
-  const transaction = toggleLinkMark(tr, state, {
-    forceRemove: true
-  });
-  return fireAnalyticForMediaLink(transaction, ACTION.DELETED, undefined, editorAnalyticsAPI);
-});
-const getAction = (newUrl, state) => {
-  const currentUrl = getCurrentUrl(state);
-  if (!currentUrl) {
-    return ACTION.ADDED;
-  } else if (newUrl !== currentUrl) {
-    return ACTION.EDITED;
-  }
-  return undefined;
-};
-export const setUrlToMedia = (url, inputMethod, editorAnalyticsAPI) => createMediaLinkingCommand({
-  type: MediaLinkingActionsTypes.setUrl,
-  payload: normalizeUrl(url)
-}, (tr, state) => {
-  const action = getAction(url, state);
-  if (!action) {
-    return tr;
-  }
-  try {
-    const toggleLinkMarkResult = toggleLinkMark(tr, state, {
-      url: url
-    });
-    fireAnalyticForMediaLink(tr, action, action === ACTION.ADDED ? {
-      inputMethod
-    } : undefined, editorAnalyticsAPI);
-    return toggleLinkMarkResult;
-  } catch (e) {
-    fireAnalyticForMediaLink(tr, ACTION.ERRORED, {
-      action: action
-    }, editorAnalyticsAPI);
-    throw e;
-  }
-});

package/dist/es2019/plugins/media/index.js

@@ -1,285 +0,0 @@
-import React from 'react';
-import { media, mediaGroup, mediaInline, mediaSingleSpec } from '@atlaskit/adf-schema';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
-import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
-import { IconImages } from '@atlaskit/editor-common/quick-insert';
-import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { NodeSelection, PluginKey } from '@atlaskit/editor-prosemirror/state';
-import { getMediaFeatureFlag } from '@atlaskit/media-common';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
-import { ReactMediaGroupNode } from './nodeviews/mediaGroup';
-import { ReactMediaInlineNode } from './nodeviews/mediaInline';
-import { ReactMediaNode } from './nodeviews/mediaNodeView';
-import { ReactMediaSingleNode } from './nodeviews/mediaSingle';
-import { createPlugin as createMediaAltTextPlugin } from './pm-plugins/alt-text';
-import keymapMediaAltTextPlugin from './pm-plugins/alt-text/keymap';
-import keymapPlugin from './pm-plugins/keymap';
-import keymapMediaSinglePlugin from './pm-plugins/keymap-media-single';
-import linkingPlugin from './pm-plugins/linking';
-import keymapLinkingPlugin from './pm-plugins/linking/keymap';
-import { stateKey } from './pm-plugins/main';
-import { createPlugin, stateKey as pluginKey } from './pm-plugins/main';
-import { floatingToolbar } from './toolbar';
-import { MediaPickerComponents } from './ui/MediaPicker';
-import ToolbarMedia from './ui/ToolbarMedia';
-import { insertMediaAsMediaSingle } from './utils/media-single';
-export { insertMediaSingleNode } from './utils/media-single';
-const MediaPickerFunctionalComponent = ({
-  api,
-  editorDomElement,
-  appearance
-}) => {
-  const {
-    mediaState
-  } = useSharedPluginState(api, ['media']);
-  if (!mediaState) {
-    return null;
-  }
-  return /*#__PURE__*/React.createElement(MediaPickerComponents, {
-    editorDomElement: editorDomElement,
-    mediaState: mediaState,
-    appearance: appearance,
-    api: api
-  });
-};
-const mediaPlugin = ({
-  config: options = {},
-  api
-}) => {
-  var _api$featureFlags;
-  const featureFlags = (api === null || api === void 0 ? void 0 : (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 ? void 0 : _api$featureFlags.sharedState.currentState()) || {};
-  return {
-    name: 'media',
-    getSharedState(editorState) {
-      if (!editorState) {
-        return null;
-      }
-      return stateKey.getState(editorState) || null;
-    },
-    actions: {
-      insertMediaAsMediaSingle: (view, node, inputMethod) => {
-        var _api$analytics;
-        return insertMediaAsMediaSingle(view, node, inputMethod, api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions);
-      }
-    },
-    nodes() {
-      const {
-        allowMediaGroup = true,
-        allowMediaSingle = false,
-        allowCaptions,
-        featureFlags: mediaFeatureFlags
-      } = options || {};
-      const allowMediaInline = getMediaFeatureFlag('mediaInline', mediaFeatureFlags);
-      const withCaption = getMediaFeatureFlag('captions', mediaFeatureFlags);
-
-      // temporary mapping - we will support captions feature flag until
-      // confluence removes the feature flag support in their code base and
-      // utilizes allowCaptions media prop instead
-      const mappedAllowCaptions = allowCaptions ? allowCaptions : withCaption;
-      const mediaSingleOption = getBooleanFF('platform.editor.media.extended-resize-experience') ? {
-        withCaption: mappedAllowCaptions,
-        withExtendedWidthTypes: true
-      } : {
-        withCaption: mappedAllowCaptions,
-        withExtendedWidthTypes: false
-      };
-      const mediaSingleNode = mediaSingleSpec(mediaSingleOption);
-      return [{
-        name: 'mediaGroup',
-        node: mediaGroup
-      }, {
-        name: 'mediaSingle',
-        node: mediaSingleNode
-      }, {
-        name: 'media',
-        node: media
-      }, {
-        name: 'mediaInline',
-        node: mediaInline
-      }].filter(node => {
-        if (node.name === 'mediaGroup') {
-          return allowMediaGroup;
-        }
-        if (node.name === 'mediaSingle') {
-          return allowMediaSingle;
-        }
-        if (node.name === 'mediaInline') {
-          return allowMediaInline;
-        }
-        return true;
-      });
-    },
-    pmPlugins() {
-      const pmPlugins = [{
-        name: 'media',
-        plugin: ({
-          schema,
-          dispatch,
-          getIntl,
-          eventDispatcher,
-          providerFactory,
-          errorReporter,
-          portalProviderAPI,
-          reactContext,
-          dispatchAnalyticsEvent
-        }) => {
-          return createPlugin(schema, {
-            providerFactory,
-            nodeViews: {
-              mediaGroup: ReactMediaGroupNode(portalProviderAPI, eventDispatcher, providerFactory, options, api),
-              mediaSingle: ReactMediaSingleNode(portalProviderAPI, eventDispatcher, providerFactory, api, dispatchAnalyticsEvent, options),
-              media: ReactMediaNode(portalProviderAPI, eventDispatcher, providerFactory, options, api),
-              mediaInline: ReactMediaInlineNode(portalProviderAPI, eventDispatcher, providerFactory, api)
-            },
-            errorReporter,
-            uploadErrorHandler: options && options.uploadErrorHandler,
-            waitForMediaUpload: options && options.waitForMediaUpload,
-            customDropzoneContainer: options && options.customDropzoneContainer,
-            customMediaPicker: options && options.customMediaPicker,
-            allowResizing: !!(options && options.allowResizing)
-          }, reactContext, getIntl, api, dispatch, options, featureFlags.newInsertionBehaviour);
-        }
-      }, {
-        name: 'mediaKeymap',
-        plugin: () => {
-          var _api$analytics2;
-          return keymapPlugin(options, api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions);
-        }
-      }];
-      if (options && options.allowMediaSingle) {
-        pmPlugins.push({
-          name: 'mediaSingleKeymap',
-          plugin: ({
-            schema
-          }) => keymapMediaSinglePlugin(schema)
-        });
-      }
-      if (options && options.allowAltTextOnImages) {
-        pmPlugins.push({
-          name: 'mediaAltText',
-          plugin: createMediaAltTextPlugin
-        });
-        pmPlugins.push({
-          name: 'mediaAltTextKeymap',
-          plugin: ({
-            schema
-          }) => {
-            var _api$analytics3;
-            return keymapMediaAltTextPlugin(schema, api === null || api === void 0 ? void 0 : (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions);
-          }
-        });
-      }
-      if (options && options.allowLinking) {
-        pmPlugins.push({
-          name: 'mediaLinking',
-          plugin: ({
-            dispatch
-          }) => linkingPlugin(dispatch)
-        });
-        pmPlugins.push({
-          name: 'mediaLinkingKeymap',
-          plugin: ({
-            schema
-          }) => keymapLinkingPlugin(schema)
-        });
-      }
-      pmPlugins.push({
-        name: 'mediaSelectionHandler',
-        plugin: () => {
-          const mediaSelectionHandlerPlugin = new SafePlugin({
-            key: new PluginKey('mediaSelectionHandlerPlugin'),
-            props: {
-              handleScrollToSelection: view => {
-                const {
-                  state: {
-                    selection
-                  }
-                } = view;
-                if (!(selection instanceof NodeSelection) || selection.node.type.name !== 'media') {
-                  return false;
-                }
-                const {
-                  node,
-                  offset
-                } = view.domAtPos(selection.from);
-                if (
-                // Is the media element mounted already?
-                offset === node.childNodes.length) {
-                  // Media is not ready, so stop the scroll request
-                  return true;
-                }
-
-                // Media is ready, keep the scrolling request
-                return false;
-              }
-            }
-          });
-          return mediaSelectionHandlerPlugin;
-        }
-      });
-      return pmPlugins;
-    },
-    contentComponent({
-      editorView,
-      appearance
-    }) {
-      return /*#__PURE__*/React.createElement(MediaPickerFunctionalComponent, {
-        editorDomElement: editorView.dom,
-        appearance: appearance,
-        api: api
-      });
-    },
-    secondaryToolbarComponent({
-      editorView,
-      eventDispatcher,
-      disabled
-    }) {
-      return /*#__PURE__*/React.createElement(ToolbarMedia, {
-        isDisabled: disabled,
-        isReducedSpacing: true,
-        api: api
-      });
-    },
-    pluginsOptions: {
-      quickInsert: ({
-        formatMessage
-      }) => [{
-        id: 'media',
-        title: formatMessage(messages.mediaFiles),
-        description: formatMessage(messages.mediaFilesDescription),
-        priority: 400,
-        keywords: ['attachment', 'gif', 'media', 'picture', 'image', 'video'],
-        icon: () => /*#__PURE__*/React.createElement(IconImages, null),
-        action(insert, state) {
-          var _api$analytics4;
-          const pluginState = pluginKey.getState(state);
-          pluginState === null || pluginState === void 0 ? void 0 : pluginState.showMediaPicker();
-          const tr = insert('');
-          api === null || api === void 0 ? void 0 : (_api$analytics4 = api.analytics) === null || _api$analytics4 === void 0 ? void 0 : _api$analytics4.actions.attachAnalyticsEvent({
-            action: ACTION.OPENED,
-            actionSubject: ACTION_SUBJECT.PICKER,
-            actionSubjectId: ACTION_SUBJECT_ID.PICKER_CLOUD,
-            attributes: {
-              inputMethod: INPUT_METHOD.QUICK_INSERT
-            },
-            eventType: EVENT_TYPE.UI
-          })(tr);
-          return tr;
-        }
-      }],
-      floatingToolbar: (state, intl, providerFactory) => floatingToolbar(state, intl, {
-        providerFactory,
-        allowMediaInline: options && getMediaFeatureFlag('mediaInline', options.featureFlags),
-        allowResizing: options && options.allowResizing,
-        allowResizingInTables: options && options.allowResizingInTables,
-        allowLinking: options && options.allowLinking,
-        allowAdvancedToolBarOptions: options && options.allowAdvancedToolBarOptions,
-        allowAltTextOnImages: options && options.allowAltTextOnImages,
-        altTextValidator: options && options.altTextValidator,
-        fullWidthEnabled: options && options.fullWidthEnabled
-      }, api)
-    }
-  };
-};
-export default mediaPlugin;

package/dist/es2019/plugins/media/media-plugin-options.js

@@ -1 +0,0 @@
-export {};

package/dist/es2019/plugins/media/next-plugin-type.js

@@ -1 +0,0 @@
-export {};