@modusoperandi/licit 0.14.18 → 1.0.1

package/src/LinkSetURLCommand.js

@@ -1,103 +0,0 @@
-// @flow
-
-import { EditorState } from 'prosemirror-state';
-import { TextSelection } from 'prosemirror-state';
-import { Transform } from 'prosemirror-transform';
-import { EditorView } from 'prosemirror-view';
-
-import { MARK_LINK } from './MarkNames';
-import {
-  hideSelectionPlaceholder,
-  showSelectionPlaceholder,
-} from './SelectionPlaceholderPlugin';
-import { applyMark } from '@modusoperandi/licit-ui-commands';
-import { findNodesWithSameMark } from '@modusoperandi/licit-ui-commands';
-import LinkURLEditor from './ui/LinkURLEditor';
-import { UICommand } from '@modusoperandi/licit-doc-attrs-step';
-import { createPopUp } from '@modusoperandi/licit-ui-commands';
-
-class LinkSetURLCommand extends UICommand {
-  _popUp = null;
-
-  isEnabled = (state: EditorState): boolean => {
-    if (!(state.selection instanceof TextSelection)) {
-      // Could be a NodeSelection or CellSelection.
-      return false;
-    }
-
-    const markType = state.schema.marks[MARK_LINK];
-    if (!markType) {
-      return false;
-    }
-    const { from, to } = state.selection;
-    return from < to;
-  };
-
-  waitForUserInput = (
-    state: EditorState,
-    dispatch: ?(tr: Transform) => void,
-    view: ?EditorView,
-    event: ?SyntheticEvent<>
-  ): Promise<any> => {
-    if (this._popUp) {
-      return Promise.resolve(undefined);
-    }
-
-    if (dispatch) {
-      dispatch(showSelectionPlaceholder(state));
-    }
-
-    const { doc, schema, selection } = state;
-    const markType = schema.marks[MARK_LINK];
-    if (!markType) {
-      return Promise.resolve(undefined);
-    }
-    const { from, to } = selection;
-    const result = findNodesWithSameMark(doc, from, to, markType);
-    const href = result ? result.mark.attrs.href : null;
-    return new Promise((resolve) => {
-      this._popUp = createPopUp(
-        LinkURLEditor,
-        { href },
-        {
-          modal: true,
-          onClose: (val) => {
-            if (this._popUp) {
-              this._popUp = null;
-              resolve(val);
-            }
-          },
-        }
-      );
-    });
-  };
-
-  executeWithUserInput = (
-    state: EditorState,
-    dispatch: ?(tr: Transform) => void,
-    view: ?EditorView,
-    href: ?string
-  ): boolean => {
-    if (dispatch) {
-      const { selection, schema } = state;
-      let { tr } = state;
-      tr = view ? hideSelectionPlaceholder(view.state) : tr;
-      tr = tr.setSelection(selection);
-      if (href !== undefined) {
-        const markType = schema.marks[MARK_LINK];
-        const attrs = href ? { href } : null;
-        tr = applyMark(
-          tr.setSelection(state.selection),
-          schema,
-          markType,
-          attrs
-        );
-      }
-      dispatch(tr);
-    }
-    view && view.focus();
-    return true;
-  };
-}
-
-export default LinkSetURLCommand;

package/src/LinkTooltipPlugin.js

