@atlaskit/editor-core 190.1.7 → 190.1.9

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

@@ -1,34 +0,0 @@
-import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { PluginKey } from '@atlaskit/editor-prosemirror/state';
-import { isAlignable } from '../commands';
-import { getActiveAlignment } from '../utils';
-export function createInitialPluginState(editorState, pluginConfig) {
-  return {
-    align: getActiveAlignment(editorState) || pluginConfig.align,
-    isEnabled: true
-  };
-}
-export const pluginKey = new PluginKey('alignmentPlugin');
-export function createPlugin(dispatch, pluginConfig) {
-  return new SafePlugin({
-    key: pluginKey,
-    state: {
-      init(_config, editorState) {
-        return createInitialPluginState(editorState, pluginConfig);
-      },
-      apply(_tr, state, _prevState, nextState) {
-        const nextPluginState = getActiveAlignment(nextState);
-        const isEnabled = isAlignable(nextPluginState)(nextState);
-        const newState = {
-          ...state,
-          align: nextPluginState,
-          isEnabled
-        };
-        if (nextPluginState !== state.align || isEnabled !== state.isEnabled) {
-          dispatch(pluginKey, newState);
-        }
-        return newState;
-      }
-    }
-  });
-}

package/dist/es2019/plugins/alignment/pm-plugins/types.js

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

package/dist/es2019/plugins/alignment/ui/ToolbarAlignment/icon-map.js

@@ -1,30 +0,0 @@
-import EditorAlignLeftIcon from '@atlaskit/icon/glyph/editor/align-left';
-import EditorAlignRightIcon from '@atlaskit/icon/glyph/editor/align-right';
-import EditorAlignCenterIcon from '@atlaskit/icon/glyph/editor/align-center';
-import { useIntl } from 'react-intl-next';
-import { messages } from './messages';
-import React from 'react';
-const iconAndMessageMap = {
-  start: {
-    Component: EditorAlignLeftIcon,
-    label: messages.alignLeft
-  },
-  end: {
-    Component: EditorAlignRightIcon,
-    label: messages.alignRight
-  },
-  center: {
-    Component: EditorAlignCenterIcon,
-    label: messages.alignCenter
-  }
-};
-export const IconMap = props => {
-  const {
-    Component,
-    label
-  } = iconAndMessageMap[props.alignment];
-  const intl = useIntl();
-  return /*#__PURE__*/React.createElement(Component, {
-    label: intl.formatMessage(label)
-  });
-};

package/dist/es2019/plugins/alignment/ui/ToolbarAlignment/index.js

