@atlaskit/editor-core 186.0.1 → 187.1.1

package/dist/es2019/labs/next/internal/context/shared-config.js

@@ -1,34 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import PropTypes from 'prop-types';
-
-/**
- * Provides access to most commonly used configurations and instances of classes,
- * that most editor components rely on.
- */
-
-const EditorSharedConfigContext = /*#__PURE__*/React.createContext(null);
-export class EditorSharedConfigProvider extends React.Component {
-  getChildContext() {
-    return {
-      editorSharedConfig: this.props.value
-    };
-  }
-  render() {
-    return /*#__PURE__*/React.createElement(EditorSharedConfigContext.Provider, {
-      value: this.props.value
-    }, this.props.children);
-  }
-}
-_defineProperty(EditorSharedConfigProvider, "childContextTypes", {
-  editorSharedConfig: PropTypes.object
-});
-export class EditorSharedConfigConsumer extends React.Component {
-  render() {
-    return /*#__PURE__*/React.createElement(EditorSharedConfigContext.Consumer, null, value => this.props.children(this.context.editorSharedConfig || value));
-  }
-}
-_defineProperty(EditorSharedConfigConsumer, "contextTypes", {
-  editorSharedConfig: PropTypes.object
-});
-export const useEditorSharedConfig = () => React.useContext(EditorSharedConfigContext);

package/dist/es2019/labs/next/internal/editor-props-type.js

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

package/dist/es2019/labs/next/internal/hooks/use-analytics/index.js

@@ -1,32 +0,0 @@
-import React from 'react';
-import { fireAnalyticsEvent } from '@atlaskit/editor-common/analytics';
-import { analyticsEventKey } from '@atlaskit/editor-common/utils';
-
-/**
- * Subscribes to analytics events fired from editor components
- * and passes them through to `fireAnalyticsEvent`.
- */
-export function useAnalyticsHandler(editorSharedConfig) {
-  // handleAnalyticsEvent – must always be the same so we can unsubscribe from events properly.
-  const handleAnalyticsEvent = React.useCallback(payload => {
-    const handleAnalyticsEvent = editorSharedConfig && editorSharedConfig.dispatchAnalyticsEvent;
-    if (!handleAnalyticsEvent) {
-      return;
-    }
-    handleAnalyticsEvent(payload);
-  }, [editorSharedConfig]);
-  if (editorSharedConfig) {
-    editorSharedConfig.eventDispatcher.on(analyticsEventKey, handleAnalyticsEvent);
-  }
-  React.useEffect(() => () => {
-    if (!editorSharedConfig || !editorSharedConfig.eventDispatcher) {
-      return;
-    }
-    editorSharedConfig.eventDispatcher.off(analyticsEventKey, handleAnalyticsEvent);
-  }, [editorSharedConfig, handleAnalyticsEvent]);
-}
-export function useCreateAnalyticsHandler(createAnalyticsEvent) {
-  // AFP-2511 TODO: Fix automatic suppressions below
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  return React.useCallback(fireAnalyticsEvent(createAnalyticsEvent), [createAnalyticsEvent]);
-}

package/dist/es2019/labs/next/internal/hooks/use-editor/create-dispatch-transaction.js

