@atlaskit/editor-core 189.1.15 → 189.3.0

package/dist/esm/plugins/panel/index.js

@@ -1,209 +0,0 @@
-import React from 'react';
-import { panel, PanelType } from '@atlaskit/adf-schema';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { blockTypeMessages } from '@atlaskit/editor-common/messages';
-import { IconPanel, IconPanelError, IconPanelNote, IconPanelSuccess, IconPanelWarning } from '@atlaskit/editor-common/quick-insert';
-import { IconCustomPanel } from '@atlaskit/editor-common/quick-insert';
-import { createWrapSelectionTransaction } from '@atlaskit/editor-common/utils';
-import { T50 } from '@atlaskit/theme/colors';
-import { insertPanelWithAnalytics } from './actions';
-import keymap from './pm-plugins/keymaps';
-import { createPlugin } from './pm-plugins/main';
-import { getToolbarConfig } from './toolbar';
-var panelPlugin = function panelPlugin(_ref) {
-  var _ref$config = _ref.config,
-    options = _ref$config === void 0 ? {} : _ref$config,
-    api = _ref.api;
-  return {
-    name: 'panel',
-    nodes: function nodes() {
-      var panelNode = panel(!!options.allowCustomPanel);
-      return [{
-        name: 'panel',
-        node: panelNode
-      }];
-    },
-    pmPlugins: function pmPlugins() {
-      return [{
-        name: 'panel',
-        plugin: function plugin(_ref2) {
-          var providerFactory = _ref2.providerFactory,
-            dispatch = _ref2.dispatch;
-          return createPlugin(dispatch, providerFactory, options);
-        }
-      }, {
-        name: 'panelKeyMap',
-        plugin: function plugin() {
-          return keymap();
-        }
-      }];
-    },
-    actions: {
-      insertPanel: function insertPanel(inputMethod) {
-        var _api$analytics;
-        return insertPanelWithAnalytics(inputMethod, api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions);
-      }
-    },
-    pluginsOptions: {
-      quickInsert: function quickInsert(_ref3) {
-        var formatMessage = _ref3.formatMessage;
-        var quickInsertOptions = [{
-          id: 'infopanel',
-          title: formatMessage(blockTypeMessages.infoPanel),
-          keywords: ['panel'],
-          description: formatMessage(blockTypeMessages.infoPanelDescription),
-          priority: 800,
-          icon: function icon() {
-            return /*#__PURE__*/React.createElement(IconPanel, null);
-          },
-          action: function action(insert, state) {
-            return createPanelAction({
-              state: state,
-              attributes: {
-                panelType: PanelType.INFO
-              },
-              api: api
-            });
-          }
-        }, {
-          id: 'notepanel',
-          title: formatMessage(blockTypeMessages.notePanel),
-          description: formatMessage(blockTypeMessages.notePanelDescription),
-          priority: 1000,
-          icon: function icon() {
-            return /*#__PURE__*/React.createElement(IconPanelNote, null);
-          },
-          action: function action(insert, state) {
-            return createPanelAction({
-              state: state,
-              attributes: {
-                panelType: PanelType.NOTE
-              },
-              api: api
-            });
-          }
-        }, {
-          id: 'successpanel',
-          title: formatMessage(blockTypeMessages.successPanel),
-          description: formatMessage(blockTypeMessages.successPanelDescription),
-          keywords: ['tip'],
-          priority: 1000,
-          icon: function icon() {
-            return /*#__PURE__*/React.createElement(IconPanelSuccess, null);
-          },
-          action: function action(insert, state) {
-            return createPanelAction({
-              state: state,
-              attributes: {
-                panelType: PanelType.SUCCESS
-              },
-              api: api
-            });
-          }
-        }, {
-          id: 'warningpanel',
-          title: formatMessage(blockTypeMessages.warningPanel),
-          description: formatMessage(blockTypeMessages.warningPanelDescription),
-          priority: 1000,
-          icon: function icon() {
-            return /*#__PURE__*/React.createElement(IconPanelWarning, null);
-          },
-          action: function action(insert, state) {
-            return createPanelAction({
-              state: state,
-              attributes: {
-                panelType: PanelType.WARNING
-              },
-              api: api
-            });
-          }
-        }, {
-          id: 'errorpanel',
-          title: formatMessage(blockTypeMessages.errorPanel),
-          description: formatMessage(blockTypeMessages.errorPanelDescription),
-          priority: 1000,
-          icon: function icon() {
-            return /*#__PURE__*/React.createElement(IconPanelError, null);
-          },
-          action: function action(insert, state) {
-            return createPanelAction({
-              state: state,
-              attributes: {
-                panelType: PanelType.ERROR
-              },
-              api: api
-            });
-          }
-        }];
-        if (options.allowCustomPanel && options.allowCustomPanelEdit) {
-          quickInsertOptions.push({
-            id: 'custompanel',
-            title: formatMessage(blockTypeMessages.customPanel),
-            description: formatMessage(blockTypeMessages.customPanelDescription),
-            priority: 1000,
-            icon: function icon() {
-              return /*#__PURE__*/React.createElement(IconCustomPanel, null);
-            },
-            action: function action(insert, state) {
-              return createPanelAction({
-                state: state,
-                attributes: {
-                  panelType: PanelType.CUSTOM,
-                  panelIcon: ':rainbow:',
-                  panelIconId: '1f308',
-                  panelIconText: '🌈',
-                  // TODO: https://product-fabric.atlassian.net/browse/DSP-7268
-                  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-                  panelColor: T50
-                },
-                api: api
-              });
-            }
-          });
-        }
-        return quickInsertOptions;
-      },
-      floatingToolbar: function floatingToolbar(state, intl, providerFactory) {
-        return getToolbarConfig(state, intl, options, providerFactory, api);
-      }
-    }
-  };
-};
-
-/**
- * Creates panel action and wrap selection transaction with analytics for the panel insertion.
- *
- * @example
- * const tr = createPanelAction({
- *   state: editorState,
- *   attributes: { panelType: 'info' },
- * });
- * if (tr) {
- *   applyTransaction(tr);
- * }
- */
-function createPanelAction(_ref4) {
-  var state = _ref4.state,
-    attributes = _ref4.attributes,
-    api = _ref4.api;
-  var tr = createWrapSelectionTransaction({
-    state: state,
-    type: state.schema.nodes.panel,
-    nodeAttributes: attributes
-  });
-  if (tr) {
-    var _api$analytics2;
-    api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 || _api$analytics2.actions.attachAnalyticsEvent({
-      action: ACTION.INSERTED,
-      actionSubject: ACTION_SUBJECT.DOCUMENT,
-      actionSubjectId: ACTION_SUBJECT_ID.PANEL,
-      attributes: {
-        inputMethod: INPUT_METHOD.QUICK_INSERT,
-        panelType: attributes.panelType
-      },
-      eventType: EVENT_TYPE.TRACK
-    })(tr);
-  }
-  return tr;
-}
-export default panelPlugin;

