Add test and move ChangeEvent interface

types/cleave.js/cleave.js-tests.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import Cleave = require("cleave.js");
 import CleaveReact = require("cleave.js/react");
-import { Props } from "cleave.js/react/props";
+import { Props, ChangeEvent } from "cleave.js/react/props";
 
 const ExampleSelector1 = () => {
     const cleave = new Cleave("#my-input", { phone: true });
@@ -41,3 +41,17 @@ const ExampleReact2 = (props: Props) => {
         />
     );
 };
+
+const ExampleReact3 = (props: Props) => {
+    const handleChange = (e: ChangeEvent<HTMLInputElement>) => {
+        return e.target.rawValue;
+    };
+    return (
+        <CleaveReact
+            value="test"
+            className="form-control"
+            options={{ date: true }}
+            onChange={handleChange}
+        />
+    );
+};

types/cleave.js/react/index.d.ts

@@ -2,9 +2,4 @@ import * as React from "react";
 import { Props } from "./props";
 
 declare var Cleave: React.ComponentClass<Props>;
-declare namespace Cleave {
-    interface ChangeEvent<T> extends React.ChangeEvent<T> {
-        target: { rawValue: string } & EventTarget & T
-    }
-}
 export = Cleave;

types/cleave.js/react/props.d.ts

@@ -3,8 +3,15 @@ import { CleaveOptions } from "../options";
 
 export type InitHandler = (owner: React.ReactInstance) => void;
 
+export interface ChangeEvent<T> extends React.ChangeEvent<T> {
+    target: { rawValue: string } & EventTarget & T
+}
+
+export type ChangeEventHandler<T = Element> = React.EventHandler<ChangeEvent<T>>;
+
 export interface Props extends React.InputHTMLAttributes<HTMLInputElement> {
     onInit?: InitHandler;
     options: CleaveOptions;
     htmlRef?: (i: any) => void;
+    onChange?: ChangeEventHandler<HTMLInputElement>
 }