diff --git a/types/cleave.js/cleave.js-tests.tsx b/types/cleave.js/cleave.js-tests.tsx index a826d2607a..461e4f4d05 100644 --- a/types/cleave.js/cleave.js-tests.tsx +++ b/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) => { + return e.target.rawValue; + }; + return ( + + ); +}; diff --git a/types/cleave.js/react/index.d.ts b/types/cleave.js/react/index.d.ts index 0459221f2a..bf158b8f4d 100644 --- a/types/cleave.js/react/index.d.ts +++ b/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; -declare namespace Cleave { - interface ChangeEvent extends React.ChangeEvent { - target: { rawValue: string } & EventTarget & T - } -} export = Cleave; diff --git a/types/cleave.js/react/props.d.ts b/types/cleave.js/react/props.d.ts index 6ce47db62c..1e190fb729 100644 --- a/types/cleave.js/react/props.d.ts +++ b/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 extends React.ChangeEvent { + target: { rawValue: string } & EventTarget & T +} + +export type ChangeEventHandler = React.EventHandler>; + export interface Props extends React.InputHTMLAttributes { onInit?: InitHandler; options: CleaveOptions; htmlRef?: (i: any) => void; + onChange?: ChangeEventHandler }