daily commit

app/components/context.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+export const EditorContext = React.createContext(null);
+
+export const withEditor = (Component: React.FC) => (props: any) => {
+    return (
+        <EditorContext.Consumer>
+            {editor => {
+                return <Component editor={editor} {...props} />;
+            }}
+        </EditorContext.Consumer>
+    );
+};

app/components/index.tsx

@@ -4,6 +4,8 @@ import { connect, Provider } from 'react-redux';
 import store from '@redux/store';
 import { PopupStateType, StateType } from '@interfaces';
 
+import {EditorContext} from './context';
+
 class rootComponent extends Component {
     props: {
         popup: PopupStateType
@@ -13,13 +15,40 @@ class rootComponent extends Component {
     }
 }
 
-const App = connect(
-    (state: StateType) => {
-        return {
-            popup: state.popup
+type AppState = {
+    editor: any;
+}
+
+class App extends Component<{}, AppState> {
+    constructor(options: any) {
+        super(options);
+        this.state = {
+            editor: null,
+        }
+    }
+
+    componentDidUpdate() {
+        if (!this.state.editor) {
+            this.setState({
+                editor: window.NEDITOR.getEditor()
+            });
         }
-}, null)(rootComponent);
+    }
 
+    render() {
+        const {editor} = this.state;
+        const Com = connect((state: StateType) => {
+            return {
+                popup: state.popup
+            }
+        }, null)(rootComponent);
+        return (
+            <EditorContext.Provider value={editor}>
+                <Com />
+            </EditorContext.Provider>
+        );
+    }
+}
 
 export default () => {
     return (

app/index.ts

@@ -26,13 +26,16 @@ class NotionEditor implements NotionEditorInterface {
     active(options: any) {
         this.editor = new Editor(options);
     }
+
+    getEditor() {
+        return this.editor;
+    }
 }
 
-// Note: This should init by Client, we mock it.
-document.addEventListener('DOMContentLoaded', () => window.NEDITOR = new NotionEditor({
+window.NEDITOR = new NotionEditor({
     title: 'NotionEditor',
     root: 'n-editor'
     // other config
-}));
+})
 // react view
 render(ReactRootApp(), document.getElementById('n-component'));

app/modules/slash/plugin.ts

@@ -45,5 +45,12 @@ export const slashPopupPlugin: () => Plugin = () => new Plugin({
                 }
             }
         }
+    },
+    props: {
+        handleTextInput(view, from, to, text) {
+            const {state: {tr}, dispatch}  = view;
+            dispatch(tr.setMeta(slashPopupPluginKey, {from, to, text}));
+            return false;
+        }
     }
 });

app/plugins.ts

@@ -18,7 +18,7 @@ import listPlugin from '@modules/list/plugin';
 import debug from '@modules/debug/debug';
 
 export const plugins: Plugin[] = [
-    typebehinds(),
+    // typebehinds(),
     // selectionPlugin(),
     listPlugin(),
     keymap(baseKeymap),