package/dist/esm/plugins/panel/message.js

@@ -1,38 +0,0 @@
-import { defineMessages } from 'react-intl-next';
-export var messages = defineMessages({
-  info: {
-    id: 'fabric.editor.info',
-    defaultMessage: 'Info',
-    description: 'Panels provide a way to highlight text. The info panel has a blue background.'
-  },
-  note: {
-    id: 'fabric.editor.note',
-    defaultMessage: 'Note',
-    description: 'Panels provide a way to highlight text. The note panel has a purple background.'
-  },
-  success: {
-    id: 'fabric.editor.success',
-    defaultMessage: 'Success',
-    description: 'Panels provide a way to highlight text. The success panel has a green background.'
-  },
-  warning: {
-    id: 'fabric.editor.warning',
-    defaultMessage: 'Warning',
-    description: 'Panels provide a way to highlight text. The warning panel has a yellow background.'
-  },
-  error: {
-    id: 'fabric.editor.error',
-    defaultMessage: 'Error',
-    description: 'Panels provide a way to highlight text. The error panel has a red background.'
-  },
-  emoji: {
-    id: 'fabric.editor.panel.emoji',
-    defaultMessage: 'Add emoji',
-    description: 'Select the panel icon'
-  },
-  backgroundColor: {
-    id: 'fabric.editor.panel.backgroundColor',
-    defaultMessage: 'Background color',
-    description: 'Select the panel background color.'
-  }
-});

package/dist/esm/plugins/panel/nodeviews/panel.js

