@modusoperandi/licit 0.14.0 → 0.14.2

package/src/ui/ImageURLEditor.js

@@ -1,119 +0,0 @@
-// @flow
-
-import * as React from 'react';
-import PropTypes from 'prop-types';
-
-import { CustomButton } from '@modusoperandi/licit-ui-commands';
-import { preventEventDefault } from '@modusoperandi/licit-ui-commands';
-import resolveImage from './resolveImage';
-
-import './czi-form.css';
-import './czi-image-url-editor.css';
-
-class ImageURLEditor extends React.PureComponent<any, any> {
-  _img = null;
-  _unmounted = false;
-
-  // [FS] IRAD-1005 2020-07-07
-  // Upgrade outdated packages.
-  // To take care of the property type declaration.
-  static propsTypes = {
-    initialValue: PropTypes.object,
-    close: function (props: any, propName: string) {
-      const fn = props[propName];
-      if (
-        !fn.prototype ||
-        (typeof fn.prototype.constructor !== 'function' &&
-          fn.prototype.constructor.length !== 1)
-      ) {
-        return new Error(
-          propName + 'must be a function with 1 arg of type ImageLike'
-        );
-      }
-      return null;
-    },
-  };
-
-  state = {
-    ...(this.props.initialValue || {}),
-    validValue: null,
-  };
-
-  componentWillUnmount(): void {
-    this._unmounted = true;
-  }
-
-  render(): React.Element<any> {
-    const { src, validValue } = this.state;
-    const preview = validValue ? (
-      <div
-        className="czi-image-url-editor-input-preview"
-        style={{ backgroundImage: `url(${String(validValue.src)}` }}
-      />
-    ) : null;
-
-    return (
-      <div className="czi-image-url-editor">
-        <form className="czi-form" onSubmit={preventEventDefault}>
-          <fieldset>
-            <legend>Insert Image</legend>
-            <div className="czi-image-url-editor-src-input-row">
-              <input
-                autoFocus={true}
-                className="czi-image-url-editor-src-input"
-                onChange={this._onSrcChange}
-                placeholder="Paste URL of Image..."
-                type="text"
-                value={src || ''}
-              />
-              {preview}
-            </div>
-            <em>
-              Only select image that you have confirmed the license to use
-            </em>
-          </fieldset>
-          <div className="czi-form-buttons">
-            <CustomButton label="Cancel" onClick={this._cancel} />
-            <CustomButton
-              active={!!validValue}
-              disabled={!validValue}
-              label="Insert"
-              onClick={this._insert}
-            />
-          </div>
-        </form>
-      </div>
-    );
-  }
-
-  _onSrcChange = (e: SyntheticInputEvent<>) => {
-    const src = e.target.value;
-    this.setState(
-      {
-        src,
-        validValue: null,
-      },
-      this._didSrcChange
-    );
-  };
-
-  _didSrcChange = (): void => {
-    resolveImage(this.state.src).then((result) => {
-      if (this.state.src === result.src && !this._unmounted) {
-        const validValue = result.complete ? result : null;
-        this.setState({ validValue });
-      }
-    });
-  };
-
-  _cancel = (): void => {
-    this.props.close();
-  };
-
-  _insert = (): void => {
-    const { validValue } = this.state;
-    this.props.close(validValue);
-  };
-}
-
-export default ImageURLEditor;

package/src/ui/ImageUploadEditor.js

@@ -1,117 +0,0 @@
-// @flow
-
-import cx from 'classnames';
-import * as React from 'react';
-
-import { CustomButton } from '@modusoperandi/licit-ui-commands';
-import LoadingIndicator from './LoadingIndicator';
-import { preventEventDefault } from '@modusoperandi/licit-ui-commands';
-import uuid from './uuid';
-
-import './czi-form.css';
-import './czi-image-upload-editor.css';
-
-import type { EditorRuntime, ImageLike } from '../Types';
-
-class ImageUploadEditor extends React.PureComponent<any, any> {
-  _img = null;
-  _unmounted = false;
-
-  props: {
-    runtime: ?EditorRuntime,
-    close: (val: ?ImageLike) => void,
-  };
-
-  state = {
-    error: null,
-    id: uuid(),
-    pending: false,
-  };
-
-  componentWillUnmount(): void {
-    this._unmounted = true;
-  }
-
-  render(): React.Element<any> {
-    const { id, error, pending } = this.state;
-    const className = cx('czi-image-upload-editor', { pending, error });
-    let label = 'Choose an image file...';
-
-    if (pending) {
-      label = <LoadingIndicator />;
-    } else if (error) {
-      label = 'Something went wrong, please try again';
-    }
-
-    return (
-      <div className={className}>
-        <form className="czi-form" onSubmit={preventEventDefault}>
-          <fieldset>
-            <legend>Upload Image</legend>
-            <div className="czi-image-upload-editor-body">
-              <div className="czi-image-upload-editor-label">{label}</div>
-              <input
-                accept="image/png,image/gif,image/jpeg,image/jpg"
-                className="czi-image-upload-editor-input"
-                disabled={pending}
-                id={id}
-                key={id}
-                onChange={this._onSelectFile}
-                type="file"
-              />
-            </div>
-          </fieldset>
-          <div className="czi-form-buttons">
-            <CustomButton label="Cancel" onClick={this._cancel} />
-          </div>
-        </form>
-      </div>
-    );
-  }
-
-  _onSelectFile = (event: SyntheticInputEvent<>): void => {
-    const file = event.target.files && event.target.files[0];
-    if (file && typeof file === 'object') {
-      this._upload(file);
-    }
-  };
-
-  _onSuccess = (image: ImageLike): void => {
-    if (this._unmounted) {
-      return;
-    }
-    this.props.close(image);
-  };
-
-  _onError = (error: Error): void => {
-    if (this._unmounted) {
-      return;
-    }
-    this.setState({
-      error,
-      id: uuid(),
-      pending: false,
-    });
-  };
-
-  _upload = async (file: Object): Promise<void> => {
-    try {
-      const runtime = this.props.runtime || {};
-      const { canUploadImage, uploadImage } = runtime;
-      if (!canUploadImage || !uploadImage || !canUploadImage()) {
-        throw new Error('feature is not available');
-      }
-      this.setState({ pending: true, error: null });
-      const image = await uploadImage(file);
-      this._onSuccess(image);
-    } catch (ex) {
-      this._onError(ex);
-    }
-  };
-
-  _cancel = (): void => {
-    this.props.close();
-  };
-}
-
-export default ImageUploadEditor;