@@ -1,51 +0,0 @@
-import { Node } from 'prosemirror-model';
-import { analyticsEventKey } from '@atlaskit/editor-common/utils';
-import { ACTION, ACTION_SUBJECT, EVENT_TYPE, getAnalyticsEventsFromTransaction } from '@atlaskit/editor-common/analytics';
-import { findChangedNodesFromTransaction, validateNodes, validNode } from '../../../../../utils/nodes';
-import { compose, toJSON } from '../../../../../utils';
-import { getDocStructure } from '../../../../../utils/document-logger';
-// Helper to assure correct payload when dispatch analytics
-function dispatchAnalytics(dispatch, payload) {
-  dispatch(analyticsEventKey, payload);
-}
-export function createDispatchTransaction(editorSharedConfig) {
-  return function dispatchTransaction(transaction) {
-    const {
-      editorView,
-      onChange,
-      transformer,
-      dispatch
-    } = editorSharedConfig;
-    if (!editorView) {
-      return;
-    }
-    const nodes = findChangedNodesFromTransaction(transaction);
-    if (validateNodes(nodes)) {
-      // go ahead and update the state now we know the transaction is good
-      const editorState = editorView.state.apply(transaction);
-      editorView.updateState(editorState);
-      if (onChange && transaction.docChanged) {
-        onChange(getEditorValue(editorView, transformer), {
-          source: 'local'
-        });
-      }
-    } else {
-      // If invalid document, send analytics event with the structure of the nodes
-      if (dispatch) {
-        const invalidNodes = nodes.filter(node => !validNode(node)).map(node => getDocStructure(node));
-        dispatchAnalytics(dispatch, {
-          action: ACTION.DISPATCHED_INVALID_TRANSACTION,
-          actionSubject: ACTION_SUBJECT.EDITOR,
-          eventType: EVENT_TYPE.OPERATIONAL,
-          attributes: {
-            analyticsEventPayloads: getAnalyticsEventsFromTransaction(transaction),
-            invalidNodes
-          }
-        });
-      }
-    }
-  };
-}
-export function getEditorValue(editorView, transformer) {
-  return compose(doc => transformer && transformer.encode ? transformer.encode(Node.fromJSON(editorView.state.schema, doc)) : doc, toJSON)(editorView.state.doc);
-}

package/dist/es2019/labs/next/internal/hooks/use-editor/create-editor.js

@@ -1,85 +0,0 @@
-import { EditorView } from 'prosemirror-view';
-import { EditorState } from 'prosemirror-state';
-import { EventDispatcher, createDispatch } from '../../../../../event-dispatcher';
-import { processPluginsList, createPMPlugins } from '../../../../../create-editor/create-editor';
-import { processRawValue } from '@atlaskit/editor-common/utils';
-import { createSchema } from '../../../../../create-editor/create-schema';
-export function createEditor({
-  context,
-  onAnalyticsEvent,
-  transformer,
-  providerFactory,
-  plugins,
-  portalProviderAPI,
-  defaultValue,
-  ref,
-  popupsMountPoint,
-  popupsBoundariesElement,
-  popupsScrollableElement,
-  editorActions,
-  disabled,
-  onChange,
-  onDestroy,
-  onMount,
-  featureFlags,
-  getIntl
-}) {
-  if (!ref) {
-    return null;
-  }
-  const eventDispatcher = new EventDispatcher();
-  const dispatch = createDispatch(eventDispatcher);
-  const editorConfig = processPluginsList(plugins || []);
-  const schema = createSchema(editorConfig);
-  const transformerInstance = transformer && transformer(schema);
-  const pmPlugins = createPMPlugins({
-    editorConfig,
-    schema,
-    dispatch,
-    eventDispatcher,
-    portalProviderAPI: portalProviderAPI,
-    providerFactory,
-    // Required to workaround issues with multiple react trees.
-    // Though it's kinda leaking react to outside world.
-    reactContext: () => context,
-    // TODO: ED-8133 Need to make types more generic otherwise it's not extensible.
-    dispatchAnalyticsEvent: onAnalyticsEvent,
-    performanceTracking: {},
-    featureFlags,
-    getIntl
-  });
-  const state = EditorState.create({
-    schema,
-    plugins: pmPlugins,
-    doc: transformerInstance ? transformerInstance.parse(defaultValue) : processRawValue(schema, defaultValue)
-  });
-  const editorView = new EditorView({
-    mount: ref
-  }, {
-    state,
-    attributes: {
-      'data-gramm': 'false'
-    },
-    // Ignore all transactions by default
-    dispatchTransaction: () => {},
-    // Disables the contentEditable attribute of the editor if the editor is disabled
-    editable: _state => !!disabled
-  });
-  return {
-    editorView,
-    transformer: transformerInstance,
-    dispatchAnalyticsEvent: onAnalyticsEvent,
-    eventDispatcher,
-    dispatch,
-    primaryToolbarComponents: editorConfig.primaryToolbarComponents,
-    contentComponents: editorConfig.contentComponents,
-    popupsMountPoint,
-    popupsBoundariesElement,
-    popupsScrollableElement,
-    providerFactory,
-    editorActions,
-    onChange,
-    onDestroy,
-    onMount
-  };
-}

package/dist/es2019/labs/next/internal/hooks/use-editor/index.js