@@ -1,192 +0,0 @@
-// @flow
-
-import { EditorState, Plugin, PluginKey } from 'prosemirror-state';
-import { TextSelection } from 'prosemirror-state';
-import { EditorView } from 'prosemirror-view';
-
-import { MARK_LINK } from './MarkNames';
-import {
-  hideSelectionPlaceholder,
-} from './SelectionPlaceholderPlugin';
-import { applyMark } from '@modusoperandi/licit-ui-commands';
-import { findNodesWithSameMark } from '@modusoperandi/licit-ui-commands';
-import lookUpElement from './lookUpElement';
-import LinkTooltip from './ui/LinkTooltip';
-import LinkURLEditor from './ui/LinkURLEditor';
-import { atAnchorTopCenter } from '@modusoperandi/licit-ui-commands';
-import { createPopUp } from '@modusoperandi/licit-ui-commands';
-
-import '@modusoperandi/licit-ui-commands/dist/ui/czi-pop-up.css';
-
-// https://prosemirror.net/examples/tooltip/
-const SPEC = {
-  // [FS] IRAD-1005 2020-07-07
-  // Upgrade outdated packages.
-  key: new PluginKey('LinkTooltipPlugin'),
-  view(editorView: EditorView) {
-    return new LinkTooltipView(editorView);
-  },
-};
-
-class LinkTooltipPlugin extends Plugin {
-  constructor() {
-    super(SPEC);
-  }
-}
-
-class LinkTooltipView {
-  _anchorEl = null;
-  _popup = null;
-  _editor = null;
-
-  constructor(editorView: EditorView) {
-    this.update(editorView, null);
-  }
-
-  update(view: EditorView, lastState: EditorState): void {
-    if (view.readOnly) {
-      this.destroy();
-      return;
-    }
-
-    const { state } = view;
-    const { doc, selection, schema } = state;
-    const markType = schema.marks[MARK_LINK];
-    if (!markType) {
-      return;
-    }
-    const { from, to } = selection;
-    const result = findNodesWithSameMark(doc, from, to, markType);
-
-    if (!result) {
-      this.destroy();
-      return;
-    }
-    const domFound = view.domAtPos(from);
-    if (!domFound) {
-      this.destroy();
-      return;
-    }
-    const anchorEl = lookUpElement(domFound.node, (el) => el.nodeName === 'A');
-    if (!anchorEl) {
-      this.destroy();
-      return;
-    }
-
-    const popup = this._popup;
-    const viewPops = {
-      editorState: state,
-      editorView: view,
-      href: result.mark.attrs.href,
-      onCancel: this._onCancel,
-      onEdit: this._onEdit,
-      onRemove: this._onRemove,
-    };
-
-    if (popup && anchorEl === this._anchorEl) {
-      popup.update(viewPops);
-    } else {
-      popup && popup.close();
-      this._anchorEl = anchorEl;
-      this._popup = createPopUp(LinkTooltip, viewPops, {
-        anchor: anchorEl,
-        autoDismiss: false,
-        onClose: this._onClose,
-        position: atAnchorTopCenter,
-      });
-    }
-  }
-
-  destroy() {
-    this._popup && this._popup.close();
-    this._editor && this._editor.close();
-  }
-
-  _onCancel = (view: EditorView): void => {
-    this.destroy();
-    view.focus();
-  };
-
-  _onClose = (): void => {
-    this._anchorEl = null;
-    this._editor = null;
-    this._popup = null;
-  };
-
-  _onEdit = (view: EditorView): void => {
-    if (this._editor) {
-      return;
-    }
-
-    const { state } = view;
-    const { schema, doc, selection } = state;
-    const { from, to } = selection;
-    const markType = schema.marks[MARK_LINK];
-    const result = findNodesWithSameMark(doc, from, to, markType);
-    if (!result) {
-      return;
-    }
-
-    const href = result.mark.attrs.href;
-    this._editor = createPopUp(
-      LinkURLEditor,
-      { href },
-      {
-        onClose: (value) => {
-          this._editor = null;
-          this._onEditEnd(view, selection, value);
-        },
-      }
-    );
-  };
-
-  _onRemove = (view: EditorView): void => {
-    this._onEditEnd(view, view.state.selection, null);
-  };
-
-  _onEditEnd = (
-    view: EditorView,
-    initialSelection: TextSelection,
-    href: ?string
-  ): void => {
-    const { state, dispatch } = view;
-    let tr = hideSelectionPlaceholder(state);
-
-    if (href !== undefined) {
-      const { schema } = state;
-      const markType = schema.marks[MARK_LINK];
-      if (markType) {
-        const result = findNodesWithSameMark(
-          tr.doc,
-          initialSelection.from,
-          initialSelection.to,
-          markType
-        );
-        if (result) {
-          const linkSelection = TextSelection.create(
-            tr.doc,
-            result.from.pos,
-            result.to.pos + 1
-          );
-          tr = tr.setSelection(linkSelection);
-          const attrs = href ? { href } : null;
-          tr = applyMark(tr, schema, markType, attrs);
-
-          // [FS] IRAD-1005 2020-07-09
-          // Upgrade outdated packages.
-          // reset selection to original using the latest doc.
-          const origSelection = TextSelection.create(
-            tr.doc,
-            initialSelection.from,
-            initialSelection.to
-          );
-          tr = tr.setSelection(origSelection);
-        }
-      }
-    }
-    dispatch(tr);
-    view.focus();
-  };
-}
-
-export default LinkTooltipPlugin;

package/src/ListItemInsertNewLineCommand.js

