import * as React from "react";
import { render } from "react-dom";
import "antd/dist/antd.css";
type ChildrenProps = {
parent: {
onChange1: (e: React.ChangeEvent<HTMLInputElement>) => void,
onChange2: (e: React.ChangeEvent<HTMLInputElement>) => void,
}
};
const Children = (props: ChildrenProps) => <div>
<input type="text" onChange={props.parent.onChange1}/>
<input type="text" onChange={props.parent.onChange2}/>
</div>;
const Auth = () => {
const onChange1 = useCallback((e: React.ChangeEvent<HTMLInputElement>) => alert(1), []);
const onChange2 = useCallback((e: React.ChangeEvent<HTMLInputElement>) => alert(2), []);
return <Children parent={{onChange1, onChange2}}/>
}
const App = () => <Auth/>;
render(<App />, document.getElementById("root"));