@@ -1,179 +0,0 @@
-import React from 'react';
-import { measureRender, getResponseEndTime, startMeasure, stopMeasure } from '@atlaskit/editor-common/utils';
-import measurements from '../../../../../utils/performance/measure-enum';
-import { getNodesCount } from '../../../../../utils';
-import { ACTION, ACTION_SUBJECT, EVENT_TYPE, PLATFORMS } from '../../../../../plugins/analytics';
-import { getEnabledFeatureFlagKeys } from '@atlaskit/editor-common/normalize-feature-flags';
-import { useAnalyticsHandler } from '../use-analytics';
-import { createDispatchTransaction } from './create-dispatch-transaction';
-import { createEditor } from './create-editor';
-import { analyticsEventKey } from '../../../../../plugins/analytics/consts';
-export function useEditor(config) {
-  startMeasure(measurements.EDITOR_MOUNTED);
-  const [editorSharedConfig, mountEditor] = useCreateEditor(config);
-  useApplyEditorViewProps(editorSharedConfig, config.disabled);
-  useHandleEditorLifecycle(editorSharedConfig, config.featureFlags);
-  useAnalyticsHandler(editorSharedConfig);
-  return [editorSharedConfig, mountEditor];
-}
-
-/**
- *
- * Sub hooks ¯\_(ツ)_/¯
- *
- */
-
-/**
- * Main hook that creates an instance of EditorView, EditorSharedConfig, etc...
- */
-function useCreateEditor(config) {
-  const [editorSharedConfig, setEditorSharedConfig] = React.useState(null);
-  return [editorSharedConfig,
-  // This callback is being used as `ref={callback}` on EditorContentProvider,
-  // When called with `ref` mounts editor and creates editorSharedConfig.
-  React.useCallback(ref => {
-    // If editorSharedConfig already exists it means that editorView is mounted
-    // and we just need to ignore this function altogether.
-    if (!ref) {
-      return;
-    }
-    setEditorSharedConfig(editorSharedConfig => {
-      if (!editorSharedConfig) {
-        measureRender(measurements.PROSEMIRROR_RENDERED, ({
-          duration,
-          startTime,
-          distortedDuration
-        }) => {
-          if (sharedConfig && sharedConfig.dispatch) {
-            sharedConfig.dispatch(analyticsEventKey, {
-              payload: {
-                action: ACTION.PROSEMIRROR_RENDERED,
-                actionSubject: ACTION_SUBJECT.EDITOR,
-                attributes: {
-                  duration,
-                  distortedDuration,
-                  startTime,
-                  nodes: getNodesCount(sharedConfig.editorView.state.doc),
-                  ttfb: getResponseEndTime()
-                },
-                eventType: EVENT_TYPE.OPERATIONAL
-              }
-            });
-          }
-        });
-      }
-      const sharedConfig = editorSharedConfig || createEditor({
-        ...config,
-        ref
-      });
-      stopMeasure(measurements.EDITOR_MOUNTED, (duration, startTime) => {
-        if (!sharedConfig) {
-          return;
-        }
-
-        // Fire editor mounted event
-        sharedConfig.dispatch(analyticsEventKey, {
-          payload: {
-            action: ACTION.EDITOR_MOUNTED,
-            actionSubject: ACTION_SUBJECT.EDITOR,
-            attributes: {
-              duration,
-              startTime
-            },
-            eventType: EVENT_TYPE.OPERATIONAL
-          }
-        });
-      });
-      return sharedConfig;
-    });
-  }, [config])];
-}
-
-/**
- * Applies updated EditorView properties e.g. set dispatchTransaction or 'disabled' state changes
- */
-function useApplyEditorViewProps(editorSharedConfig, disabled) {
-  React.useEffect(() => {
-    if (editorSharedConfig) {
-      editorSharedConfig.editorView.setProps({
-        dispatchTransaction: createDispatchTransaction(editorSharedConfig)
-      });
-      editorSharedConfig.editorView.setProps({
-        editable: _state => !disabled
-      });
-    }
-  }, [editorSharedConfig, disabled]);
-}
-
-/**
- * Handles editor component unmount
- */
-export function useHandleEditorLifecycle(editorSharedConfig, featureFlags) {
-  React.useEffect(() => {
-    //#region Did mount
-    if (editorSharedConfig) {
-      const {
-        onMount,
-        editorActions,
-        editorView,
-        eventDispatcher,
-        dispatch
-      } = editorSharedConfig;
-      editorActions._privateRegisterEditor(editorView, eventDispatcher);
-      if (onMount) {
-        onMount(editorActions);
-      }
-      const featureFlagsEnabled = featureFlags ? getEnabledFeatureFlagKeys(featureFlags) : [];
-
-      // Fire editor started event
-      dispatch(analyticsEventKey, {
-        payload: {
-          action: ACTION.STARTED,
-          actionSubject: ACTION_SUBJECT.EDITOR,
-          attributes: {
-            platform: PLATFORMS.WEB,
-            featureFlags: featureFlagsEnabled
-          },
-          eventType: EVENT_TYPE.UI
-        }
-      });
-    }
-    //#endregion
-
-    return () => {
-      if (!editorSharedConfig) {
-        return;
-      }
-      const {
-        eventDispatcher,
-        editorView,
-        onDestroy,
-        editorActions
-      } = editorSharedConfig;
-      if (eventDispatcher) {
-        eventDispatcher.destroy();
-      }
-      if (onDestroy) {
-        onDestroy();
-      }
-      editorActions._privateUnregisterEditor();
-      if (editorView) {
-        // Prevent any transactions from coming through when unmounting
-        editorView.setProps({
-          dispatchTransaction: _tr => {}
-        });
-
-        // Destroy plugin states and editor state
-        // when the editor is being unmounted
-        const editorState = editorView.state;
-        editorState.plugins.forEach(plugin => {
-          const state = plugin.getState(editorState);
-          if (state && state.destroy) {
-            state.destroy();
-          }
-        });
-        editorView.destroy();
-      }
-    };
-  }, [editorSharedConfig, featureFlags]);
-}