@@ -1,55 +0,0 @@
-// @flow
-
-import { Fragment, Schema } from 'prosemirror-model';
-import { EditorState } from 'prosemirror-state';
-import { TextSelection } from 'prosemirror-state';
-import { Transform } from 'prosemirror-transform';
-import { findParentNodeOfType } from 'prosemirror-utils';
-import { EditorView } from 'prosemirror-view';
-
-import { HARD_BREAK, LIST_ITEM } from './NodeNames';
-import { UICommand } from '@modusoperandi/licit-doc-attrs-step';
-
-// This handles the case when user press SHIFT + ENTER key to insert a new line
-// into list item.
-function insertNewLine(tr: Transform, schema: Schema): Transform {
-  const { selection } = tr;
-  if (!selection) {
-    return tr;
-  }
-  const { from, empty } = selection;
-  if (!empty) {
-    return tr;
-  }
-  const br = schema.nodes[HARD_BREAK];
-  if (!br) {
-    return tr;
-  }
-  const blockquote = schema.nodes[LIST_ITEM];
-  const result = findParentNodeOfType(blockquote)(selection);
-  if (!result) {
-    return tr;
-  }
-  tr = tr.insert(from, Fragment.from(br.create()));
-  tr = tr.setSelection(TextSelection.create(tr.doc, from + 1, from + 1));
-  return tr;
-}
-
-class ListItemInsertNewLineCommand extends UICommand {
-  execute = (
-    state: EditorState,
-    dispatch: ?(tr: Transform) => void,
-    view: ?EditorView
-  ): boolean => {
-    const { schema, selection } = state;
-    const tr = insertNewLine(state.tr.setSelection(selection), schema);
-    if (tr.docChanged) {
-      dispatch && dispatch(tr);
-      return true;
-    } else {
-      return false;
-    }
-  };
-}
-
-export default ListItemInsertNewLineCommand;

package/src/ListItemMergeCommand.js

@@ -1,177 +0,0 @@
-// @flow
-
-import nullthrows from 'nullthrows';
-import { Fragment, Schema } from 'prosemirror-model';
-import { EditorState } from 'prosemirror-state';
-import { TextSelection } from 'prosemirror-state';
-import { Transform } from 'prosemirror-transform';
-import { findParentNodeOfType } from 'prosemirror-utils';
-import { EditorView } from 'prosemirror-view';
-
-import { HEADING, LIST_ITEM, PARAGRAPH } from './NodeNames';
-import nodeAt from './nodeAt';
-import { UICommand } from '@modusoperandi/licit-doc-attrs-step';
-
-function mergeListItemUp(tr: Transform, schema: Schema): Transform {
-  // This merge a list item to is previous list item of the selection is at the
-  // beginning of the list item.
-  const { selection } = tr;
-  if (!selection) {
-    return tr;
-  }
-  const nodeType = schema.nodes[LIST_ITEM];
-  if (!nodeType) {
-    return tr;
-  }
-  const { from, empty } = selection;
-  if (!empty) {
-    // Selection is collapsed.
-    return tr;
-  }
-  const result = findParentNodeOfType(nodeType)(selection);
-  if (!result) {
-    return tr;
-  }
-  const { pos, node } = result;
-  if (from !== pos + 2) {
-    // Selection is not at the begining of the list item.
-    return tr;
-  }
-  const $pos = tr.doc.resolve(pos);
-  const prevNode = $pos.nodeBefore;
-  if (!prevNode || prevNode.type !== nodeType) {
-    return tr;
-  }
-  if (node.childCount !== 1) {
-    // list item should only have one child (paragraph).
-    return tr;
-  }
-
-  const paragraphNode = node.firstChild;
-  const textNode = schema.text(' ');
-
-  // Delete the list item
-  tr = tr.delete(pos - 2, pos + node.nodeSize);
-  // Append extra space character to its previous list item.
-  tr = tr.insert(pos - 2, Fragment.from(textNode));
-  // Move the content to its previous list item.
-  tr = tr.insert(pos - 1, Fragment.from(paragraphNode.content));
-  tr = tr.setSelection(TextSelection.create(tr.doc, pos - 1, pos - 1));
-  return tr;
-}
-
-function mergeListItemDown(tr: Transform, schema: Schema): Transform {
-  // This merge a list item to is next list item of the selection is at the
-  // beginning of the list item.
-  const { selection } = tr;
-  if (!selection) {
-    return tr;
-  }
-  const listItem = schema.nodes[LIST_ITEM];
-  if (!listItem) {
-    return tr;
-  }
-  const { from, empty } = selection;
-  if (!empty) {
-    // Selection is collapsed.
-    return tr;
-  }
-  const result = findParentNodeOfType(listItem)(selection);
-  if (!result) {
-    return tr;
-  }
-  const { pos, node } = result;
-  if (from !== pos + node.content.size) {
-    // Selection is not at the begining of the list item.
-    return tr;
-  }
-
-  const $pos = tr.doc.resolve(pos);
-  const list = $pos.parent.type;
-  const listResult = findParentNodeOfType(list)(selection);
-  if (!listResult) {
-    return tr;
-  }
-  const nextFrom = pos + node.nodeSize;
-  let nextNode = nodeAt(tr.doc, nextFrom);
-  let deleteFrom = nextFrom;
-  if (listResult.start + listResult.node.content.size === nextFrom) {
-    // It's at the end of the last list item. It shall bring the content of the
-    // block after the list.
-    nextNode = nodeAt(tr.doc, nextFrom + 1);
-    deleteFrom += 1;
-  }
-
-  if (!nextNode) {
-    return tr;
-  }
-
-  let nextContent;
-
-  switch (nextNode.type) {
-    case listItem:
-      // List item should only have one child (paragraph).
-      const paragraphNode = nullthrows(nextNode.firstChild);
-      nextContent = Fragment.from(paragraphNode.content);
-      break;
-
-    case schema.nodes[HEADING]:
-    case schema.nodes[PARAGRAPH]:
-      // Will bring in the content of the next block.
-      nextContent = Fragment.from(nextNode.content);
-      break;
-  }
-
-  if (!nextContent) {
-    return tr;
-  }
-
-  const textNode = schema.text(' ');
-  // Delete the next node.
-  tr = tr.delete(deleteFrom, deleteFrom + nextNode.nodeSize);
-  // Append extra space character to its previous list item.
-  tr = tr.insert(nextFrom - 2, nextContent);
-  // Move the content to the list item.
-  tr = tr.insert(nextFrom - 2, Fragment.from(textNode));
-  tr = tr.setSelection(
-    TextSelection.create(tr.doc, nextFrom - 2, nextFrom - 2)
-  );
-  return tr;
-}
-
-class ListItemMergeCommand extends UICommand {
-  _direction = '';
-
-  constructor(direction: string) {
-    super();
-    this._direction = direction;
-  }
-
-  isActive = (state: EditorState): boolean => {
-    return false;
-  };
-
-  execute = (
-    state: EditorState,
-    dispatch: ?(tr: Transform) => void,
-    view: ?EditorView
-  ): boolean => {
-    const { selection, schema } = state;
-    let { tr } = state;
-    const direction = this._direction;
-    if (direction === 'down') {
-      tr = mergeListItemDown(tr.setSelection(selection), schema);
-    } else if (direction === 'up') {
-      tr = mergeListItemUp(tr.setSelection(selection), schema);
-    }
-
-    if (tr.docChanged) {
-      dispatch && dispatch(tr);
-      return true;
-    } else {
-      return false;
-    }
-  };
-}
-
-export default ListItemMergeCommand;

