@atlaskit/editor-core 178.1.0 → 178.1.2

package/dist/es2019/plugins/floating-toolbar/ui/Toolbar.js

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import React from 'react';
 import { css, jsx } from '@emotion/react';
@@ -47,19 +46,16 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
     switch (item.type) {
       case 'button':
         const ButtonIcon = item.icon;
-
         const onClickHandler = () => {
           if (item.confirmDialog) {
             dispatchCommand(showConfirmDialog(idx));
           } else {
             dispatchCommand(item.onClick);
-
             if (item.focusEditoronEnter && !(editorView !== null && editorView !== void 0 && editorView.hasFocus())) {
               editorView === null || editorView === void 0 ? void 0 : editorView.focus();
             }
           }
         };
-
         return jsx(Button, {
           className: item.className,
           key: idx,
@@ -83,7 +79,6 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
           ariaHasPopup: item.ariaHasPopup,
           tabIndex: item.tabIndex
         }, item.showTitle && item.title);
-
       case 'input':
         return jsx(Input, {
           key: idx,
@@ -94,12 +89,10 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
           onSubmit: value => dispatchCommand(item.onSubmit(value)),
           onBlur: value => dispatchCommand(item.onBlur(value))
         });
-
       case 'custom':
         {
           return item.render(editorView, idx, dispatchAnalyticsEvent);
         }
-
       case 'dropdown':
         const DropdownIcon = item.icon;
         return jsx(Dropdown, {
@@ -122,7 +115,6 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
           editorView: editorView,
           setDisableParentScroll: scrollable ? setDisableScroll : undefined
         });
-
       case 'select':
         if (item.selectType === 'list') {
           const ariaLabel = item.title || item.placeholder;
@@ -143,7 +135,6 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
             classNamePrefix: 'floating-toolbar-select'
           });
         }
-
         if (item.selectType === 'color') {
           return jsx(ColorPickerButton, {
             key: idx,
@@ -158,7 +149,6 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
             setDisableParentScroll: scrollable ? setDisableScroll : undefined
           });
         }
-
         if (item.selectType === 'emoji') {
           return jsx(EmojiPickerButton, {
             key: idx,
@@ -171,22 +161,17 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
             setDisableParentScroll: scrollable ? setDisableScroll : undefined
           });
         }
-
         return null;
-
       case 'extensions-placeholder':
         if (!editorView || !extensionsProvider) {
           return null;
         }
-
         const {
           extendFloatingToolbar
         } = getFeatureFlags(editorView.state) || {};
-
         if (!extendFloatingToolbar) {
           return null;
         }
-
         return jsx(ExtensionsPlaceholder, {
           key: idx,
           node: node,
@@ -194,7 +179,6 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
           extensionProvider: extensionsProvider,
           separator: item.separator
         });
-
       case 'separator':
         return jsx(Separator, {
           key: idx
@@ -204,13 +188,11 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
 }, (prevProps, nextProps) => {
   if (!nextProps.node) {
     return false;
-  } // only rerender toolbar items if the node is different
+  }
+  // only rerender toolbar items if the node is different
   // otherwise it causes an issue where multiple popups stays open
-
-
   return !(prevProps.node.type !== nextProps.node.type || prevProps.node.attrs.localId !== nextProps.node.attrs.localId || !areSameItems(prevProps.items, nextProps.items) || !prevProps.mounted !== !nextProps.mounted);
 });
-
 const toolbarContainer = (theme, scrollable, hasSelect, firstElementIsSelect) => css`
   background-color: ${themed({
   light: "var(--ds-surface-overlay, white)",
@@ -239,7 +221,6 @@ const toolbarContainer = (theme, scrollable, hasSelect, firstElementIsSelect) =>
         `}
       `}
 `;
