fix docs for selection, add support for renderLine

Author: scniro

CHANGELOG.md

@@ -1,3 +1,8 @@
+5.1.0
+==================
+* add support for `renderLine` (#98)
+
+
 5.0.3
 ==================
 * #88

README.md

@@ -105,15 +105,18 @@ require('codemirror/mode/javascript/javascript');
   onScroll={(editor, data) => {}}
 />
 ```
-- `selection={array<{anchor, head}>}` - *[setSelections](https://codemirror.net/doc/manual.html#setSelections)*
+- `selection={{ranges: array<{anchor, head}>, focus?: boolean}` - *[setSelections](https://codemirror.net/doc/manual.html#setSelections)*
 > will programmatically select the ranges specified
 ```jsx
 <CodeMirror
   [...]
-  selection={[{
-    anchor: {ch: 8, line: 5},
-    head: {ch: 37, line: 5}
-  }]}
+  selection={{
+    ranges: [{
+      anchor: {ch: 8, line: 5},
+      head: {ch: 37, line: 5}
+    }],
+    focus: true // defaults false if not specified
+  }}
   onSelection={(editor, data) => {}}
 />
 ```

docs/app.min.js

@@ -1,6 +1,6 @@
 {
   "name": "react-codemirror2",
-  "version": "5.0.4",
+  "version": "5.1.0",
   "description": "a tiny react codemirror component wrapper",
   "main": "index.js",
   "typings": "index.d.ts",

index.d.ts

@@ -78,6 +78,7 @@ export interface ICodeMirror {
   onKeyUp?: DomEvent;
   onMouseDown?: DomEvent;
   onPaste?: DomEvent;
+  onRenderLine?: (editor: IInstance, line: codemirror.LineHandle, element: HTMLElement) => void;
   onScroll?: (editor: IInstance, data: codemirror.ScrollInfo) => void;
   onSelection?: (editor: IInstance, data: IGetSelectionOptions) => void;
   onTouchStart?: DomEvent;
@@ -206,7 +207,6 @@ class Shared implements ICommon {
   public wire(props: IControlledCodeMirror | IUnControlledCodeMirror) {
 
     Object.keys(props || {}).filter(p => /^on/.test(p)).forEach(prop => {
-
       switch (prop) {
         case 'onBlur': {
           (this.editor as any).on('blur', (cm, event) => {
@@ -322,6 +322,12 @@ class Shared implements ICommon {
           });
           break;
         }
+        case 'onRenderLine': {
+          this.editor.on('renderLine', (cm, line, element) => {
+            this.props.onRenderLine(this.editor, line, element);
+          });
+          break;
+        }
         case 'onScroll': {
           this.editor.on('scroll', (cm) => {
             this.props.onScroll(this.editor, this.editor.getScrollInfo());

index.js

@@ -187,6 +187,22 @@ describe('DOM Events', () => {
     wrapper.instance().editor.getInputField().blur();
     expect(callback.called).toBeTruthy();
   });
+
+  it('onRenderLine(editor, line, element)', () => {
+
+    let callback;
+
+    let wrapper = Enzyme.mount(
+      <Controlled
+        value='foo'
+        onRenderLine={(editor, line, element) => {
+          callback = sinon.spy();
+          callback();
+        }}/>
+    );
+    wrapper.setProps({value: 'bar'});
+    expect(callback.called).toBeTruthy();
+  });
 });
 
 describe('Change', () => {