Merge branch 'move_ggeditor'

.eslintrc.json

@@ -5,14 +5,16 @@
   "parser": "babel-eslint",
   "extends": "airbnb",
   "rules": {
+    "class-methods-use-this": 0,
+    "func-names": 0,
     "import/extensions": 0,
-    "import/no-unresolved": 0,
     "import/no-extraneous-dependencies": 0,
+    "import/no-unresolved": 0,
+    "no-param-reassign": 0,
+    "no-plusplus": 0,
     "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
-    "react/sort-comp": 0,
-    "react/prop-types": 0,
     "react/prefer-stateless-function": 0,
-    "func-names": 0,
-    "class-methods-use-this": 0
+    "react/prop-types": 0,
+    "react/sort-comp": 0
   }
 }

src/components/GGEditor/index.js

@@ -0,0 +1,88 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import Editor from '@antv/g6-editor';
+import { EDITOR_EVENTS } from '@common/constants';
+import { pick, upperFirst, createId } from '@utils';
+
+class GGEditor extends React.Component {
+  static childContextTypes = {
+    editor: PropTypes.object,
+    editorId: PropTypes.number,
+    getCurrentPage: PropTypes.func,
+    getSelected: PropTypes.func,
+    addItem: PropTypes.func,
+    removeItem: PropTypes.func,
+    updateItem: PropTypes.func,
+    findItem: PropTypes.func,
+  }
+
+  editor = null;
+
+  editorId = createId();
+
+  constructor(props) {
+    super(props);
+
+    this.init();
+    this.bindEvent();
+  }
+
+  getChildContext() {
+    return {
+      editor: this.editor,
+      editorId: this.editorId,
+      getCurrentPage: this.getCurrentPage,
+      getSelected: this.getSelected,
+      addItem: this.addItem,
+      removeItem: this.removeItem,
+      updateItem: this.updateItem,
+      findItem: this.findItem,
+    };
+  }
+
+  get page() {
+    return this.editor.getCurrentPage();
+  }
+
+  getCurrentPage = () => this.page;
+
+  getSelected = () => this.page.getSelected();
+
+  addItem = (type, model) => this.page.add(type, model);
+
+  removeItem = item => this.page.remove(item);
+
+  updateItem = (item, model) => this.page.update(item, model);
+
+  findItem = id => this.page.find(id);
+
+  init() {
+    this.editor = new Editor();
+  }
+
+  bindEvent() {
+    EDITOR_EVENTS.forEach((event) => {
+      const handleEvent = this.props[(`on${upperFirst(event)}`)];
+
+      if (handleEvent) {
+        this.editor.on([event], handleEvent);
+      }
+    });
+  }
+
+  componentWillUnmount() {
+    this.editor.destroy();
+  }
+
+  render() {
+    const { children } = this.props;
+
+    return (
+      <div {...pick(this.props, ['style', 'className'])}>
+        {children}
+      </div>
+    );
+  }
+}
+
+export default GGEditor;

src/index.js

@@ -1,8 +1,3 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import Editor from '@antv/g6-editor';
-import { EDITOR_EVENTS } from '@common/constants';
-import { pick, upperFirst } from '@utils';
 import Flow from '@components/Flow';
 import Mind from '@components/Mind';
 import Register, {
@@ -25,95 +20,7 @@ import DetailPannel, {
   MultiPannel,
   CanvasPannel,
 } from '@components/DetailPannel';
-
-let EDITOR_ID = 0;
-
-function createId() {
-  EDITOR_ID += 1;
-
-  return EDITOR_ID;
-}
-
-class GGEditor extends React.Component {
-  static childContextTypes = {
-    editor: PropTypes.object,
-    editorId: PropTypes.number,
-    getCurrentPage: PropTypes.func,
-    getSelected: PropTypes.func,
-    addItem: PropTypes.func,
-    removeItem: PropTypes.func,
-    updateItem: PropTypes.func,
-    findItem: PropTypes.func,
-  }
-
-  editor = null;
-
-  editorId = createId();
-
-  constructor(props) {
-    super(props);
-
-    this.init();
-    this.bindEvent();
-  }
-
-  getChildContext() {
-    return {
-      editor: this.editor,
-      editorId: this.editorId,
-      getCurrentPage: this.getCurrentPage,
-      getSelected: this.getSelected,
-      addItem: this.addItem,
-      removeItem: this.removeItem,
-      updateItem: this.updateItem,
-      findItem: this.findItem,
-    };
-  }
-
-  get page() {
-    return this.editor.getCurrentPage();
-  }
-
-  getCurrentPage = () => this.page;
-
-  getSelected = () => this.page.getSelected();
-
-  addItem = (type, model) => this.page.add(type, model);
-
-  removeItem = item => this.page.remove(item);
-
-  updateItem = (item, model) => this.page.update(item, model);
-
-  findItem = id => this.page.find(id);
-
-  init() {
-    this.editor = new Editor();
-  }
-
-  bindEvent() {
-    EDITOR_EVENTS.forEach((event) => {
-      const handleEvent = this.props[(`on${upperFirst(event)}`)];
-
-      if (handleEvent) {
-        this.editor.on([event], handleEvent);
-      }
-    });
-  }
-
-  componentWillUnmount() {
-    this.editor.destroy();
-  }
-
-  render() {
-    const { children } = this.props;
-
-    return (
-      <div {...pick(this.props, ['style', 'className'])}>
-        {children}
-      </div>
-    );
-  }
-}
+import GGEditor from '@components/GGEditor';
 
 export {
   Flow,

src/utils/index.js

@@ -3,9 +3,13 @@ import merge from 'lodash/merge';
 import mapKeys from 'lodash/mapKeys';
 import upperFirst from 'lodash/upperFirst';
 
+const createCounter = (count = 0) => () => count++;
+const createId = createCounter();
+
 export {
-  pick,
-  merge,
+  createId,
   mapKeys,
+  merge,
+  pick,
   upperFirst,
 };