From b16e776e305d8d8047b0571bd1f2682c8c1d2afc Mon Sep 17 00:00:00 2001
From: Samphan Raruenrom <untsamphan@gmail.com>
Date: Tue, 14 Nov 2017 21:49:46 +0700
Subject: [PATCH] Correct from element handlers and add test (#21511)

---
 types/react-onsenui/index.d.ts              | 13 +++++++------
 types/react-onsenui/react-onsenui-tests.tsx | 10 +++++++++-
 2 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/types/react-onsenui/index.d.ts b/types/react-onsenui/index.d.ts
index b6a6dbcbdb..a910b94adf 100644
--- a/types/react-onsenui/index.d.ts
+++ b/types/react-onsenui/index.d.ts
@@ -222,20 +222,20 @@ export class Fab extends Component<{
     ripple?: boolean,
     position?: string,
     disabled?: boolean,
-    onClick?(): void,
+    onClick?: React.MouseEventHandler<HTMLButtonElement>,
 }, any> {}
 
 export class Button extends Component<{
     modifier?: string,
     disabled?: boolean,
     ripple?: boolean,
-    onClick?(e?: Event): void
+    onClick?: React.MouseEventHandler<HTMLButtonElement>,
 }, any> {}
 
 export class Input extends Component<{
     modifier?: string,
     disabled?: boolean,
-    onChange?: React.ChangeEvent<any>,
+    onChange?: React.ChangeEventHandler<HTMLInputElement>,
     value?: string,
     checked?: boolean,
     placeholder?: string,
@@ -247,13 +247,14 @@ export class Input extends Component<{
 
 export class Range extends Component<{
     modifier?: string,
-    onChange?(e: Event): void,
+    onChange?: React.ChangeEventHandler<HTMLInputElement>,
     value?: number,
     disabled?: boolean,
 }, any> {}
 
 export class Switch extends Component<{
-    onChange?(e: Event): void,
+    modifier?: string,
+    onChange?: React.ChangeEventHandler<HTMLInputElement>,
     checked?: boolean,
     disabled?: boolean,
     inputId?: string
@@ -308,7 +309,7 @@ export class ListItem extends Component<{
     tappable?: boolean,
     tapBackgroundColor?: string,
     lockOnDrag?: boolean,
-    onClick?: React.MouseEventHandler<any>,
+    onClick?: React.MouseEventHandler<HTMLUListElement>,
 }, any> {}
 
 export class Card extends Component { }
diff --git a/types/react-onsenui/react-onsenui-tests.tsx b/types/react-onsenui/react-onsenui-tests.tsx
index c3c9486e88..9d5c86682f 100644
--- a/types/react-onsenui/react-onsenui-tests.tsx
+++ b/types/react-onsenui/react-onsenui-tests.tsx
@@ -1,6 +1,9 @@
 import * as React from "react";
 import * as ReactDOM from "react-dom";
-import { SplitterSide, Splitter, SplitterContent, Page } from "react-onsenui";
+import {
+    SplitterSide, Splitter, SplitterContent,
+    Page, Input, Button,
+} from "react-onsenui";
 
 class AppState {
     isOpen = false;
@@ -34,6 +37,8 @@ export class App extends React.Component<AppProps, AppState> {
                 <SplitterContent>
                     <Page>
                         Test page
+                        <Input name='test' type='text' value='test' onChange={onChange} />
+                        <Button onClick={onClick} />
 					</Page>
                 </SplitterContent>
             </Splitter>
@@ -42,3 +47,6 @@ export class App extends React.Component<AppProps, AppState> {
 }
 
 ReactDOM.render(<App />, document.getElementById('react-body'));
+
+function onChange(event: React.ChangeEvent<HTMLInputElement>) { }
+function onClick(event: React.MouseEvent<HTMLButtonElement>) { }