[react-codemirror] Add types introduced in v1.0.0

types/react-codemirror/index.d.ts

@@ -1,22 +1,43 @@
-// Type definitions for React Codemirror v0.2.6
+// Type definitions for React Codemirror v1.0.0
 // Project: https://github.com/JedWatson/react-codemirror
 // Definitions by: Vicky Lai <https://github.com/velveret>
+//                 Rudi Chen <https://github.com/rudi-c>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
-// TypeScript Version: 2.3
+// TypeScript Version: 2.4
 
 /// <reference types="react"/>
 /// <reference types="codemirror"/>
 
 declare namespace ReactCodeMirror {
     interface ReactCodeMirrorProps extends React.Props<ReactCodeMirror> {
-        onChange?: (newValue: string) => any; // called when a change is made
-        onFocusChange?: (focused: boolean) => any; // called when the editor is focused or loses focus
-        onScroll?: (scrollInfo: CodeMirror.ScrollInfo) => any; // called when the editor is scrolled
-        options?: CodeMirror.EditorConfiguration; // options passed to the CodeMirror instance
-        path?: string; // the identifying name for the textarea
-        value?: string; // the editor value
-        className?: string; // CSS className for the outer element
-        codeMirrorInstance?: CodeMirror.Editor; // the CodeMirror instance
+        /** Automatically focuses the editor when it is mounted (default false) */
+        autoFocus?: boolean;
+        /** Automatically persist changes to underlying textarea (default false) */
+        autoSave?: boolean;
+        /** Adds a custom CSS class to the editor */
+        className?: string;
+        /** Provides a specific CodeMirror instance (defaults to `require('codemirror')`) */
+        codeMirrorInstance?: (host: any, options?: CodeMirror.EditorConfiguration) => CodeMirror.Editor;
+        /** Provides the default (not changed tracked) value to the editor */
+        defaultValue?: string;
+        /** Set the name of the editor input field */
+        name?: string;
+        /** Called when a change is made */
+        onChange?: (newValue: string, change: CodeMirror.EditorChange) => any;
+        /** Called when the cursor is moved */
+        onCursorActivity?: (codemirror: CodeMirror.Editor) => any;
+        /** Called when the editor is focused or loses focus */
+        onFocusChange?: (focused: boolean) => any;
+        /** Called when the editor is scrolled */
+        onScroll?: (scrollInfo: CodeMirror.ScrollInfo) => any;
+        /** Options passed to the CodeMirror instance */
+        options?: CodeMirror.EditorConfiguration;
+        /** (DEPRECATED), use `name` */
+        path?: string;
+        /** Preserve previous scroll position after updating value */
+        preserveScrollPosition?: boolean
+        /** The editor value */
+        value?: string;
     }
 
     interface ReactCodeMirror extends React.Component<ReactCodeMirrorProps> {

types/react-codemirror/react-codemirror-tests.tsx

@@ -17,19 +17,24 @@ class CodemirrorTest extends React.Component<React.Props<{}>> {
             readOnly: false,
             mode: "markdown"
         };
-        const onChange = (value: any) => console.log(value);
+        const onChange = (value: string, change: CodeMirror.EditorChange) => console.log(value, change);
+        const onCursorActivity = (codemirror: CodeMirror.Editor) => console.log(codemirror);
         const onFocusChange = (focused: boolean) => console.log(focused);
         const onScroll = (scrollInfo: CodeMirror.ScrollInfo) => console.log(scrollInfo.top);
-        const codeMirrorInstance = CodeMirror(document.body);
 
         return <div>
             <Codemirror className="test-codemirror"
-                        codeMirrorInstance={codeMirrorInstance}
+                        autoFocus={true}
+                        autoSave={true}
+                        codeMirrorInstance={CodeMirror}
+                        defaultValue="test"
+                        name="editor"
                         onChange={onChange}
+                        onCursorActivity={onCursorActivity}
                         onFocusChange={onFocusChange}
                         onScroll={onScroll}
                         options={options}
-                        path="editor"
+                        preserveScrollPosition={true}
                         ref={(r: ReactCodeMirror.ReactCodeMirror) => this.editorRef = r}
                         value="foo bar" />
         </div>;