@@ -1,140 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-/** @jsx jsx */
-import React from 'react';
-import { jsx } from '@emotion/react';
-import { injectIntl } from 'react-intl-next';
-import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
-import ToolbarButton from '../../../../ui/ToolbarButton';
-import { ArrowKeyNavigationType, DropdownContainer as Dropdown } from '@atlaskit/editor-common/ui-menu';
-import Alignment from '../../../../ui/Alignment';
-import { expandIconWrapper, triggerWrapper, wrapper } from './styles';
-import { separatorStyles } from '@atlaskit/editor-common/styles';
-import { IconMap } from './icon-map';
-import { messages } from './messages';
-export class AlignmentToolbar extends React.Component {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "toolbarItemRef", /*#__PURE__*/React.createRef());
-    _defineProperty(this, "state", {
-      isOpen: false
-    });
-    _defineProperty(this, "changeAlignment", (align, togglePopup) => {
-      if (togglePopup) {
-        this.toggleOpen();
-      }
-      return this.props.changeAlignment(align);
-    });
-    _defineProperty(this, "toggleOpen", () => {
-      this.setState({
-        isOpen: !this.state.isOpen
-      });
-    });
-    _defineProperty(this, "toggleOpenByKeyboard", event => {
-      if (event.key === 'Enter' || event.key === ' ') {
-        event.preventDefault();
-        this.setState({
-          isOpen: !this.state.isOpen
-        });
-      }
-    });
-    _defineProperty(this, "hide", attrs => {
-      if (this.state.isOpen) {
-        this.setState({
-          isOpen: false
-        });
-        if ((attrs === null || attrs === void 0 ? void 0 : attrs.event) instanceof KeyboardEvent && attrs.event.key === 'Escape') {
-          var _this$toolbarItemRef, _this$toolbarItemRef$;
-          (_this$toolbarItemRef = this.toolbarItemRef) === null || _this$toolbarItemRef === void 0 ? void 0 : (_this$toolbarItemRef$ = _this$toolbarItemRef.current) === null || _this$toolbarItemRef$ === void 0 ? void 0 : _this$toolbarItemRef$.focus();
-        }
-      }
-    });
-    _defineProperty(this, "hideOnEscape", () => {
-      var _this$toolbarItemRef2, _this$toolbarItemRef3;
-      this.hide();
-      (_this$toolbarItemRef2 = this.toolbarItemRef) === null || _this$toolbarItemRef2 === void 0 ? void 0 : (_this$toolbarItemRef3 = _this$toolbarItemRef2.current) === null || _this$toolbarItemRef3 === void 0 ? void 0 : _this$toolbarItemRef3.focus();
-    });
-  }
-  render() {
-    const {
-      isOpen
-    } = this.state;
-    const {
-      popupsMountPoint,
-      popupsBoundariesElement,
-      popupsScrollableElement,
-      isReducedSpacing,
-      pluginState,
-      disabled,
-      intl
-    } = this.props;
-    const title = intl.formatMessage(messages.alignment);
-    return jsx("span", {
-      css: wrapper
-    }, jsx(Dropdown, {
-      mountTo: popupsMountPoint,
-      boundariesElement: popupsBoundariesElement,
-      scrollableElement: popupsScrollableElement,
-      isOpen: isOpen,
-      handleClickOutside: event => {
-        if (event instanceof MouseEvent) {
-          this.hide({
-            isOpen: false,
-            event
-          });
-        }
-      },
-      handleEscapeKeydown: this.hideOnEscape,
-      arrowKeyNavigationProviderOptions: {
-        type: ArrowKeyNavigationType.MENU
-      },
-      fitWidth: 112,
-      fitHeight: 80,
-      closeOnTab: true,
-      trigger: jsx(ToolbarButton, {
-        spacing: isReducedSpacing ? 'none' : 'default',
-        disabled: disabled,
-        selected: isOpen,
-        title: title,
-        className: "align-btn",
-        "aria-label": title,
-        "aria-expanded": isOpen,
-        "aria-haspopup": true,
-        onClick: this.toggleOpen,
-        onKeyDown: this.toggleOpenByKeyboard,
-        iconBefore: jsx("div", {
-          css: triggerWrapper
-        }, jsx(IconMap, {
-          alignment: pluginState.align
-        }), jsx("span", {
-          css: expandIconWrapper
-        }, jsx(ExpandIcon, {
-          label: ""
-        }))),
-        ref: this.toolbarItemRef
-      })
-    }, jsx(Alignment, {
-      onClick: align => this.changeAlignment(align, false),
-      selectedAlignment: pluginState.align
-    })), jsx("span", {
-      css: separatorStyles
-    }));
-  }
-  componentDidUpdate(prevProps) {
-    if (this.state.isOpen) {
-      // by triggering the keyboard event with a setTimeout, we ensure that the tooltip
-      // associated with the alignment button doesn't render until the next render cycle
-      // where the popup will be correctly positioned and the relative position of the tooltip
-      // will not overlap with the button.
-      setTimeout(() => {
-        var _this$toolbarItemRef$2;
-        const keyboardEvent = new KeyboardEvent('keydown', {
-          bubbles: true,
-          key: 'ArrowDown'
-        });
-        (_this$toolbarItemRef$2 = this.toolbarItemRef.current) === null || _this$toolbarItemRef$2 === void 0 ? void 0 : _this$toolbarItemRef$2.dispatchEvent(keyboardEvent);
-      }, 0);
-    }
-  }
-}
-_defineProperty(AlignmentToolbar, "displayName", 'AlignmentToolbar');
-export default injectIntl(AlignmentToolbar);

package/dist/es2019/plugins/alignment/ui/ToolbarAlignment/messages.js