package/dist/es2019/labs/next/mobile.js

@@ -1,27 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React, { useCallback } from 'react';
-import { withAnalyticsEvents } from '@atlaskit/analytics-next';
-import { MobileAppearance } from '../../ui/AppearanceComponents/Mobile';
-import { EditorSharedConfigConsumer, Editor, EditorContent } from './Editor';
-import { useCreateAnalyticsHandler } from './internal/hooks/use-analytics';
-import { ContextAdapter } from '../../nodeviews/context-adapter';
-export function MobileEditor(props) {
-  const {
-    maxHeight,
-    createAnalyticsEvent,
-    disabled
-  } = props;
-  const handleAnalyticsEvent = useCreateAnalyticsHandler(createAnalyticsEvent);
-  const renderWithConfig = useCallback(config => {
-    return /*#__PURE__*/React.createElement(MobileAppearance, {
-      editorView: config && config.editorView,
-      maxHeight: maxHeight,
-      editorDisabled: disabled
-    }, /*#__PURE__*/React.createElement(EditorContent, null));
-  }, [maxHeight, disabled]);
-  return /*#__PURE__*/React.createElement(ContextAdapter, null, /*#__PURE__*/React.createElement(Editor, _extends({}, props, {
-    onAnalyticsEvent: handleAnalyticsEvent
-  }), /*#__PURE__*/React.createElement(EditorSharedConfigConsumer, null, renderWithConfig)));
-}
-MobileEditor.displayName = 'MobileEditor';
-export const Mobile = withAnalyticsEvents()(MobileEditor);

package/dist/es2019/labs/next/presets/cxhtml.js

