@modusoperandi/licit 0.14.0 → 0.14.2

package/src/ImageFromURLCommand.js

@@ -1,14 +0,0 @@
-// @flow
-
-import * as React from 'react';
-
-import ImageSourceCommand from './ImageSourceCommand';
-import ImageURLEditor from './ui/ImageURLEditor';
-
-class ImageFromURLCommand extends ImageSourceCommand {
-  getEditor(): Class<React.Component<any, any>> {
-    return ImageURLEditor;
-  }
-}
-
-export default ImageFromURLCommand;

package/src/ImageNodeSpec.js

@@ -1,90 +0,0 @@
-// @flow
-
-import type { NodeSpec } from './Types';
-
-const CSS_ROTATE_PATTERN = /rotate\(([0-9\.]+)rad\)/i;
-const EMPTY_CSS_VALUE = new Set(['0%', '0pt', '0px']);
-
-function getAttrs(dom: HTMLElement) {
-  const { cssFloat, display, marginTop, marginLeft } = dom.style;
-  let { width, height } = dom.style;
-  let align = dom.getAttribute('data-align') || dom.getAttribute('align');
-  if (align) {
-    align = /(left|right|center)/.test(align) ? align : null;
-  } else if (cssFloat === 'left' && !display) {
-    align = 'left';
-  } else if (cssFloat === 'right' && !display) {
-    align = 'right';
-  } else if (!cssFloat && display === 'block') {
-    align = 'block';
-  }
-
-  width = width || dom.getAttribute('width');
-  height = height || dom.getAttribute('height');
-
-  let crop = null;
-  let rotate = null;
-  const { parentElement } = dom;
-  if (parentElement instanceof HTMLElement) {
-    // Special case for Google doc's image.
-    const ps = parentElement.style;
-    if (
-      ps.display === 'inline-block' &&
-      ps.overflow === 'hidden' &&
-      ps.width &&
-      ps.height &&
-      marginLeft &&
-      !EMPTY_CSS_VALUE.has(marginLeft) &&
-      marginTop &&
-      !EMPTY_CSS_VALUE.has(marginTop)
-    ) {
-      crop = {
-        width: parseInt(ps.width, 10) || 0,
-        height: parseInt(ps.height, 10) || 0,
-        left: parseInt(marginLeft, 10) || 0,
-        top: parseInt(marginTop, 10) || 0,
-      };
-    }
-    if (ps.transform) {
-      // example: `rotate(1.57rad) translateZ(0px)`;
-      const mm = ps.transform.match(CSS_ROTATE_PATTERN);
-      if (mm && mm[1]) {
-        rotate = parseFloat(mm[1]) || null;
-      }
-    }
-  }
-
-  return {
-    align,
-    alt: dom.getAttribute('alt') || null,
-    crop,
-    height: parseInt(height, 10) || null,
-    rotate,
-    src: dom.getAttribute('src') || null,
-    title: dom.getAttribute('title') || null,
-    width: parseInt(width, 10) || null,
-  };
-}
-
-// https://github.com/ProseMirror/prosemirror-schema-basic/blob/master/src/schema-basic.js
-const ImageNodeSpec: NodeSpec = {
-  inline: true,
-  attrs: {
-    align: { default: null },
-    alt: { default: '' },
-    crop: { default: null },
-    height: { default: null },
-    rotate: { default: null },
-    src: { default: null },
-    title: { default: '' },
-    width: { default: null },
-  },
-  group: 'inline',
-  draggable: true,
-  parseDOM: [{ tag: 'img[src]', getAttrs }],
-  toDOM(node) {
-    return ['img', node.attrs];
-  },
-};
-
-export default ImageNodeSpec;

package/src/ImageSourceCommand.js