package/src/ListItemNodeSpec.js

@@ -1,52 +0,0 @@
-// @flow
-
-import { Node } from 'prosemirror-model';
-
-import type { NodeSpec } from './Types';
-
-export const ATTRIBUTE_LIST_STYLE_TYPE = 'data-list-style-type';
-
-const ALIGN_PATTERN = /(left|right|center|justify)/;
-
-function getAttrs(dom: HTMLElement) {
-  const attrs = {};
-  const { textAlign } = dom.style;
-  let align = dom.getAttribute('data-align') || textAlign || '';
-  align = ALIGN_PATTERN.test(align) ? align : null;
-
-  if (align) {
-    attrs.align = align;
-  }
-  return attrs;
-}
-
-const ListItemNodeSpec: NodeSpec = {
-  attrs: {
-    align: { default: null },
-  },
-
-  // NOTE:
-  // This spec does not support nested lists (e.g. `'paragraph block*'`)
-  // as content because of the complexity of dealing with indentation
-  // (context: https://github.com/ProseMirror/prosemirror/issues/92).
-  // content: '(bullet_list|paragraph)+',
-  content: 'paragraph block*',
-
-  parseDOM: [{ tag: 'li', getAttrs }],
-
-  // NOTE:
-  // This method only defines the minimum HTML attributes needed when the node
-  // is serialized to HTML string. Usually this is called when user copies
-  // the node to clipboard.
-  // The actual DOM rendering logic is defined at `src/ui/ListItemNodeView.js`.
-  toDOM(node: Node): Array<any> {
-    const attrs = {};
-    const { align } = node.attrs;
-    if (align) {
-      attrs['data-align'] = align;
-    }
-    return ['li', attrs, 0];
-  },
-};
-
-export default ListItemNodeSpec;

package/src/ListSplitCommand.js

