@operato/ocr 0.2.52 → 0.3.1

package/dist/src/ox-camera-capturer.d.ts

@@ -1,16 +0,0 @@
-import '@material/mwc-icon';
-import { LitElement } from 'lit';
-export declare class CameraCapturer extends LitElement {
-    static styles: import("lit").CSSResult[];
-    multiple?: boolean;
-    accept?: string;
-    label?: string;
-    hideFileList: boolean;
-    attachFileList: boolean;
-    _files?: File[];
-    render(): import("lit-html").TemplateResult<1>;
-    firstUpdated(): void;
-    fileInput: HTMLInputElement;
-    get files(): File[] | undefined;
-    reset(): void;
-}

package/dist/src/ox-camera-capturer.js

@@ -1,191 +0,0 @@
-import { __decorate } from "tslib";
-import '@material/mwc-icon';
-import { css, html, LitElement } from 'lit';
-import { customElement, property, query, state } from 'lit/decorators.js';
-import { FileDropHelper } from './utils/file-drop-helper';
-let CameraCapturer = class CameraCapturer extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.hideFileList = false;
-        this.attachFileList = false;
-    }
-    render() {
-        var files = this._files || [];
-        return html `
-      <mwc-icon>camera</mwc-icon>
-      <span>Capture image or drop files here!</span>
-      <input
-        id="input-file"
-        type="file"
-        accept=${this.accept}
-        ?multiple=${this.multiple}
-        hidden
-        capture="environment"
-        @change=${(e) => {
-            const fileInput = e.currentTarget;
-            this._files = this.attachFileList
-                ? [...files, ...Array.from(fileInput.files)]
-                : [...Array.from(fileInput.files)];
-            this.dispatchEvent(new CustomEvent('files-change', {
-                bubbles: true,
-                composed: true,
-                detail: {
-                    files: files
-                }
-            }));
-            // fileInput.value = null
-            fileInput.files = null;
-        }}
-      />
-      <label for="input-file">${this.label || 'capture image'}</label>
-
-      ${!this.hideFileList && (files === null || files === void 0 ? void 0 : files.length)
-            ? html ` <ul>
-            ${files.map(file => html `
-                <li>
-                  - ${file.name}
-                  <mwc-icon
-                    @click=${(e) => {
-                files.splice(files.indexOf(file), 1);
-                this._files = [...files];
-                this.dispatchEvent(new CustomEvent('files-change', {
-                    bubbles: true,
-                    composed: true,
-                    detail: {
-                        files: this._files
-                    }
-                }));
-            }}
-                    >delete_outline</mwc-icon
-                  >
-                </li>
-              `)}
-          </ul>`
-            : html ``}
-    `;
-    }
-    firstUpdated() {
-        FileDropHelper.set(this);
-        this.addEventListener('file-drop', (e) => {
-            const detail = e.detail;
-            this._files = this.multiple ? detail : detail[0] ? [detail[0]] : [];
-            this.dispatchEvent(new CustomEvent('files-change', {
-                bubbles: true,
-                composed: true,
-                detail: {
-                    files: this._files
-                }
-            }));
-        });
-    }
-    get files() {
-        return this._files;
-    }
-    reset() {
-        this.fileInput.value = '';
-        this._files = [];
-        this.dispatchEvent(new CustomEvent('files-change', {
-            bubbles: true,
-            composed: true,
-            detail: {
-                files: this._files
-            }
-        }));
-    }
-};
-CameraCapturer.styles = [
-    css `
-      :host {
-        display: flex;
-        flex-direction: column;
-        border-radius: var(--border-radius);
-        align-items: center;
-        justify-content: center;
-        padding: var(--padding-default, 9px);
-        min-height: 100px;
-        text-transform: capitalize;
-
-        border: var(--file-uploader-border);
-        background-color: var(--main-section-background-color);
-        font: var(--file-uploader-font) !important;
-        color: var(--file-uploader-color);
-      }
-      :host > mwc-icon {
-        color: var(--file-uploader-icon-color);
-      }
-
-      :host(.candrop) {
-        background-color: var(--file-uploader-candrop-background-color);
-      }
-
-      #input-file {
-        display: none;
-      }
-
-      label {
-        position: relative;
-        width: auto;
-        border: none;
-        text-transform: capitalize;
-
-        padding: var(--file-uploader-label-padding);
-        border-radius: var(--file-uploader-label-border-radius);
-        background-color: var(--file-uploader-label-background-color);
-        color: var(--file-uploader-label-color);
-        font: var(--file-uploader-label-font) !important;
-      }
-
-      ul {
-        max-width: 500px;
-        list-style: none;
-        margin: 5px 0 0 0;
-        padding: 0;
-        max-height: 46px;
-        overflow: auto;
-        background-color: rgba(var(--primary-color-rgb), 0.1);
-      }
-      li {
-        text-align: left;
-
-        padding: 3px 5px 2px 5px;
-        border-bottom: var(--file-uploader-li-border-bottom);
-        font: normal 14px var(--theme-font);
-      }
-      li mwc-icon {
-        float: right;
-        cursor: pointer;
-        margin: var(--file-uploader-li-icon-margin);
-        font-size: 1em;
-      }
-      li mwc-icon:hover,
-      li mwc-icon:active {
-        color: var(--file-uploader-li-icon-focus-color);
-      }
-    `
-];
-__decorate([
-    property({ type: Boolean })
-], CameraCapturer.prototype, "multiple", void 0);
-__decorate([
-    property({ type: String })
-], CameraCapturer.prototype, "accept", void 0);
-__decorate([
-    property({ type: String })
-], CameraCapturer.prototype, "label", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true, attribute: 'hide-filelist' })
-], CameraCapturer.prototype, "hideFileList", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true, attribute: 'attach-filelist' })
-], CameraCapturer.prototype, "attachFileList", void 0);
-__decorate([
-    state()
-], CameraCapturer.prototype, "_files", void 0);
-__decorate([
-    query('#input-file')
-], CameraCapturer.prototype, "fileInput", void 0);
-CameraCapturer = __decorate([
-    customElement('ox-camera-capturer')
-], CameraCapturer);
-export { CameraCapturer };
-//# sourceMappingURL=ox-camera-capturer.js.map