@@ -1,87 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import React from 'react';
-import ReactDOM from 'react-dom';
-import { PanelType } from '@atlaskit/adf-schema';
-import { Emoji } from '@atlaskit/editor-common/emoji';
-import { PanelErrorIcon, PanelInfoIcon, PanelNoteIcon, PanelSuccessIcon, PanelWarningIcon } from '@atlaskit/editor-common/icons';
-import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
-import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
-import { akEditorCustomIconSize } from '@atlaskit/editor-shared-styles/consts';
-import TipIcon from '@atlaskit/icon/glyph/editor/hint';
-import { panelAttrsToDom } from '../utils';
-export var panelIcons = {
-  info: PanelInfoIcon,
-  success: PanelSuccessIcon,
-  note: PanelNoteIcon,
-  tip: TipIcon,
-  warning: PanelWarningIcon,
-  error: PanelErrorIcon,
-  custom: PanelInfoIcon
-};
-export var PanelIcon = function PanelIcon(props) {
-  var allowCustomPanel = props.allowCustomPanel,
-    providerFactory = props.providerFactory,
-    _props$panelAttribute = props.panelAttributes,
-    panelType = _props$panelAttribute.panelType,
-    panelIcon = _props$panelAttribute.panelIcon,
-    panelIconId = _props$panelAttribute.panelIconId,
-    panelIconText = _props$panelAttribute.panelIconText;
-  if (allowCustomPanel && panelIcon && panelType === PanelType.CUSTOM) {
-    return /*#__PURE__*/React.createElement(Emoji, {
-      providers: providerFactory,
-      shortName: panelIcon,
-      id: panelIconId,
-      fallback: panelIconText,
-      showTooltip: false,
-      allowTextFallback: false,
-      fitToHeight: akEditorCustomIconSize
-    });
-  }
-  var Icon = panelIcons[panelType];
-  return /*#__PURE__*/React.createElement(Icon, {
-    label: "Panel ".concat(panelType)
-  });
-};
-var PanelNodeView = /*#__PURE__*/function () {
-  function PanelNodeView(node, view, getPos, pluginOptions, providerFactory) {
-    _classCallCheck(this, PanelNodeView);
-    this.providerFactory = providerFactory;
-    this.pluginOptions = pluginOptions;
-    this.view = view;
-    this.node = node;
-    var _DOMSerializer$render = DOMSerializer.renderSpec(document, panelAttrsToDom(node.attrs, pluginOptions.allowCustomPanel || false)),
-      dom = _DOMSerializer$render.dom,
-      contentDOM = _DOMSerializer$render.contentDOM;
-    this.getPos = getPos;
-    this.dom = dom;
-    this.contentDOM = contentDOM;
-    this.icon = this.dom.querySelector(".".concat(PanelSharedCssClassName.icon));
-    if (!this.icon) {
-      return;
-    }
-    // set contentEditable as false to be able to select the custom panels with keyboard
-    this.icon.contentEditable = 'false';
-    ReactDOM.render( /*#__PURE__*/React.createElement(PanelIcon, {
-      allowCustomPanel: pluginOptions.allowCustomPanel,
-      panelAttributes: node.attrs,
-      providerFactory: this.providerFactory
-    }), this.icon);
-  }
-  _createClass(PanelNodeView, [{
-    key: "ignoreMutation",
-    value: function ignoreMutation(mutation) {
-      // ignore mutation if it caused by the icon.
-      var isIcon = mutation.target === this.icon || mutation.target.parentNode === this.icon;
-      // ignore mutation if it caused by the lazy load emoji inside icon.
-      var isInsideIcon = this.icon.contains(mutation.target);
-      return isIcon || isInsideIcon;
-    }
-  }]);
-  return PanelNodeView;
-}();
-export var getPanelNodeView = function getPanelNodeView(pluginOptions, providerFactory) {
-  return function (node, view, getPos) {
-    return new PanelNodeView(node, view, getPos, pluginOptions, providerFactory);
-  };
-};

package/dist/esm/plugins/panel/pm-plugins/keymaps.js