@@ -1,32 +0,0 @@
-// @flow
-
-import { Schema } from 'prosemirror-model';
-import { EditorState } from 'prosemirror-state';
-import { Transform } from 'prosemirror-transform';
-import { EditorView } from 'prosemirror-view';
-
-import splitListItem from './splitListItem';
-import { UICommand } from '@modusoperandi/licit-doc-attrs-step';
-
-class ListSplitCommand extends UICommand {
-  constructor(schema: Schema) {
-    super();
-  }
-
-  execute = (
-    state: EditorState,
-    dispatch: ?(tr: Transform) => void,
-    view: ?EditorView
-  ): boolean => {
-    const { selection, schema } = state;
-    const tr = splitListItem(state.tr.setSelection(selection), schema);
-    if (tr.docChanged) {
-      dispatch && dispatch(tr);
-      return true;
-    } else {
-      return false;
-    }
-  };
-}
-
-export default ListSplitCommand;

package/src/ListToggleCommand.js

@@ -1,77 +0,0 @@
-// @flow
-
-import { EditorState } from 'prosemirror-state';
-import { Transform } from 'prosemirror-transform';
-import { findParentNodeOfType } from 'prosemirror-utils';
-import { EditorView } from 'prosemirror-view';
-
-import { BULLET_LIST, ORDERED_LIST, IMAGE } from './NodeNames';
-import { noop } from '@modusoperandi/licit-ui-commands';
-import { toggleList } from '@modusoperandi/licit-ui-commands';
-import { UICommand } from '@modusoperandi/licit-doc-attrs-step';
-import { isNodeSelectionForNodeType } from '@modusoperandi/licit-ui-commands';
-
-export class ListToggleCommand extends UICommand {
-  _ordered: boolean;
-  _orderedListType: string;
-
-  constructor(ordered: boolean, type: string) {
-    super();
-    this._ordered = ordered;
-    this._orderedListType = type;
-  }
-
-  isActive = (state: EditorState): boolean => {
-    let bOK = false;
-    if (this._ordered) {
-      bOK = !!this._findList(state, ORDERED_LIST);
-    } else {
-      bOK = !!this._findList(state, BULLET_LIST);
-    }
-    return bOK;
-  };
-
-  isEnabled = (state: EditorState, view: ?EditorView): boolean => {
-    let bOK = false;
-    bOK = hasImageNode(state);
-    return !bOK;
-  };
-
-  execute = (
-    state: EditorState,
-    dispatch: ?(tr: Transform) => void,
-    view: ?EditorView
-  ): boolean => {
-    const { selection, schema } = state;
-    const nodeType = schema.nodes[this._ordered ? ORDERED_LIST : BULLET_LIST];
-    let { tr } = state;
-    tr = tr.setSelection(selection);
-    if (!nodeType) {
-      return tr;
-    }
-    tr = toggleList(tr, schema, nodeType, this._orderedListType);
-    if (tr.docChanged) {
-      dispatch && dispatch(tr);
-      return true;
-    } else {
-      return false;
-    }
-  };
-
-  _findList(state: EditorState, type: string): ?Object {
-    const { nodes } = state.schema;
-    const list = nodes[type];
-    const findList = list ? findParentNodeOfType(list) : noop;
-    return findList(state.selection);
-  }
-
-
-}
-
-// [FS] IRAD-1317 2021-05-06
-// To disable the list menu in toolbar when select an image
-export function hasImageNode(state: EditorState) {
-  const { selection, schema } = state;
-  const imageNodeType = schema.nodes[IMAGE];
-  return imageNodeType && isNodeSelectionForNodeType(selection, imageNodeType);
-}

package/src/MarkNames.js

@@ -1,18 +0,0 @@
-// @flow
-
-// https://github.com/ProseMirror/prosemirror-schema-basic/blob/master/src/schema-basic.js
-export const MARK_CODE = 'code';
-export const MARK_EM = 'em';
-export const MARK_FONT_SIZE = 'mark-font-size';
-export const MARK_FONT_TYPE = 'mark-font-type';
-export const MARK_LINK = 'link';
-export const MARK_NO_BREAK = 'mark-no-break';
-export const MARK_STRIKE = 'strike';
-export const MARK_STRONG = 'strong';
-export const MARK_SUPER = 'super';
-export const MARK_SUB = 'sub';
-export const MARK_TEXT_COLOR = 'mark-text-color';
-export const MARK_TEXT_HIGHLIGHT = 'mark-text-highlight';
-export const MARK_TEXT_SELECTION = 'mark-text-selection';
-export const MARK_UNDERLINE = 'underline';
-export const MARK_SPACER = 'spacer';