package/dist/src/ox-camera-capturer.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ox-camera-capturer.js","sourceRoot":"","sources":["../../src/ox-camera-capturer.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\n\nimport { FileDropHelper } from './utils/file-drop-helper'\n\n@customElement('ox-camera-capturer')\nexport class CameraCapturer extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        border-radius: var(--border-radius);\n        align-items: center;\n        justify-content: center;\n        padding: var(--padding-default, 9px);\n        min-height: 100px;\n        text-transform: capitalize;\n\n        border: var(--file-uploader-border);\n        background-color: var(--main-section-background-color);\n        font: var(--file-uploader-font) !important;\n        color: var(--file-uploader-color);\n      }\n      :host > mwc-icon {\n        color: var(--file-uploader-icon-color);\n      }\n\n      :host(.candrop) {\n        background-color: var(--file-uploader-candrop-background-color);\n      }\n\n      #input-file {\n        display: none;\n      }\n\n      label {\n        position: relative;\n        width: auto;\n        border: none;\n        text-transform: capitalize;\n\n        padding: var(--file-uploader-label-padding);\n        border-radius: var(--file-uploader-label-border-radius);\n        background-color: var(--file-uploader-label-background-color);\n        color: var(--file-uploader-label-color);\n        font: var(--file-uploader-label-font) !important;\n      }\n\n      ul {\n        max-width: 500px;\n        list-style: none;\n        margin: 5px 0 0 0;\n        padding: 0;\n        max-height: 46px;\n        overflow: auto;\n        background-color: rgba(var(--primary-color-rgb), 0.1);\n      }\n      li {\n        text-align: left;\n\n        padding: 3px 5px 2px 5px;\n        border-bottom: var(--file-uploader-li-border-bottom);\n        font: normal 14px var(--theme-font);\n      }\n      li mwc-icon {\n        float: right;\n        cursor: pointer;\n        margin: var(--file-uploader-li-icon-margin);\n        font-size: 1em;\n      }\n      li mwc-icon:hover,\n      li mwc-icon:active {\n        color: var(--file-uploader-li-icon-focus-color);\n      }\n    `\n  ]\n\n  @property({ type: Boolean }) multiple?: boolean\n  @property({ type: String }) accept?: string\n  @property({ type: String }) label?: string\n  @property({ type: Boolean, reflect: true, attribute: 'hide-filelist' })\n  hideFileList: boolean = false\n  @property({ type: Boolean, reflect: true, attribute: 'attach-filelist' })\n  attachFileList: boolean = false\n\n  @state() _files?: File[]\n\n  render() {\n    var files = this._files || []\n\n    return html`\n      <mwc-icon>camera</mwc-icon>\n      <span>Capture image or drop files here!</span>\n      <input\n        id=\"input-file\"\n        type=\"file\"\n        accept=${this.accept}\n        ?multiple=${this.multiple}\n        hidden\n        capture=\"environment\"\n        @change=${(e: Event) => {\n          const fileInput = e.currentTarget as HTMLInputElement\n\n          this._files = this.attachFileList\n            ? [...files, ...Array.from(fileInput.files as FileList)]\n            : [...Array.from(fileInput.files as FileList)]\n\n          this.dispatchEvent(\n            new CustomEvent('files-change', {\n              bubbles: true,\n              composed: true,\n              detail: {\n                files: files\n              }\n            })\n          )\n\n          // fileInput.value = null\n          fileInput.files = null\n        }}\n      />\n      <label for=\"input-file\">${this.label || 'capture image'}</label>\n\n      ${!this.hideFileList && files?.length\n        ? html` <ul>\n            ${files.map(\n              file => html`\n                <li>\n                  - ${file.name}\n                  <mwc-icon\n                    @click=${(e: Event) => {\n                      files.splice(files.indexOf(file), 1)\n                      this._files = [...files]\n                      this.dispatchEvent(\n                        new CustomEvent('files-change', {\n                          bubbles: true,\n                          composed: true,\n                          detail: {\n                            files: this._files\n                          }\n                        })\n                      )\n                    }}\n                    >delete_outline</mwc-icon\n                  >\n                </li>\n              `\n            )}\n          </ul>`\n        : html``}\n    `\n  }\n\n  firstUpdated() {\n    FileDropHelper.set(this)\n\n    this.addEventListener('file-drop', (e: Event) => {\n      const detail = (e as CustomEvent).detail\n      this._files = this.multiple ? detail : detail[0] ? [detail[0]] : []\n\n      this.dispatchEvent(\n        new CustomEvent('files-change', {\n          bubbles: true,\n          composed: true,\n          detail: {\n            files: this._files\n          }\n        })\n      )\n    })\n  }\n\n  @query('#input-file') fileInput!: HTMLInputElement\n\n  get files() {\n    return this._files\n  }\n\n  reset() {\n    this.fileInput.value = ''\n    this._files = []\n\n    this.dispatchEvent(\n      new CustomEvent('files-change', {\n        bubbles: true,\n        composed: true,\n        detail: {\n          files: this._files\n        }\n      })\n    )\n  }\n}\n"]}