@@ -1,117 +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 { EditorView } from 'prosemirror-view';
-import * as React from 'react';
-import {
-  hideCursorPlaceholder,
-  showCursorPlaceholder,
-} from './CursorPlaceholderPlugin';
-import { IMAGE } from './NodeNames';
-import { UICommand } from '@modusoperandi/licit-doc-attrs-step';
-import { createPopUp } from '@modusoperandi/licit-ui-commands';
-
-import type { ImageLike } from './Types';
-
-function insertImage(tr: Transform, schema: Schema, src: ?string): Transform {
-  const { selection } = tr;
-  if (!selection) {
-    return tr;
-  }
-  const { from, to } = selection;
-  if (from !== to) {
-    return tr;
-  }
-
-  const image = schema.nodes[IMAGE];
-  if (!image) {
-    return tr;
-  }
-
-  const attrs = {
-    src: src || '',
-    alt: '',
-    title: '',
-  };
-
-  const node = image.create(attrs, null, null);
-  const frag = Fragment.from(node);
-  tr = tr.insert(from, frag);
-  return tr;
-}
-
-class ImageSourceCommand extends UICommand {
-  _popUp = null;
-
-  getEditor(): Class<React.Component<any, any>> {
-    throw new Error('Not implemented');
-  }
-
-  isEnabled = (state: EditorState, view: ?EditorView): boolean => {
-    return this.__isEnabled(state, view);
-  };
-
-  waitForUserInput = (
-    state: EditorState,
-    dispatch: ?(tr: Transform) => void,
-    view: ?EditorView,
-    event: ?SyntheticEvent<>
-  ): Promise<any> => {
-    if (this._popUp) {
-      return Promise.resolve(undefined);
-    }
-
-    if (dispatch) {
-      dispatch(showCursorPlaceholder(state));
-    }
-
-    return new Promise((resolve) => {
-      const props = { runtime: view ? view.runtime : null };
-      this._popUp = createPopUp(this.getEditor(), props, {
-        modal: true,
-        onClose: (val) => {
-          if (this._popUp) {
-            this._popUp = null;
-            resolve(val);
-          }
-        },
-      });
-    });
-  };
-
-  executeWithUserInput = (
-    state: EditorState,
-    dispatch: ?(tr: Transform) => void,
-    view: ?EditorView,
-    inputs: ?ImageLike
-  ): boolean => {
-    if (dispatch) {
-      const { selection, schema } = state;
-      let { tr } = state;
-      tr = view ? hideCursorPlaceholder(view.state) : tr;
-      tr = tr.setSelection(selection);
-      if (inputs) {
-        const { src } = inputs;
-        tr = insertImage(tr, schema, src);
-      }
-      dispatch(tr);
-      view && view.focus();
-    }
-
-    return false;
-  };
-
-  __isEnabled = (state: EditorState, view: ?EditorView): boolean => {
-    const tr = state;
-    const { selection } = tr;
-    if (selection instanceof TextSelection) {
-      return selection.from === selection.to;
-    }
-    return false;
-  };
-}
-
-export default ImageSourceCommand;

package/src/ImageUploadCommand.js

@@ -1,36 +0,0 @@
-// @flow
-
-import { EditorState } from 'prosemirror-state';
-import { EditorView } from 'prosemirror-view';
-import * as React from 'react';
-
-import ImageSourceCommand from './ImageSourceCommand';
-import ImageUploadEditor from './ui/ImageUploadEditor';
-
-class ImageUploadCommand extends ImageSourceCommand {
-  isEnabled = (state: EditorState, view: ?EditorView): boolean => {
-    if (!view) {
-      return false;
-    }
-
-    const { runtime } = view;
-    if (!runtime) {
-      return false;
-    }
-
-    const { canUploadImage, uploadImage } = runtime;
-    if (!canUploadImage || !uploadImage) {
-      return false;
-    }
-    if (!canUploadImage()) {
-      return false;
-    }
-
-    return this.__isEnabled(state, view);
-  };
-
-  getEditor(): Class<React.Component<any, any>> {
-    return ImageUploadEditor;
-  }
-}
-export default ImageUploadCommand;

package/src/ui/ImageAlignEditor.js

@@ -1,60 +0,0 @@
-// @flow
-
-import './czi-inline-editor.css';
-import { CustomButton } from '@modusoperandi/licit-ui-commands';
-import * as React from 'react';
-
-const ImageAlignValues = {
-  NONE: {
-    value: null,
-    text: 'Inline',
-  },
-  LEFT: {
-    value: 'left',
-    text: 'Float left',
-  },
-  CENTER: {
-    value: 'center',
-    text: 'Center',
-  },
-  RIGHT: {
-    value: 'right',
-    text: 'Float right',
-  },
-};
-
-export type ImageInlineEditorValue = {
-  align: ?string,
-};
-
-class ImageInlineEditor extends React.PureComponent<any, any> {
-  props: {
-    onSelect: (val: ImageInlineEditorValue) => void,
-    value: ?ImageInlineEditorValue,
-  };
-
-  render(): React.Element<any> {
-    const align = this.props.value ? this.props.value.align : null;
-    const onClick = this._onClick;
-    const buttons = Object.keys(ImageAlignValues).map((key) => {
-      const { value, text } = ImageAlignValues[key];
-      return (
-        <CustomButton
-          active={align === value}
-          key={key}
-          label={text}
-          onClick={onClick}
-          value={value}
-        />
-      );
-    });
-
-    return <div className="czi-inline-editor custom-">{buttons}</div>;
-  }
-
-  _onClick = (align: ?string): void => {
-    this.props.onSelect({ align: align });
-  };
-}
-
-export default ImageInlineEditor;