@@ -1,23 +0,0 @@
-import { defineMessages } from 'react-intl-next';
-export const messages = defineMessages({
-  alignment: {
-    id: 'fabric.editor.alignment',
-    defaultMessage: 'Text alignment',
-    description: 'Opens drop down menu of options to configure text alignment'
-  },
-  alignLeft: {
-    id: 'fabric.editor.alignLeft',
-    defaultMessage: 'Align left',
-    description: 'label stating that text is aligned left'
-  },
-  alignRight: {
-    id: 'fabric.editor.alignRight',
-    defaultMessage: 'Align Right',
-    description: 'label stating that text is aligned right'
-  },
-  alignCenter: {
-    id: 'fabric.editor.alignCenter',
-    defaultMessage: 'Align Center',
-    description: 'label stating that text is aligned center'
-  }
-});

package/dist/es2019/plugins/alignment/ui/ToolbarAlignment/styles.js

@@ -1,14 +0,0 @@
-import { css } from '@emotion/react';
-export const triggerWrapper = css`
-  display: flex;
-`;
-export const wrapper = css`
-  display: flex;
-  align-items: center;
-  div {
-    display: flex;
-  }
-`;
-export const expandIconWrapper = css`
-  margin-left: ${"var(--ds-space-negative-100, -8px)"};
-`;

package/dist/es2019/plugins/alignment/utils/index.js

@@ -1,15 +0,0 @@
-import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
-import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
-export const getActiveAlignment = state => {
-  if (state.selection instanceof CellSelection) {
-    const marks = [];
-    state.selection.forEachCell(cell => {
-      const mark = cell.firstChild.marks.filter(mark => mark.type === state.schema.marks.alignment)[0];
-      marks.push(mark ? mark.attrs.align : 'start');
-    });
-    return marks.every(mark => mark === marks[0]) ? marks[0] : 'start';
-  }
-  const node = findParentNodeOfType([state.schema.nodes.paragraph, state.schema.nodes.heading])(state.selection);
-  const getMark = node && node.node.marks.filter(mark => mark.type === state.schema.marks.alignment)[0];
-  return getMark && getMark.attrs.align || 'start';
-};

package/dist/es2019/plugins/data-consumer/index.js

@@ -1,11 +0,0 @@
-import { dataConsumer } from '@atlaskit/adf-schema';
-const dataConsumerMarkPlugin = () => ({
-  name: 'dataConsumerPlugin',
-  marks() {
-    return [{
-      name: 'dataConsumer',
-      mark: dataConsumer
-    }];
-  }
-});
-export default dataConsumerMarkPlugin;

package/dist/es2019/ui/Alignment/AlignmentButton/index.js

@@ -1,44 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import { PureComponent } from 'react';
-import ToolbarButton from '../../ToolbarButton';
-import { ToolTipContent, tooltip } from '../../../keymaps';
-import { getAriaKeyshortcuts } from '@atlaskit/editor-common/keymaps';
-class AlignmentButton extends PureComponent {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "onClick", e => {
-      const {
-        onClick,
-        value
-      } = this.props;
-
-      // detect if the click event comes from keyboard where screenX and screenY are 0
-      const isMouseEvent = e instanceof MouseEvent;
-      e.preventDefault();
-      onClick(value, isMouseEvent);
-    });
-  }
-  render() {
-    const {
-      label,
-      isSelected,
-      content,
-      shortcut
-    } = this.props;
-    return /*#__PURE__*/React.createElement(ToolbarButton, {
-      disabled: false,
-      selected: isSelected,
-      title: /*#__PURE__*/React.createElement(ToolTipContent, {
-        description: label,
-        keymap: shortcut
-      }),
-      "aria-label": shortcut ? tooltip(shortcut, label) : label,
-      "aria-pressed": isSelected,
-      "aria-keyshortcuts": getAriaKeyshortcuts(shortcut),
-      onClick: this.onClick,
-      iconBefore: content
-    });
-  }
-}
-export default AlignmentButton;

package/dist/es2019/ui/Alignment/index.js