@@ -1,106 +0,0 @@
-// #region Imports
-import React from 'react';
-
-//import { tablesPlugin } from '@atlaskit/editor-plugin-table';
-//
-//import {
-//  panelPlugin,
-//  listPlugin,
-//  textColorPlugin,
-//  breakoutPlugin,
-//  jiraIssuePlugin,
-//  extensionPlugin,
-//  rulePlugin,
-//  datePlugin,
-//  layoutPlugin,
-//  indentationPlugin,
-//  cardPlugin,
-//  statusPlugin,
-//  mediaPlugin,
-//  mentionsPlugin,
-//  tasksAndDecisionsPlugin,
-//  insertBlockPlugin,
-//  basePlugin,
-//  //placeholderPlugin,
-//} from '../../../plugins';
-import { PresetProvider } from '../Editor';
-import { useDefaultPreset } from './default';
-// #endregion
-
-export function useCXHTMLPreset({
-  mentionProvider,
-  mediaProvider,
-  placeholder,
-  featureFlags
-}) {
-  const [defaultPreset] = useDefaultPreset({
-    featureFlags,
-    paste: {}
-  });
-  const preset = defaultPreset;
-  //.add([
-  //  basePlugin,
-  //  {
-  //    allowInlineCursorTarget: true,
-  //    allowScrollGutter: {
-  //      getScrollElement: (_view) =>
-  //        document.querySelector('.fabric-editor-popup-scroll-parent') ||
-  //        null,
-  //    },
-  //  },
-  //])
-  //.add([tablesPlugin, { tableOptions: { advanced: true } }])
-  //.add([panelPlugin, { allowCustomPanel: true }])
-  //.add(listPlugin)
-  //.add(textColorPlugin)
-  //.add(breakoutPlugin)
-  //.add(jiraIssuePlugin)
-  //.add(extensionPlugin)
-  //.add(rulePlugin)
-  //.add(datePlugin)
-  //.add(layoutPlugin)
-  //.add(indentationPlugin)
-  //.add([cardPlugin, { allowBlockCards: true, platform: 'web' }])
-  //.add([statusPlugin, { menuDisabled: false }])
-  //.add(tasksAndDecisionsPlugin)
-  //.add(insertBlockPlugin)
-  ////.add([placeholderPlugin, { placeholder }])
-  //.maybeAdd(mentionsPlugin, (plugin, builder) => {
-  //  if (mentionProvider) {
-  //    return builder.add(plugin);
-  //  }
-  //  return builder;
-  //})
-  //.maybeAdd(mediaPlugin, (plugin, builder) => {
-  //  if (mediaProvider) {
-  //    preset.add([
-  //      plugin,
-  //      {
-  //        provider: mediaProvider,
-  //        allowMediaSingle: true,
-  //        allowMediaGroup: true,
-  //        allowResizing: true,
-  //        allowLinking: true,
-  //        allowResizingInTables: true,
-  //        allowAltTextOnImages: true,
-  //      },
-  //    ]);
-  //  }
-  //  return builder;
-  //});
-
-  return [preset];
-}
-export function EditorPresetCXHTML(props) {
-  const {
-    children,
-    excludes
-  } = props;
-  const [preset] = useCXHTMLPreset(props);
-  const plugins = preset.build({
-    excludePlugins: excludes
-  });
-  return /*#__PURE__*/React.createElement(PresetProvider, {
-    value: plugins
-  }, children);
-}

package/dist/es2019/labs/next/presets/mobile.js