-
 const toolbarOverflow = (scrollable, scrollDisabled, firstElementIsSelect) => css`
   ${scrollable ? css`
         ${scrollDisabled ? css`
@@ -266,50 +247,37 @@ const toolbarOverflow = (scrollable, scrollDisabled, firstElementIsSelect) => cs
         display: flex;
       `}
 `;
-
 function makeSameType(_a, _b) {
   return true;
 }
-
 const compareItemWithKeys = (leftItem, rightItem, excludedKeys = []) => Object.keys(leftItem).filter(key => excludedKeys.indexOf(key) === -1).every(key => leftItem[key] instanceof Object ? shallowEqual(leftItem[key], rightItem[key]) : leftItem[key] === rightItem[key]);
-
 export const isSameItem = (leftItem, rightItem) => {
   if (leftItem.type !== rightItem.type) {
     return false;
   }
-
   switch (leftItem.type) {
     case 'button':
       // Need to typecast `rightItem as typeof leftItem` otherwise we will
       // have to put the `type !==` inside each case.
       return compareItemWithKeys(leftItem, rightItem, ['type', 'onClick', 'onMouseEnter', 'onMouseLeave']);
-
     case 'copy-button':
       return compareItemWithKeys(leftItem, rightItem, ['type', 'items']);
-
     case 'input':
       return compareItemWithKeys(leftItem, rightItem, ['type', 'onSubmit', 'onBlur']);
-
     case 'select':
       if (makeSameType(leftItem, rightItem) && Array.isArray(leftItem.options) && Array.isArray(rightItem.options) && !compareArrays(leftItem.options, rightItem.options, (left, right) => compareItemWithKeys(left, right))) {
         return false;
       }
-
       return compareItemWithKeys(leftItem, rightItem, ['type', 'onChange', 'options']);
-
     case 'dropdown':
       if (makeSameType(leftItem, rightItem) && Array.isArray(leftItem.options) && Array.isArray(rightItem.options) && !compareArrays(leftItem.options, rightItem.options, (left, right) => compareItemWithKeys(left, right, ['onClick']))) {
         return false;
       }
-
       return compareItemWithKeys(leftItem, rightItem, ['type', 'options']);
-
     case 'custom':
       return false;
-
     case 'separator':
       return compareItemWithKeys(leftItem, rightItem);
-
     case 'extensions-placeholder':
       return compareItemWithKeys(leftItem, rightItem);
   }
@@ -318,48 +286,38 @@ export const areSameItems = (leftArr, rightArr) => {
   if (leftArr === undefined && rightArr === undefined) {
     return true;
   }
-
   if (leftArr === undefined || rightArr === undefined) {
     return false;
   }
-
   if (leftArr.length !== rightArr.length) {
     return false;
   }
-
   return leftArr.every((item, index) => isSameItem(rightArr[index], item));
 };
-
 class Toolbar extends Component {
   constructor(props) {
     super(props);
-
     _defineProperty(this, "shouldHandleArrowKeys", () => {
       var _this$props$items;
-
       //To prevent the keydown handling of arrow keys for custom toolbar items with 'disableArrowNavigation' prop enabled,
       //Usually the button which has menus or popups
       return !((_this$props$items = this.props.items) !== null && _this$props$items !== void 0 && _this$props$items.find(item => item.type === 'custom' && item.disableArrowNavigation));
     });
-
     _defineProperty(this, "handleEscape", event => {
       var _this$props$editorVie;
-
       // If any menu is open inside the floating toolbar 'Esc' key should not
       // focus the editorview.
       // Event can't be stopped as they are not childnodes of floating toolbar
+
       const isDropdownOpen = !!document.querySelector('[data-role="droplistContent"]');
       const isSelectMenuOpen = !!document.querySelector('.floating-toolbar-select__menu');
-
       if (isDropdownOpen || isSelectMenuOpen) {
         return;
       }
-
       (_this$props$editorVie = this.props.editorView) === null || _this$props$editorVie === void 0 ? void 0 : _this$props$editorVie.focus();
       event.preventDefault();
       event.stopPropagation();
     });
-
     this.scrollContainerRef = /*#__PURE__*/React.createRef();
     this.mountRef = /*#__PURE__*/React.createRef();
     this.toolbarContainerRef = /*#__PURE__*/React.createRef();
@@ -367,10 +325,9 @@ class Toolbar extends Component {
       scrollDisabled: false,
       mounted: false
     };
-  } // remove any decorations added by toolbar buttons i.e danger and selected styling
+  }
+  // remove any decorations added by toolbar buttons i.e danger and selected styling
   // this prevents https://product-fabric.atlassian.net/browse/ED-10207
-
-
   resetStyling({
     table
   }) {
@@ -378,19 +335,17 @@ class Toolbar extends Component {
       const {
         state,
         dispatch
-      } = this.props.editorView; // tables use their own decorations
+      } = this.props.editorView;
+      // tables use their own decorations
       // TODO fix for tables https://product-fabric.atlassian.net/jira/servicedesk/projects/DTR/queues/issue/DTR-617
-
       if (table) {
         return null;
       }
-
       dispatch(state.tr.setMeta(decorationStateKey, {
         action: ACTIONS.DECORATION_REMOVE
       }));
     }
   }
-
   setDisableScroll(disabled) {
     // wait before setting disabled state incase users jumping from one popup to another
     if (disabled) {
@@ -405,13 +360,11 @@ class Toolbar extends Component {
       });
     }
   }
-
   componentDidMount() {
     this.setState({
       mounted: true
     });
   }
-
   componentDidUpdate(prevProps) {
     if (this.props.node !== prevProps.node) {
       this.resetStyling({
@@ -419,13 +372,11 @@ class Toolbar extends Component {
       });
     }
   }
-
   componentWillUnmount() {
     this.resetStyling({
       table: this.props.node.type.name === 'table'
     });
   }
-
   render() {
     const {
       items,
@@ -434,20 +385,17 @@ class Toolbar extends Component {
       intl,
       scrollable
     } = this.props;
-
     if (!items || !items.length) {
       return null;
-    } // Select has left padding of 4px to the border, everything else 8px
-
+    }
 
+    // Select has left padding of 4px to the border, everything else 8px
     const firstElementIsSelect = items[0].type === 'select';
     const hasSelect = items.find(item => item.type === 'select' && item.selectType === 'list');
-
     const isShortcutToFocusToolbar = event => {
       //Alt + F10 to reach first element in this floating toolbar
       return event.altKey && (event.key === 'F10' || event.keyCode === 121);
     };
-
     return jsx(React.Fragment, null, jsx(ToolbarArrowKeyNavigationProvider, {
       editorView: this.props.editorView,
       handleEscape: this.handleEscape,
@@ -482,7 +430,5 @@ class Toolbar extends Component {
       ref: this.mountRef
     })));
   }
-
 }
-
 export default injectIntl(Toolbar);

package/dist/es2019/plugins/floating-toolbar/ui/ToolbarLoader.js

@@ -1,7 +1,6 @@
 import Loadable from 'react-loadable';
 export const ToolbarLoader = Loadable({
-  loader: () => import(
-  /* webpackChunkName: "@atlaskit-internal_editor-core-floating-toolbar" */
+  loader: () => import( /* webpackChunkName: "@atlaskit-internal_editor-core-floating-toolbar" */
   './Toolbar').then(mod => mod.default),
   loading: () => null
 });

package/dist/es2019/plugins/floating-toolbar/ui/styles.js

@@ -32,7 +32,6 @@ const color = {
     }
   }
 };
-
 const getStyles = (property, {
   appearance = 'default',
   state = 'default',
@@ -41,14 +40,11 @@ const getStyles = (property, {
   if (!property[appearance] || !property[appearance][state]) {
     return 'initial';
   }
-
   return property[appearance][state][mode];
 };
-
 export const iconOnlySpacing = {
   '&&': {
     padding: '0px',
-
     /**
       Increased specificity here because css for .hyperlink-open-link defined in
       packages/editor/editor-core/src/ui/ContentStyles/index.tsx file

package/dist/es2019/plugins/floating-toolbar/utils.js

@@ -2,48 +2,39 @@ export const shallowEqual = (objA, objB) => {
   if (objA === objB) {
     return true;
   }
-
   if (objA == null || objB == null) {
     return false;
   }
-
   const keysA = Object.keys(objA);
   const keysB = Object.keys(objB);
-
   if (keysA.length !== keysB.length) {
     return false;
   }
-
   const bHasOwnProperty = Object.prototype.hasOwnProperty.bind(objB);
-
   for (let idx = 0; idx < keysA.length; idx++) {
     const key = keysA[idx];
-
     if (!bHasOwnProperty(key)) {
       return false;
     }
-
     if (objA[key] !== objB[key]) {
       return false;
     }
   }
-
   return true;
 };
 export const compareArrays = (left, right, compareFn = shallowEqual) => {
   if (left.length !== right.length) {
     return false;
   }
-
   for (let idx = 0; idx < left.length; idx++) {
     if (!compareFn(left[idx], right[idx])) {
       return false;
     }
   }
-
   return true;
-}; // find node in descendants by condition
+};
 
+// find node in descendants by condition
 export function findNode(parent, predicate) {
   let matchedNode;
   parent.descendants(node => {
@@ -51,12 +42,10 @@ export function findNode(parent, predicate) {
     if (matchedNode) {
       return false;
     }
-
     if (predicate(node)) {
       matchedNode = node;
       return false;
     }
-
     return true;
   });
   return matchedNode;
@@ -65,7 +54,6 @@ export function getFocusableElements(rootNode) {
   if (!rootNode) {
     return [];
   }
-
   const focusableModalElements = rootNode.querySelectorAll('a[href], button:not([disabled]), textarea, input, select') || [];
   return Array.from(focusableModalElements) || [];
 }

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

@@ -7,17 +7,14 @@ export function createPlugin() {
     key: pluginKey
   });
 }
-
 const fragmentMarkPlugin = () => ({
   name: 'fragmentPlugin',
-
   marks() {
     return [{
       name: 'fragment',
       mark: fragment
     }];
   },
-
   pmPlugins() {
     return [{
       name: 'fragmentMarkConsistency',
@@ -26,7 +23,5 @@ const fragmentMarkPlugin = () => ({
       }) => createFragmentMarkConsistencyPlugin(dispatch)
     }];
   }
-
 });
-
 export default fragmentMarkPlugin;

package/dist/es2019/plugins/fragment/pm-plugins/fragment-consistency.js

@@ -12,15 +12,14 @@ import { PluginKey } from 'prosemirror-state';
 import { uuid } from '@atlaskit/adf-schema';
 import { stepAddsOneOf } from '../../../utils/step';
 const pluginKey = new PluginKey('fragmentMarkConsistencyPlugin');
+
 /**
  * Traverses a transaction's steps to see if we're inserting a node which supports a fragment mark
  */
-
 const checkIsAddingSupportedNode = (schema, transaction) => {
   const nodesSupportingFragmentMark = getNodesSupportingFragmentMark(schema);
   return transaction.steps.some(step => nodesSupportingFragmentMark.some(nodeType => stepAddsOneOf(step, new Set([nodeType]))));
 };
-
 const getNodesSupportingFragmentMark = schema => {
   const {
     table,
@@ -30,7 +29,6 @@ const getNodesSupportingFragmentMark = schema => {
   } = schema.nodes;
   return [table, extension, bodiedExtension, inlineExtension];
 };
-
 const regenerateFragmentIdIfNeeded = ({
   transaction,
   schema,
@@ -44,45 +42,38 @@ const regenerateFragmentIdIfNeeded = ({
   let transactionChanged = false;
   doc.descendants((node, pos) => {
     const isSupportedNode = nodesSupportingFragmentMark.some(supportedNode => node.type === supportedNode);
-
     if (!isSupportedNode) {
       // continue traversing
       return true;
     }
-
     const existingFragmentMark = node.marks.find(mark => mark.type === fragment);
-
     if (!existingFragmentMark) {
       // continue traversing
       return true;
     }
-
     if (shouldRegenerateLocalId(existingFragmentMark.attrs.localId)) {
       transactionChanged = true;
       transaction.setNodeMarkup(pos, undefined, node.attrs, node.marks.map(mark => {
         if (mark.type === fragment) {
           mark.attrs.localId = uuid.generate();
         }
-
         return mark;
       }));
     }
+
     /**
      * Continue traversing, as we can encounter inline extension nodes pretty much anywhere
      */
-
-
     return true;
   });
   return {
     transactionChanged
   };
 };
+
 /**
  * Ensures presence of `fragment` mark on certain node types and the uniqueness of their `localId` attributes
  */
-
-
 export const createPlugin = dispatch => new SafePlugin({
   key: pluginKey,
   appendTransaction: (transactions, _oldState, newState) => {
@@ -90,27 +81,22 @@ export const createPlugin = dispatch => new SafePlugin({
     const tr = newState.tr;
     transactions.forEach(transaction => {
       const fragmentLocalIdsObserved = new Set();
-
       if (!transaction.docChanged) {
         return;
-      } // Don't interfere with cut as it clashes with fixTables & we don't need
-      // to handle any extra cut cases in this plugin
-
+      }
 
+      // Don't interfere with cut as it clashes with fixTables & we don't need
+      // to handle any extra cut cases in this plugin
       const uiEvent = transaction.getMeta('uiEvent');
-
       if (uiEvent === 'cut') {
         return;
       }
-      /** Check if we're actually inserting a supported node, otherwise we can ignore this tr */
-
 
+      /** Check if we're actually inserting a supported node, otherwise we can ignore this tr */
       const isAddingSupportedNode = checkIsAddingSupportedNode(newState.schema, transaction);
-
       if (!isAddingSupportedNode) {
         return;
       }
-
       const {
         transactionChanged
       } = regenerateFragmentIdIfNeeded({
@@ -121,21 +107,17 @@ export const createPlugin = dispatch => new SafePlugin({
           if (fragmentLocalIdsObserved.has(localId)) {
             return true;
           }
-
           fragmentLocalIdsObserved.add(localId);
           return false;
         }
       });
-
       if (transactionChanged) {
         modified = true;
       }
     });
-
     if (modified) {
       return tr;
     }
-
     return;
   }
 });

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

@@ -21,29 +21,23 @@ export const createDisplayGrid = eventDispatcher => {
 };
 export const gridTypeForLayout = layout => layout === 'wrap-left' || layout === 'wrap-right' ? 'wrapped' : 'full';
 const sides = ['left', 'right'];
-
 const overflowHighlight = (highlights, side, start, size) => {
   if (!highlights.length) {
     return false;
   }
-
   const minHighlight = highlights.reduce((prev, cur) => Math.min(prev, cur));
   const maxHighlight = highlights.reduce((prev, cur) => Math.max(prev, cur));
-
   if (side === 'left') {
     return minHighlight < 0 && minHighlight <= -start && (typeof size === 'number' ? minHighlight >= -(start + size) : true);
   } else {
     return maxHighlight > GRID_SIZE && maxHighlight >= GRID_SIZE + start && (typeof size === 'number' ? maxHighlight <= GRID_SIZE + size : true);
   }
 };
-
 const gutterGridLines = (editorMaxWidth, editorWidth, highlights, shouldCalcBreakoutGridLines) => {
   const gridLines = [];
-
   if (!shouldCalcBreakoutGridLines) {
     return gridLines;
   }
-
   const wideSpacing = (editorMaxWidth * breakoutWideScaleRatio - editorMaxWidth) / 2;
   sides.forEach(side => {
     gridLines.push( /*#__PURE__*/React.createElement("div", {
@@ -65,11 +59,9 @@ const gutterGridLines = (editorMaxWidth, editorWidth, highlights, shouldCalcBrea
   });
   return gridLines;
 };
-
 const lineLengthGridLines = highlights => {
   const gridLines = [];
   const gridSpacing = 100 / GRID_SIZE;
-
   for (let i = 0; i <= GRID_SIZE; i++) {
     const style = {
       paddingLeft: `${gridSpacing}%`
@@ -80,10 +72,8 @@ const lineLengthGridLines = highlights => {
       style: i < GRID_SIZE ? style : undefined
     }));
   }
-
   return gridLines;
 };
-
 class Grid extends React.Component {
   render() {
     const {
@@ -107,11 +97,8 @@ class Grid extends React.Component {
       }
     }, gridLines));
   }
-
 }
-
 const ThemedGrid = withTheme(Grid);
-
 const gridPlugin = options => ({
   name: 'grid',
   contentComponent: ({
@@ -131,7 +118,6 @@ const gridPlugin = options => ({
         if (!grid) {
           return null;
         }
-
         return /*#__PURE__*/React.createElement(ThemedGrid, _extends({
           shouldCalcBreakoutGridLines: options && options.shouldCalcBreakoutGridLines,
           editorWidth: widthState.width,
@@ -141,6 +127,5 @@ const gridPlugin = options => ({
     });
   }
 });
-
 export default gridPlugin;
 export { GRID_GUTTER } from './styles';

package/dist/es2019/plugins/help-dialog/commands.js

@@ -1,12 +1,10 @@
 import { pluginKey } from './plugin-key';
 export const openHelpCommand = (tr, dispatch) => {
   tr = tr.setMeta(pluginKey, true);
-
   if (dispatch) {
     dispatch(tr);
     return true;
   }
-
   return false;
 };
 export const closeHelpCommand = (tr, dispatch) => {