@@ -1,54 +0,0 @@
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
-import { PureComponent } from 'react';
-import { injectIntl } from 'react-intl-next';
-import { IconMap } from '../../plugins/alignment/ui/ToolbarAlignment/icon-map';
-import AlignmentButton from './AlignmentButton';
-import { alignmentMessages } from '@atlaskit/editor-common/messages';
-import { alignmentWrapper } from './styles';
-import { alignLeft } from '../../keymaps';
-const alignmentOptions = [{
-  title: alignmentMessages.alignLeft,
-  shortcut: alignLeft,
-  value: 'start'
-}, {
-  title: alignmentMessages.alignCenter,
-  value: 'center'
-}, {
-  title: alignmentMessages.alignRight,
-  value: 'end'
-}];
-class Alignment extends PureComponent {
-  render() {
-    const {
-      onClick,
-      selectedAlignment,
-      className,
-      intl
-    } = this.props;
-    return jsx("div", {
-      "data-testid": "alignment-buttons",
-      css: alignmentWrapper,
-      className: className
-    }, alignmentOptions.map(alignment => {
-      const {
-        value,
-        title,
-        shortcut
-      } = alignment;
-      const message = intl.formatMessage(title);
-      return jsx(AlignmentButton, {
-        content: jsx(IconMap, {
-          alignment: value
-        }),
-        key: value,
-        value: value,
-        label: message,
-        shortcut: shortcut,
-        onClick: onClick,
-        isSelected: value === selectedAlignment
-      });
-    }));
-  }
-}
-export default injectIntl(Alignment);

package/dist/es2019/ui/Alignment/styles.js

@@ -1,7 +0,0 @@
-import { css } from '@emotion/react';
-export const alignmentWrapper = css`
-  padding: 0 ${"var(--ds-space-100, 8px)"};
-  display: flex;
-  flex-wrap: wrap;
-  max-width: ${3 * 32}px;
-`;

package/dist/esm/commands/index.js

@@ -1 +0,0 @@
-export { addParagraphAtEnd, createParagraphAtEnd, changeImageAlignment, createToggleBlockMarkOnRange, toggleBlockMark, clearEditorContent } from '@atlaskit/editor-common/commands';

package/dist/esm/plugins/alignment/commands/index.js

@@ -1,30 +0,0 @@
-import { toggleBlockMark, changeImageAlignment } from '../../../commands';
-import { cascadeCommands } from '../../../utils/action';
-export var isAlignable = function isAlignable(align) {
-  return function (state, dispatch) {
-    var _state$schema = state.schema,
-      _state$schema$nodes = _state$schema.nodes,
-      paragraph = _state$schema$nodes.paragraph,
-      heading = _state$schema$nodes.heading,
-      alignment = _state$schema.marks.alignment;
-    return toggleBlockMark(alignment, function () {
-      return !align ? undefined : align === 'start' ? false : {
-        align: align
-      };
-    }, [paragraph, heading])(state, dispatch);
-  };
-};
-export var changeAlignment = function changeAlignment(align) {
-  return function (state, dispatch) {
-    var _state$schema2 = state.schema,
-      _state$schema2$nodes = _state$schema2.nodes,
-      paragraph = _state$schema2$nodes.paragraph,
-      heading = _state$schema2$nodes.heading,
-      alignment = _state$schema2.marks.alignment;
-    return cascadeCommands([changeImageAlignment(align), toggleBlockMark(alignment, function () {
-      return !align ? undefined : align === 'start' ? false : {
-        align: align
-      };
-    }, [paragraph, heading])])(state, dispatch);
-  };
-};

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