@@ -1,118 +0,0 @@
-// #region Imports
-import React from 'react';
-import {
-// useProvider,
-useProviderFactory } from '@atlaskit/editor-common/provider-factory';
-//import analyticsPlugin from '../../../plugins/analytics';
-//import basePlugin from '../../../plugins/base';
-//import { cardPlugin } from '@atlaskit/editor-plugin-card';
-//import datePlugin from '../../../plugins/date';
-//import emojiPlugin from '../../../plugins/emoji';
-//import extensionPlugin from '../../../plugins/extension';
-//import layoutPlugin from '../../../plugins/layout';
-//import listPlugin from '../../../plugins/list';
-//import mentionsPlugin from '../../../plugins/mentions';
-//import mobileDimensionsPlugin from '../../../plugins/mobile-dimensions';
-//import panelPlugin from '../../../plugins/panel';
-//import placeholderPlugin from '../../../plugins/placeholder';
-//import rulePlugin from '../../../plugins/rule';
-//import statusPlugin from '../../../plugins/status';
-//import { tablesPlugin } from '@atlaskit/editor-plugin-table';
-//import tasksAndDecisionsPlugin from '../../../plugins/tasks-and-decisions';
-//import textColorPlugin from '../../../plugins/text-color';
-//import maxContentSizePlugin from '../../../plugins/max-content-size';
-//import expandPlugin from '../../../plugins/expand';
-//import selectionPlugin from '../../../plugins/selection';
-import { PresetProvider } from '../Editor';
-import { useDefaultPreset } from './default';
-import { addExcludesFromProviderFactory } from './utils';
-//import { quickInsertPlugin } from '../../../plugins';
-
-// #endregion
-export function useMobilePreset({
-  media,
-  placeholder,
-  maxContentSize,
-  createAnalyticsEvent,
-  featureFlags
-}) {
-  //const mediaProvider = useProvider('mediaProvider');
-  const [defaultPreset] = useDefaultPreset({
-    featureFlags,
-    paste: {}
-  });
-  const preset = defaultPreset;
-  //.add([
-  //  basePlugin,
-  //  {
-  //    allowScrollGutter: {
-  //      getScrollElement: () => document.body,
-  //      allowCustomScrollHandler: false,
-  //    },
-  //  },
-  //])
-  //.add([analyticsPlugin, createAnalyticsEvent])
-  //.add([tablesPlugin, { tableOptions: { allowControls: false } }])
-  //.add(panelPlugin)
-  //.add(listPlugin)
-  //.add(textColorPlugin)
-  //.add(extensionPlugin)
-  //.add(rulePlugin)
-  //.add(datePlugin)
-  //.add(layoutPlugin)
-  //.add([quickInsertPlugin, { headless: true, disableDefaultItems: true }])
-  //.add([statusPlugin, { menuDisabled: false }])
-  //.add([placeholderPlugin, { placeholder }])
-  //.add(mobileDimensionsPlugin)
-  //.add(expandPlugin)
-  ////.add([selectionPlugin, { useLongPressSelection: false }])
-  //// Begin -> This would be exclude if the provider doesnt exist in the factory
-  //.add(tasksAndDecisionsPlugin)
-  //.add([cardPlugin, { allowBlockCards: true, platform: 'mobile' }])
-  //.add(mentionsPlugin)
-  //.add(emojiPlugin)
-  //// End
-  //.maybeAdd(maxContentSizePlugin, (plugin, builder) => {
-  //  if (maxContentSize) {
-  //    return builder.add([plugin, maxContentSize as any]);
-  //  }
-  //  return builder;
-  //})
-  //.maybeAdd(mediaPlugin, (plugin, builder) => {
-  //  if (media) {
-  //    return builder.add([
-  //      plugin,
-  //      {
-  //        provider: mediaProvider,
-  //        customMediaPicker: media.picker,
-  //        fullWidthEnabled: false,
-  //        allowMediaSingle: true,
-  //        allowLazyLoading: false,
-  //        allowMediaSingleEditable: false,
-  //        allowRemoteDimensionsFetch: false,
-  //        allowMarkingUploadsAsIncomplete: true,
-  //        allowAltTextOnImages: true,
-  //        allowTemplatePlaceholders: { allowInserting: true },
-  //      },
-  //    ]);
-  //  }
-
-  //  return builder;
-  //});
-
-  return [preset];
-}
-export function EditorPresetMobile(props) {
-  const {
-    children,
-    excludes
-  } = props;
-  const [preset] = useMobilePreset(props);
-  const providerFactory = useProviderFactory();
-  const plugins = preset.build({
-    excludePlugins: addExcludesFromProviderFactory(providerFactory, excludes)
-  });
-  return /*#__PURE__*/React.createElement(PresetProvider, {
-    value: plugins
-  }, children);
-}

package/dist/es2019/labs/next/presets/utils.js

@@ -1,22 +0,0 @@
-export const addExcludesFromProviderFactory = (providerFactory, excludes = new Set()) => {
-  // TODO: Should I make this function pure?
-  if (!providerFactory.hasProvider('mentionProvider')) {
-    excludes.add('mention');
-  }
-  if (!providerFactory.hasProvider('emojiProvider')) {
-    excludes.add('emoji');
-  }
-  if (!providerFactory.hasProvider('macroProvider')) {
-    excludes.add('macro');
-  }
-  if (!providerFactory.hasProvider('autoformattingProvider')) {
-    excludes.add('customAutoformat');
-  }
-  if (!providerFactory.hasProvider('taskDecisionProvider')) {
-    excludes.add('taskDecision');
-  }
-  if (!providerFactory.hasProvider('cardProvider')) {
-    excludes.add('card');
-  }
-  return excludes;
-};