@@ -1,74 +0,0 @@
-import { isEmptyNode } from '@atlaskit/editor-common/utils';
-import { keymap } from '@atlaskit/editor-prosemirror/keymap';
-import { findParentNodeOfType, hasParentNodeOfType, setTextSelection } from '@atlaskit/editor-prosemirror/utils';
-function findParentNode(selection, nodeType) {
-  var parentPosition = findParentNodeOfType(nodeType)(selection);
-  if (parentPosition) {
-    return parentPosition.node;
-  }
-  return null;
-}
-function isInsideAnEmptyNode(selection, nodeType, schema) {
-  var parentNode = findParentNode(selection, nodeType);
-  return parentNode && isEmptyNode(schema)(parentNode);
-}
-
-// Somewhat broken and subverted: https://product-fabric.atlassian.net/browse/ED-6504
-export function keymapPlugin() {
-  var deleteCurrentItem = function deleteCurrentItem($from, tr) {
-    return tr.delete($from.before($from.depth) - 1, $from.end($from.depth) + 1);
-  };
-  var keymaps = {
-    Backspace: function Backspace(state, dispatch) {
-      var _nodeBeforePanel$type;
-      var selection = state.selection,
-        nodes = state.schema.nodes,
-        tr = state.tr;
-      var panel = nodes.panel,
-        blockquote = nodes.blockquote;
-      var $from = selection.$from,
-        $to = selection.$to;
-      // Don't do anything if selection is a range
-      if ($from.pos !== $to.pos) {
-        return false;
-      }
-
-      // If not at the start of a panel, no joining will happen so allow default behaviour (backspacing characters etc..)
-      if ($from.parentOffset !== 0) {
-        return false;
-      }
-      var $previousPos = tr.doc.resolve(Math.max(0, $from.before($from.depth) - 1));
-      var previousNodeType = $previousPos.pos > 0 && $previousPos.parent && $previousPos.parent.type;
-      var parentNodeType = $from.parent.type;
-      var isPreviousNodeAPanel = previousNodeType === panel;
-      var isParentNodeAPanel = parentNodeType === panel;
-      var nodeBeforePanel = $previousPos === null || $previousPos === void 0 ? void 0 : $previousPos.nodeBefore;
-
-      // Stops merging panels when deleting empty paragraph in between
-      // Stops merging blockquotes with panels when deleting from start of blockquote
-
-      if (isPreviousNodeAPanel && !isParentNodeAPanel || isInsideAnEmptyNode(selection, panel, state.schema) || hasParentNodeOfType(blockquote)(selection) ||
-      // Lift line of panel content up and out of the panel, when backspacing
-      // at the start of a panel, if the node before the panel is an 'isolating' node
-      // (for e.g. a table, or an expand), otherwise the default prosemirror backspace
-      // behaviour will fallback to 'select node backward' logic because the node
-      // before is an isolating node.
-      nodeBeforePanel !== null && nodeBeforePanel !== void 0 && (_nodeBeforePanel$type = nodeBeforePanel.type) !== null && _nodeBeforePanel$type !== void 0 && (_nodeBeforePanel$type = _nodeBeforePanel$type.spec) !== null && _nodeBeforePanel$type !== void 0 && _nodeBeforePanel$type.isolating && hasParentNodeOfType(panel)(selection)) {
-        var content = $from.node($from.depth).content;
-        var insertPos = $previousPos.pos;
-        deleteCurrentItem($from, tr).insert(insertPos, content);
-        if (dispatch) {
-          dispatch(setTextSelection(insertPos)(tr).scrollIntoView());
-        }
-        return true;
-      }
-      var nodeType = $from.node().type;
-      if (nodeType !== panel) {
-        return false;
-      }
-      return true;
-    }
-  };
-  return keymap(keymaps);
-}
-export default keymapPlugin;

package/dist/esm/plugins/panel/pm-plugins/main.js

@@ -1,22 +0,0 @@
-import { PanelSharedCssClassName } from '@atlaskit/editor-common/panel';
-import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { createSelectionClickHandler } from '@atlaskit/editor-common/selection';
-import { getPanelNodeView } from '../nodeviews/panel';
-import { pluginKey } from '../types';
-export var createPlugin = function createPlugin(dispatch, providerFactory, pluginOptions) {
-  var _pluginOptions$useLon = pluginOptions.useLongPressSelection,
-    useLongPressSelection = _pluginOptions$useLon === void 0 ? false : _pluginOptions$useLon;
-  return new SafePlugin({
-    key: pluginKey,
-    props: {
-      nodeViews: {
-        panel: getPanelNodeView(pluginOptions, providerFactory)
-      },
-      handleClickOn: createSelectionClickHandler(['panel'], function (target) {
-        return !!target.closest(".".concat(PanelSharedCssClassName.prefix));
-      }, {
-        useLongPressSelection: useLongPressSelection
-      })
-    }
-  });
-};