package/dist/src/utils/file-drop-helper.d.ts

@@ -1,16 +0,0 @@
-/**
- * judge callback function for FileDropHelper.set
- */
-declare type JudgeCallback = () => boolean;
-/**
- * file drop assist class
- */
-export declare class FileDropHelper {
-    /**
-     * 파일 드롭 영역에서의 file drag&drop과 관련된 이벤트에 대한 처리를 설정한다.
-     * @param dropArea file drag&drop target area
-     * @param [judge] file drag&drop과 관련된 이벤트에 대한 judge callback function
-     */
-    static set(dropArea: HTMLElement, judge?: JudgeCallback): void;
-}
-export {};

package/dist/src/utils/file-drop-helper.js

@@ -1,47 +0,0 @@
-/**
- * file drop assist class
- */
-export class FileDropHelper {
-    /**
-     * 파일 드롭 영역에서의 file drag&drop과 관련된 이벤트에 대한 처리를 설정한다.
-     * @param dropArea file drag&drop target area
-     * @param [judge] file drag&drop과 관련된 이벤트에 대한 judge callback function
-     */
-    static set(dropArea, judge) {
-        var preventDefaults = (e) => {
-            if (!judge || judge()) {
-                e.preventDefault();
-                e.stopPropagation();
-            }
-        };
-        var highlight = (e) => {
-            if (!judge || judge()) {
-                dropArea.classList.add('candrop');
-            }
-        };
-        var unhighlight = (e) => {
-            if (!judge || judge()) {
-                dropArea.classList.remove('candrop');
-            }
-        };
-        ['dragenter', 'dragover', 'dragleave', 'drop'].forEach(event => {
-            dropArea.addEventListener(event, preventDefaults, false);
-        });
-        ['dragenter', 'dragover'].forEach(event => {
-            dropArea.addEventListener(event, highlight, false);
-        });
-        ['dragleave', 'drop'].forEach(event => {
-            dropArea.addEventListener(event, unhighlight, false);
-        });
-        dropArea.addEventListener('drop', e => {
-            if (!judge || judge()) {
-                let dt = e.dataTransfer;
-                let files = dt.files;
-                dropArea.dispatchEvent(new CustomEvent('file-drop', {
-                    detail: [...Array.from(files)]
-                }));
-            }
-        }, false);
-    }
-}
-//# sourceMappingURL=file-drop-helper.js.map