@@ -1,63 +0,0 @@
-import React from 'react';
-import { alignment } from '@atlaskit/adf-schema';
-import WithPluginState from '../../ui/WithPluginState';
-import { pluginKey, createPlugin } from './pm-plugins/main';
-import { changeAlignment as _changeAlignment } from './commands';
-import ToolbarAlignment from './ui/ToolbarAlignment';
-import { keymapPlugin } from './pm-plugins/keymap';
-export var defaultConfig = {
-  align: 'start'
-};
-var alignmentPlugin = function alignmentPlugin() {
-  return {
-    name: 'alignment',
-    marks: function marks() {
-      return [{
-        name: 'alignment',
-        mark: alignment
-      }];
-    },
-    pmPlugins: function pmPlugins() {
-      return [{
-        name: 'alignmentPlugin',
-        plugin: function plugin(_ref) {
-          var dispatch = _ref.dispatch;
-          return createPlugin(dispatch, defaultConfig);
-        }
-      }, {
-        name: 'annotationKeymap',
-        plugin: function plugin() {
-          return keymapPlugin();
-        }
-      }];
-    },
-    primaryToolbarComponent: function primaryToolbarComponent(_ref2) {
-      var editorView = _ref2.editorView,
-        popupsMountPoint = _ref2.popupsMountPoint,
-        popupsBoundariesElement = _ref2.popupsBoundariesElement,
-        popupsScrollableElement = _ref2.popupsScrollableElement,
-        disabled = _ref2.disabled,
-        isToolbarReducedSpacing = _ref2.isToolbarReducedSpacing;
-      return /*#__PURE__*/React.createElement(WithPluginState, {
-        plugins: {
-          align: pluginKey
-        },
-        render: function render(_ref3) {
-          var align = _ref3.align;
-          return /*#__PURE__*/React.createElement(ToolbarAlignment, {
-            pluginState: align,
-            isReducedSpacing: isToolbarReducedSpacing,
-            changeAlignment: function changeAlignment(align) {
-              return _changeAlignment(align)(editorView.state, editorView.dispatch);
-            },
-            disabled: disabled || !align.isEnabled,
-            popupsMountPoint: popupsMountPoint,
-            popupsBoundariesElement: popupsBoundariesElement,
-            popupsScrollableElement: popupsScrollableElement
-          });
-        }
-      });
-    }
-  };
-};
-export default alignmentPlugin;

package/dist/esm/plugins/alignment/pm-plugins/keymap.js

@@ -1,8 +0,0 @@
-import { keymap } from '@atlaskit/editor-prosemirror/keymap';
-import { bindKeymapWithCommand, alignLeft } from '../../../keymaps';
-import { changeAlignment } from '../commands';
-export function keymapPlugin() {
-  var list = {};
-  bindKeymapWithCommand(alignLeft.common, changeAlignment('start'), list);
-  return keymap(list);
-}

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

@@ -1,36 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { PluginKey } from '@atlaskit/editor-prosemirror/state';
-import { isAlignable } from '../commands';
-import { getActiveAlignment } from '../utils';
-export function createInitialPluginState(editorState, pluginConfig) {
-  return {
-    align: getActiveAlignment(editorState) || pluginConfig.align,
-    isEnabled: true
-  };
-}
-export var pluginKey = new PluginKey('alignmentPlugin');
-export function createPlugin(dispatch, pluginConfig) {
-  return new SafePlugin({
-    key: pluginKey,
-    state: {
-      init: function init(_config, editorState) {
-        return createInitialPluginState(editorState, pluginConfig);
-      },
-      apply: function apply(_tr, state, _prevState, nextState) {
-        var nextPluginState = getActiveAlignment(nextState);
-        var isEnabled = isAlignable(nextPluginState)(nextState);
-        var newState = _objectSpread(_objectSpread({}, state), {}, {
-          align: nextPluginState,
-          isEnabled: isEnabled
-        });
-        if (nextPluginState !== state.align || isEnabled !== state.isEnabled) {
-          dispatch(pluginKey, newState);
-        }
-        return newState;
-      }
-    }
-  });
-}

package/dist/esm/plugins/alignment/pm-plugins/types.js

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

package/dist/esm/plugins/alignment/ui/ToolbarAlignment/icon-map.js

@@ -1,29 +0,0 @@
-import EditorAlignLeftIcon from '@atlaskit/icon/glyph/editor/align-left';
-import EditorAlignRightIcon from '@atlaskit/icon/glyph/editor/align-right';
-import EditorAlignCenterIcon from '@atlaskit/icon/glyph/editor/align-center';
-import { useIntl } from 'react-intl-next';
-import { messages } from './messages';
-import React from 'react';
-var iconAndMessageMap = {
-  start: {
-    Component: EditorAlignLeftIcon,
-    label: messages.alignLeft
-  },
-  end: {
-    Component: EditorAlignRightIcon,
-    label: messages.alignRight
-  },
-  center: {
-    Component: EditorAlignCenterIcon,
-    label: messages.alignCenter
-  }
-};
-export var IconMap = function IconMap(props) {
-  var _iconAndMessageMap$pr = iconAndMessageMap[props.alignment],
-    Component = _iconAndMessageMap$pr.Component,
-    label = _iconAndMessageMap$pr.label;
-  var intl = useIntl();
-  return /*#__PURE__*/React.createElement(Component, {
-    label: intl.formatMessage(label)
-  });
-};