handle additional onChange

README.md

@@ -217,6 +217,27 @@ function App() {
     );
 }
 ```
+### additional onChange (available from v1.1.0)
+You may want to add additional onChange functions when you write into input.
+<br/>
+You can do that by adding your onChange from object. Note that you will get the value as always.
+<br/>
+Example:
+```js
+const [surname, inputSurname] = useInput({
+    defaultValue: test,
+   onChange: (e) => console.log("print the event: ", e)
+})
+```
+same for `useInputCheckbox`
+```js
+const [checkbox, inputCheckbox] = useInputCheckbox({
+    defaultChecked: true,
+   onChange: (e) => {
+        console.log("additional function. Print event: ", e)
+   }
+})
+```
 
 ## 💻 Demo
 

demo/src/App.js

@@ -5,7 +5,7 @@ import {
 } from "./lib";
 
 // if input props will not change, you can declare them outside the render cycle for better performance.
-const surnameProps = {style: {background: "azure"}, placeholder: "insert some text here..",}
+const surnameProps = {style: {background: "azure"}, placeholder: "insert some text here..", onChange: (e) => console.log(e)}
 
 function App() {
   const [name, inputName] = useInput(

src/useInputs.tsx

@@ -6,15 +6,21 @@ type inputDefaultValue = string | number | ReadonlyArray<string> | undefined
 export const useInput = (props?: InputHTMLAttributes<HTMLInputElement>) => {
     const [value, setValue] = useState<inputDefaultValue>(props?.defaultValue)
     const input = useMemo(() => (
-        <input {...props} type={props?.type || "text"} onChange={(event) => setValue(event.target.value)}/>
+        <input {...props} type={props?.type || "text"} onChange={(event) => {
+            props?.onChange && props.onChange(event)
+            setValue(event.target.value)
+        }}/>
     ), [props])
     return [value, input]
 }
 
 export function useInputCheckbox(props?: InputHTMLAttributes<HTMLInputElement>) {
     const [value, setValue] = useState<boolean>(props?.defaultChecked || false)
     const input = useMemo(() => (
-        <input {...props} type={"checkbox"} onChange={(event) => setValue(event.target.checked)}/>
+        <input {...props} type={"checkbox"} onChange={(event) => {
+            props?.onChange && props.onChange(event)
+            setValue(event.target.checked)
+        }}/>
     ), [props])
     return [value, input]
 }