package/dist/src/utils/file-drop-helper.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"file-drop-helper.js","sourceRoot":"","sources":["../../../src/utils/file-drop-helper.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,MAAM,OAAO,cAAc;IACzB;;;;OAIG;IACH,MAAM,CAAC,GAAG,CAAC,QAAqB,EAAE,KAAqB;QACrD,IAAI,eAAe,GAAG,CAAC,CAAQ,EAAE,EAAE;YACjC,IAAI,CAAC,KAAK,IAAI,KAAK,EAAE,EAAE;gBACrB,CAAC,CAAC,cAAc,EAAE,CAAA;gBAClB,CAAC,CAAC,eAAe,EAAE,CAAA;aACpB;QACH,CAAC,CAAA;QAED,IAAI,SAAS,GAAG,CAAC,CAAQ,EAAE,EAAE;YAC3B,IAAI,CAAC,KAAK,IAAI,KAAK,EAAE,EAAE;gBACrB,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;aAClC;QACH,CAAC,CAAA;QAED,IAAI,WAAW,GAAG,CAAC,CAAQ,EAAE,EAAE;YAC7B,IAAI,CAAC,KAAK,IAAI,KAAK,EAAE,EAAE;gBACrB,QAAQ,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAA;aACrC;QACH,CAAC,CAEA;QAAA,CAAC,WAAW,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YAC9D,QAAQ,CAAC,gBAAgB,CAAC,KAAK,EAAE,eAAe,EAAE,KAAK,CAAC,CAAA;QAC1D,CAAC,CAAC,CACD;QAAA,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACzC,QAAQ,CAAC,gBAAgB,CAAC,KAAK,EAAE,SAAS,EAAE,KAAK,CAAC,CAAA;QACpD,CAAC,CAAC,CACD;QAAA,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACrC,QAAQ,CAAC,gBAAgB,CAAC,KAAK,EAAE,WAAW,EAAE,KAAK,CAAC,CAAA;QACtD,CAAC,CAAC,CAAA;QAEF,QAAQ,CAAC,gBAAgB,CACvB,MAAM,EACN,CAAC,CAAC,EAAE;YACF,IAAI,CAAC,KAAK,IAAI,KAAK,EAAE,EAAE;gBACrB,IAAI,EAAE,GAAG,CAAC,CAAC,YAAa,CAAA;gBACxB,IAAI,KAAK,GAAG,EAAE,CAAC,KAAK,CAAA;gBAEpB,QAAQ,CAAC,aAAa,CACpB,IAAI,WAAW,CAAC,WAAW,EAAE;oBAC3B,MAAM,EAAE,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;iBAC/B,CAAC,CACH,CAAA;aACF;QACH,CAAC,EACD,KAAK,CACN,CAAA;IACH,CAAC;CACF","sourcesContent":["/**\n * judge callback function for FileDropHelper.set\n */\ntype JudgeCallback = () => boolean\n\n/**\n * file drop assist class\n */\nexport class FileDropHelper {\n  /**\n   * 파일 드롭 영역에서의 file drag&drop과 관련된 이벤트에 대한 처리를 설정한다.\n   * @param dropArea file drag&drop target area\n   * @param [judge] file drag&drop과 관련된 이벤트에 대한 judge callback function\n   */\n  static set(dropArea: HTMLElement, judge?: JudgeCallback) {\n    var preventDefaults = (e: Event) => {\n      if (!judge || judge()) {\n        e.preventDefault()\n        e.stopPropagation()\n      }\n    }\n\n    var highlight = (e: Event) => {\n      if (!judge || judge()) {\n        dropArea.classList.add('candrop')\n      }\n    }\n\n    var unhighlight = (e: Event) => {\n      if (!judge || judge()) {\n        dropArea.classList.remove('candrop')\n      }\n    }\n\n    ;['dragenter', 'dragover', 'dragleave', 'drop'].forEach(event => {\n      dropArea.addEventListener(event, preventDefaults, false)\n    })\n    ;['dragenter', 'dragover'].forEach(event => {\n      dropArea.addEventListener(event, highlight, false)\n    })\n    ;['dragleave', 'drop'].forEach(event => {\n      dropArea.addEventListener(event, unhighlight, false)\n    })\n\n    dropArea.addEventListener(\n      'drop',\n      e => {\n        if (!judge || judge()) {\n          let dt = e.dataTransfer!\n          let files = dt.files\n\n          dropArea.dispatchEvent(\n            new CustomEvent('file-drop', {\n              detail: [...Array.from(files)]\n            })\n          )\n        }\n      },\n      false\n    )\n  }\n}\n"]}

