basic note components

wax-prosemirror-components/src/components/notes/NoteEditorContainer.js

-import React, { useRef } from "react";
+import React from "react";
 import styled from "styled-components";
 
+import NoteNumber from "./NoteNumber";
+
 const NoteEditorContainerStyled = styled.div`
+  display: flex;
+  flex-direction: row;
   height: 50px;
   width: 61%;
   margin-left: 14%;
+`;
+
+const NoteStyled = styled.div`
+  display: flex;
+  width: 96%;
+  height: 100%;
   border: 1px solid black;
 `;
 
 const NoteEditorContainer = React.forwardRef((props, ref) => (
-  <NoteEditorContainerStyled ref={ref} {...props} />
+  <NoteEditorContainerStyled>
+    <NoteNumber /> <NoteStyled ref={ref} {...props} />
+  </NoteEditorContainerStyled>
 ));
 
 export default NoteEditorContainer;

wax-prosemirror-components/src/components/notes/NoteNumber.js

+import React from "react";
+import styled from "styled-components";
+
+const NoteNumberStyled = styled.div`
+  display: flex;
+  width: 2%;
+`;
+
+const NoteNumber = ({ number }) => {
+  return <NoteNumberStyled>1.</NoteNumberStyled>;
+};
+
+export default NoteNumber;

wax-prosemirror-services/src/LinkService/LinkTool.js

@@ -15,6 +15,7 @@ export default class LinkTool extends Tools {
         toggleMark(state.config.schema.marks.link)(state, dispatch);
         return true;
       }
+      //TODO disable creating multiblock links
       Commands.createLink(state, dispatch);
     };
   }

wax-prosemirror-services/src/NoteService/Editor.js

@@ -9,6 +9,7 @@ import { Commands } from "wax-prosemirror-utilities";
 import { NoteEditorContainer } from "wax-prosemirror-components";
 
 export default ({ node, view, pos }) => {
+  console.log(pos);
   const editorRef = useRef();
   const context = useContext(WaxContext);
 
@@ -62,6 +63,7 @@ export default ({ node, view, pos }) => {
         }
       }
     );
+    noteView.focus();
     context.updateView({ [pos]: noteView });
   }, []);