@atlaskit/editor-core 181.0.0 → 182.0.0

package/dist/es2019/plugins/extension/extension-api.js

@@ -1,13 +1,13 @@
 import { validator } from '@atlaskit/adf-utils/validator';
 import { JSONTransformer } from '@atlaskit/editor-json-transformer';
 import { Fragment, Mark } from 'prosemirror-model';
-import { NodeSelection } from 'prosemirror-state';
+import { NodeSelection, Selection } from 'prosemirror-state';
 import { insertMacroFromMacroBrowser } from '../macro';
 import { pluginKey as macroPluginKey } from '../macro/plugin-key';
+import { nodeToJSON } from '../../utils';
 import { setEditingContextToContextPanel } from './commands';
-import { findNodePosWithLocalId, getSelectedExtension } from './utils';
+import { findNodePosWithLocalId, getDataConsumerMark, getNodeTypesReferenced, getSelectedExtension } from './utils';
 import { addAnalytics, ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '../analytics';
-import { getNodeTypesReferenced, getDataConsumerMark } from './utils';
 import { setTextSelection } from 'prosemirror-utils';
 export const getEditInLegacyMacroBrowser = ({
   view,
@@ -37,7 +37,18 @@ const extensionAPICallPayload = functionName => ({
   eventType: EVENT_TYPE.TRACK
 });
 export const createExtensionAPI = options => {
-  const validate = validator();
+  const {
+    editorView: {
+      state: {
+        schema
+      }
+    }
+  } = options;
+  const nodes = Object.keys(schema.nodes);
+  const marks = Object.keys(schema.marks);
+  const validate = validator(nodes, marks, {
+    allowPrivateAttributes: true
+  });
 
   /**
    * Finds the node and its position by `localId`. Throws if the node could not be found.
@@ -189,20 +200,20 @@ export const createExtensionAPI = options => {
         schema
       } = state;
       const changedValues = mutationCallback({
+        content: nodeToJSON(node).content,
         attrs: node.attrs,
         marks: node.marks.map(pmMark => ({
           type: pmMark.type.name,
           attrs: pmMark.attrs
         }))
       });
-      const {
-        parent
-      } = state.doc.resolve(pos);
       const ensureValidMark = mark => {
         if (typeof mark !== 'object' || Array.isArray(mark)) {
           throw new Error(`update(): Invalid mark given.`);
         }
-
+        const {
+          parent
+        } = state.doc.resolve(pos);
         // Ensure that the given mark is present in the schema
         const markType = schema.marks[mark.type];
         if (!markType) {
@@ -216,20 +227,27 @@ export const createExtensionAPI = options => {
           attrs: mark.attrs
         };
       };
-      const newMarks = (_changedValues$marks = changedValues.marks) === null || _changedValues$marks === void 0 ? void 0 : _changedValues$marks.map(ensureValidMark).map(({
+      const newMarks = changedValues.hasOwnProperty('marks') ? (_changedValues$marks = changedValues.marks) === null || _changedValues$marks === void 0 ? void 0 : _changedValues$marks.map(ensureValidMark).map(({
         mark,
         attrs
-      }) => mark.create(attrs));
+      }) => mark.create(attrs)) : node.marks;
+      const newContent = changedValues.hasOwnProperty('content') ? Fragment.fromJSON(schema, changedValues.content) : node.content;
+      const newAttrs = changedValues.hasOwnProperty('attrs') ? changedValues.attrs : node.attrs;
 
-      // Validate if the new attributes and marks result in a valid node and adf.
+      // Validate if the new attributes, content and marks result in a valid node and adf.
       try {
-        const newNode = node.type.createChecked(changedValues.attrs, node.content, newMarks);
+        const newNode = node.type.createChecked(newAttrs, newContent, newMarks);
         const newNodeAdf = new JSONTransformer().encodeNode(newNode);
         validate(newNodeAdf);
+        tr.replaceWith(pos, pos + node.nodeSize, newNode);
+
+        // Keep selection if content does not change
+        if (newContent === node.content) {
+          tr.setSelection(Selection.fromJSON(tr.doc, state.selection.toJSON()));
+        }
       } catch (err) {
         throw new Error(`update(): The given ADFEntity cannot be inserted in the current position.\n${err}`);
       }
-      tr.setNodeMarkup(pos, undefined, changedValues.attrs, newMarks);
 
       // Analytics - tracking the api call
       const apiCallPayload = extensionAPICallPayload('update');

package/dist/es2019/plugins/extension/pm-plugins/main.js

@@ -1,38 +1,11 @@
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { getExtensionModuleNode } from '@atlaskit/editor-common/extensions';
 import { createSelectionClickHandler } from '../../selection/utils';
 import ExtensionNodeView from '../nodeviews/extension';
 import { updateState, clearEditingContext } from '../commands';
 import { getSelectedExtension, getSelectedDomElement } from '../utils';
 import { createPluginState, getPluginState, createCommand } from '../plugin-factory';
 import { pluginKey } from '../plugin-key';
-const maybeGetUpdateMethodFromExtensionProvider = async (view, extensionProvider) => {
-  const nodeWithPos = getSelectedExtension(view.state, true);
-  if (!nodeWithPos) {
-    throw new Error('There is no selection');
-  }
-  const {
-    extensionType,
-    extensionKey
-  } = nodeWithPos.node.attrs;
-  const extensionModuleNode = await getExtensionModuleNode(extensionProvider, extensionType, extensionKey);
-  const newNodeWithPos = getSelectedExtension(view.state, true);
-  if (newNodeWithPos && newNodeWithPos.node.attrs.extensionType === extensionType && newNodeWithPos.node.attrs.extensionKey === extensionKey && newNodeWithPos.pos === nodeWithPos.pos && extensionModuleNode) {
-    return extensionModuleNode.update;
-  }
-};
-export const updateEditButton = async (view, extensionProvider) => {
-  try {
-    const updateMethod = await maybeGetUpdateMethodFromExtensionProvider(view, extensionProvider);
-    updateState({
-      showEditButton: !!updateMethod,
-      updateExtension: updateMethod && Promise.resolve(updateMethod) || undefined
-    })(view.state, view.dispatch);
-    return updateMethod;
-  } catch {
-    // this exception is not important for this case, fail silently
-  }
-};
+import { updateEditButton } from './utils';
 const shouldShowEditButton = (extensionHandler, extensionProvider) => {
   const usesLegacyMacroBrowser = !extensionHandler && !extensionProvider || typeof extensionHandler === 'function';
   const usesModernUpdateMethod = typeof extensionHandler === 'object' && typeof extensionHandler.update === 'function';
@@ -83,6 +56,75 @@ export const createContextIdentifierProviderHandler = view => async (name, provi
     }
   }
 };
+export const handleUpdate = ({
+  view,
+  prevState,
+  domAtPos,
+  extensionHandlers
+}) => {
+  const {
+    state,
+    dispatch
+  } = view;
+  const {
+    element,
+    localId,
+    extensionProvider,
+    showContextPanel,
+    showEditButton
+  } = getPluginState(state);
+
+  // This fetches the selected extension node, either by keyboard selection or click for all types of extensions
+  const selectedExtension = getSelectedExtension(state, true);
+  if (!selectedExtension) {
+    if (showContextPanel) {
+      clearEditingContext(state, dispatch);
+    }
+    return;
+  }
+  const {
+    node
+  } = selectedExtension;
+  const newElement = getSelectedDomElement(state.schema, domAtPos, selectedExtension);
+
+  // In some cases, showEditButton can be stale and the edit button doesn't show - @see ED-15285
+  // To be safe, we update the showEditButton state here
+  const shouldUpdateEditButton = !showEditButton && extensionProvider && element === newElement && !getSelectedExtension(prevState, true);
+  const isNewNodeSelected = node.attrs.localId ? localId !== node.attrs.localId :
+  // This is the current assumption and it's wrong but we are keeping it
+  // as fallback in case we need to turn off `allowLocalIdGeneration`
+  element !== newElement;
+  if (isNewNodeSelected || shouldUpdateEditButton) {
+    if (showContextPanel) {
+      clearEditingContext(state, dispatch);
+      return;
+    }
+    const {
+      extensionType
+    } = node.attrs;
+    const extensionHandler = extensionHandlers[extensionType];
+
+    // showEditButton might change async based on results from extension providers
+    const showEditButton = shouldShowEditButton(extensionHandler, extensionProvider);
+    const updateExtension = getUpdateExtensionPromise(view, extensionHandler, extensionProvider).catch(() => {
+      // do nothing;
+    });
+    updateState({
+      localId: node.attrs.localId,
+      showContextPanel: false,
+      element: newElement,
+      showEditButton,
+      updateExtension
+    })(state, dispatch);
+  }
+  // New DOM element doesn't necessarily mean it's a new Node
+  else if (element !== newElement) {
+    updateState({
+      element: newElement
+    })(state, dispatch);
+  }
+  return true;
+};
 const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, useLongPressSelection = false, options = {}) => {
   const state = createPluginState(dispatch, {
     showEditButton: false,
@@ -100,74 +142,13 @@ const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProvid
       providerFactory.subscribe('extensionProvider', extensionProviderHandler);
       providerFactory.subscribe('contextIdentificationProvider', contextIdentificationProviderHandler);
       return {
-        update: view => {
-          const {
-            state,
-            dispatch
-          } = view;
-          const {
-            element,
-            localId,
-            extensionProvider,
-            showContextPanel
-          } = getPluginState(state);
-
-          // This fetches the selected extension node, either by keyboard selection or click for all types of extensions
-          const selectedExtension = getSelectedExtension(state, true);
-          if (!selectedExtension) {
-            if (showContextPanel) {
-              clearEditingContext(state, dispatch);
-            }
-
-            // if an extension is no longer selected, but the plugin has cached the previous selected extension id/ref
-            // then this should clear those values so that if an exention is selected again, then this sees it as a change
-            // and updates the state correctly.
-            if (!!localId || !!element) {
-              updateState({
-                localId: undefined,
-                element: undefined
-              })(state, dispatch);
-            }
-            return;
-          }
-          const {
-            node
-          } = selectedExtension;
-          const newElement = getSelectedDomElement(state.schema, domAtPos, selectedExtension);
-
-          // New node is selection
-          if (node.attrs.localId ? localId !== node.attrs.localId :
-          // This is the current assumption and it's wrong but we are keeping it
-          // as fallback in case we need to turn off `allowLocalIdGeneration`
-          element !== newElement) {
-            if (showContextPanel) {
-              clearEditingContext(state, dispatch);
-            }
-            const {
-              extensionType
-            } = node.attrs;
-            const extensionHandler = extensionHandlers[extensionType];
-
-            // showEditButton might change async based on results from extension providers
-            const showEditButton = shouldShowEditButton(extensionHandler, extensionProvider);
-            const updateExtension = getUpdateExtensionPromise(view, extensionHandler, extensionProvider).catch(() => {
-              // do nothing;
-            });
-            updateState({
-              localId: node.attrs.localId,
-              showContextPanel: false,
-              element: newElement,
-              showEditButton,
-              updateExtension
-            })(state, dispatch);
-          }
-          // New DOM element doesn't necessarily mean it's a new Node
-          else if (element !== newElement) {
-            updateState({
-              element: newElement
-            })(state, dispatch);
-          }
-          return true;
+        update: (view, prevState) => {
+          handleUpdate({
+            view,
+            prevState,
+            domAtPos,
+            extensionHandlers
+          });
         },
         destroy: () => {
           providerFactory.unsubscribe('extensionProvider', extensionProviderHandler);

package/dist/es2019/plugins/extension/pm-plugins/utils.js

@@ -0,0 +1,30 @@
+import { getExtensionModuleNode } from '@atlaskit/editor-common/extensions';
+import { updateState } from '../commands';
+import { getSelectedExtension } from '../utils';
+const maybeGetUpdateMethodFromExtensionProvider = async (view, extensionProvider) => {
+  const nodeWithPos = getSelectedExtension(view.state, true);
+  if (!nodeWithPos) {
+    throw new Error('There is no selection');
+  }
+  const {
+    extensionType,
+    extensionKey
+  } = nodeWithPos.node.attrs;
+  const extensionModuleNode = await getExtensionModuleNode(extensionProvider, extensionType, extensionKey);
+  const newNodeWithPos = getSelectedExtension(view.state, true);
+  if (newNodeWithPos && newNodeWithPos.node.attrs.extensionType === extensionType && newNodeWithPos.node.attrs.extensionKey === extensionKey && newNodeWithPos.pos === nodeWithPos.pos && extensionModuleNode) {
+    return extensionModuleNode.update;
+  }
+};
+export const updateEditButton = async (view, extensionProvider) => {
+  try {
+    const updateMethod = await maybeGetUpdateMethodFromExtensionProvider(view, extensionProvider);
+    updateState({
+      showEditButton: !!updateMethod,
+      updateExtension: updateMethod && Promise.resolve(updateMethod) || undefined
+    })(view.state, view.dispatch);
+    return updateMethod;
+  } catch {
+    // this exception is not important for this case, fail silently
+  }
+};

package/dist/es2019/plugins/feature-flags-context/get-enabled-feature-flag-keys.js

@@ -1,8 +1 @@
-/**
- * Transforms FeatureFlags to a type safe string array of the enabled feature flags.
- *
- * Useful for analytics and analysis purposes.
- */
-export function getEnabledFeatureFlagKeys(featureFlags) {
-  return Object.keys(featureFlags).filter(key => featureFlags[key] === true);
-}
+export { getEnabledFeatureFlagKeys } from '@atlaskit/editor-common/normalize-feature-flags';

package/dist/es2019/plugins/find-replace/FindReplaceToolbarButtonWithState.js

@@ -5,7 +5,6 @@ import { cancelSearchWithAnalytics, replaceWithAnalytics, replaceAllWithAnalytic
 import { blur, toggleMatchCase } from './commands';
 import FindReplaceToolbarButton from './ui/FindReplaceToolbarButton';
 import { TRIGGER_METHOD } from '../analytics';
-import { getFeatureFlags } from '../feature-flags-context';
 const FindReplaceToolbarButtonWithState = props => {
   const {
     popupsBoundariesElement,
@@ -14,7 +13,8 @@ const FindReplaceToolbarButtonWithState = props => {
     isToolbarReducedSpacing,
     editorView,
     containerElement,
-    dispatchAnalyticsEvent
+    dispatchAnalyticsEvent,
+    featureFlags
   } = props;
   if (!editorView) {
     return null;
@@ -94,7 +94,7 @@ const FindReplaceToolbarButtonWithState = props => {
   };
   const {
     findReplaceMatchCase
-  } = getFeatureFlags(editorView.state);
+  } = featureFlags;
   return /*#__PURE__*/React.createElement(WithPluginState, {
     debounce: false,
     plugins: {

package/dist/es2019/plugins/find-replace/index.js

@@ -2,7 +2,9 @@ import React from 'react';
 import { createPlugin } from './plugin';
 import keymapPlugin from './keymap';
 import FindReplaceToolbarButtonWithState from './FindReplaceToolbarButtonWithState';
-export const findReplacePlugin = props => {
+export const findReplacePlugin = (props, api) => {
+  var _api$dependencies, _api$dependencies$fea;
+  const featureFlags = (api === null || api === void 0 ? void 0 : (_api$dependencies = api.dependencies) === null || _api$dependencies === void 0 ? void 0 : (_api$dependencies$fea = _api$dependencies.featureFlags) === null || _api$dependencies$fea === void 0 ? void 0 : _api$dependencies$fea.sharedState.currentState()) || {};
   return {
     name: 'findReplace',
     pmPlugins() {
@@ -36,7 +38,8 @@ export const findReplacePlugin = props => {
           editorView: editorView,
           containerElement: containerElement,
           dispatchAnalyticsEvent: dispatchAnalyticsEvent,
-          takeFullWidth: props.takeFullWidth
+          takeFullWidth: props.takeFullWidth,
+          featureFlags: featureFlags
         });
       }
     }