package/src/ox-camera-capturer.ts

@@ -1,196 +0,0 @@
-import '@material/mwc-icon'
-
-import { css, html, LitElement } from 'lit'
-import { customElement, property, query, state } from 'lit/decorators.js'
-
-import { FileDropHelper } from './utils/file-drop-helper'
-
-@customElement('ox-camera-capturer')
-export class CameraCapturer extends LitElement {
-  static styles = [
-    css`
-      :host {
-        display: flex;
-        flex-direction: column;
-        border-radius: var(--border-radius);
-        align-items: center;
-        justify-content: center;
-        padding: var(--padding-default, 9px);
-        min-height: 100px;
-        text-transform: capitalize;
-
-        border: var(--file-uploader-border);
-        background-color: var(--main-section-background-color);
-        font: var(--file-uploader-font) !important;
-        color: var(--file-uploader-color);
-      }
-      :host > mwc-icon {
-        color: var(--file-uploader-icon-color);
-      }
-
-      :host(.candrop) {
-        background-color: var(--file-uploader-candrop-background-color);
-      }
-
-      #input-file {
-        display: none;
-      }
-
-      label {
-        position: relative;
-        width: auto;
-        border: none;
-        text-transform: capitalize;
-
-        padding: var(--file-uploader-label-padding);
-        border-radius: var(--file-uploader-label-border-radius);
-        background-color: var(--file-uploader-label-background-color);
-        color: var(--file-uploader-label-color);
-        font: var(--file-uploader-label-font) !important;
-      }
-
-      ul {
-        max-width: 500px;
-        list-style: none;
-        margin: 5px 0 0 0;
-        padding: 0;
-        max-height: 46px;
-        overflow: auto;
-        background-color: rgba(var(--primary-color-rgb), 0.1);
-      }
-      li {
-        text-align: left;
-
-        padding: 3px 5px 2px 5px;
-        border-bottom: var(--file-uploader-li-border-bottom);
-        font: normal 14px var(--theme-font);
-      }
-      li mwc-icon {
-        float: right;
-        cursor: pointer;
-        margin: var(--file-uploader-li-icon-margin);
-        font-size: 1em;
-      }
-      li mwc-icon:hover,
-      li mwc-icon:active {
-        color: var(--file-uploader-li-icon-focus-color);
-      }
-    `
-  ]
-
-  @property({ type: Boolean }) multiple?: boolean
-  @property({ type: String }) accept?: string
-  @property({ type: String }) label?: string
-  @property({ type: Boolean, reflect: true, attribute: 'hide-filelist' })
-  hideFileList: boolean = false
-  @property({ type: Boolean, reflect: true, attribute: 'attach-filelist' })
-  attachFileList: boolean = false
-
-  @state() _files?: File[]
-
-  render() {
-    var files = this._files || []
-
-    return html`
-      <mwc-icon>camera</mwc-icon>
-      <span>Capture image or drop files here!</span>
-      <input
-        id="input-file"
-        type="file"
-        accept=${this.accept}
-        ?multiple=${this.multiple}
-        hidden
-        capture="environment"
-        @change=${(e: Event) => {
-          const fileInput = e.currentTarget as HTMLInputElement
-
-          this._files = this.attachFileList
-            ? [...files, ...Array.from(fileInput.files as FileList)]
-            : [...Array.from(fileInput.files as FileList)]
-
-          this.dispatchEvent(
-            new CustomEvent('files-change', {
-              bubbles: true,
-              composed: true,
-              detail: {
-                files: files
-              }
-            })
-          )
-
-          // fileInput.value = null
-          fileInput.files = null
-        }}
-      />
-      <label for="input-file">${this.label || 'capture image'}</label>
-
-      ${!this.hideFileList && files?.length
-        ? html` <ul>
-            ${files.map(
-              file => html`
-                <li>
-                  - ${file.name}
-                  <mwc-icon
-                    @click=${(e: Event) => {
-                      files.splice(files.indexOf(file), 1)
-                      this._files = [...files]
-                      this.dispatchEvent(
-                        new CustomEvent('files-change', {
-                          bubbles: true,
-                          composed: true,
-                          detail: {
-                            files: this._files
-                          }
-                        })
-                      )
-                    }}
-                    >delete_outline</mwc-icon
-                  >
-                </li>
-              `
-            )}
-          </ul>`
-        : html``}
-    `
-  }
-
-  firstUpdated() {
-    FileDropHelper.set(this)
-
-    this.addEventListener('file-drop', (e: Event) => {
-      const detail = (e as CustomEvent).detail
-      this._files = this.multiple ? detail : detail[0] ? [detail[0]] : []
-
-      this.dispatchEvent(
-        new CustomEvent('files-change', {
-          bubbles: true,
-          composed: true,
-          detail: {
-            files: this._files
-          }
-        })
-      )
-    })
-  }
-
-  @query('#input-file') fileInput!: HTMLInputElement
-
-  get files() {
-    return this._files
-  }
-
-  reset() {
-    this.fileInput.value = ''
-    this._files = []
-
-    this.dispatchEvent(
-      new CustomEvent('files-change', {
-        bubbles: true,
-        composed: true,
-        detail: {
-          files: this._files
-        }
-      })
-    )
-  }
-}

package/src/utils/file-drop-helper.ts

@@ -1,62 +0,0 @@
-/**
- * judge callback function for FileDropHelper.set
- */
-type JudgeCallback = () => boolean
-
-/**
- * file drop assist class
- */
-export class FileDropHelper {
-  /**
-   * 파일 드롭 영역에서의 file drag&drop과 관련된 이벤트에 대한 처리를 설정한다.
-   * @param dropArea file drag&drop target area
-   * @param [judge] file drag&drop과 관련된 이벤트에 대한 judge callback function
-   */
-  static set(dropArea: HTMLElement, judge?: JudgeCallback) {
-    var preventDefaults = (e: Event) => {
-      if (!judge || judge()) {
-        e.preventDefault()
-        e.stopPropagation()
-      }
-    }
-
-    var highlight = (e: Event) => {
-      if (!judge || judge()) {
-        dropArea.classList.add('candrop')
-      }
-    }
-
-    var unhighlight = (e: Event) => {
-      if (!judge || judge()) {
-        dropArea.classList.remove('candrop')
-      }
-    }
-
-    ;['dragenter', 'dragover', 'dragleave', 'drop'].forEach(event => {
-      dropArea.addEventListener(event, preventDefaults, false)
-    })
-    ;['dragenter', 'dragover'].forEach(event => {
-      dropArea.addEventListener(event, highlight, false)
-    })
-    ;['dragleave', 'drop'].forEach(event => {
-      dropArea.addEventListener(event, unhighlight, false)
-    })
-
-    dropArea.addEventListener(
-      'drop',
-      e => {
-        if (!judge || judge()) {
-          let dt = e.dataTransfer!
-          let files = dt.files
-
-          dropArea.dispatchEvent(
-            new CustomEvent('file-drop', {
-              detail: [...Array.from(files)]
-            })
-          )
-        }
-      },
-      false
-    )
-  }
-}