Add ordinary inputs for comparison

Author: ArtyomVancyan

development/src/AntDemo.tsx

@@ -1,6 +1,7 @@
 import {useState} from "react";
 import Form from "antd/es/form";
 import theme from "antd/es/theme";
+import Input from "antd/es/input";
 import Button from "antd/es/button";
 import Card from "antd/es/card/Card";
 import FormItem from "antd/es/form/FormItem";
@@ -47,6 +48,9 @@ const AntDemo = () => {
 						<FormItem name="phone" rules={[{validator}]}>
 							<PhoneInput enableSearch onChange={(e) => setValue(e as any)}/>
 						</FormItem>
+						<FormItem name="test">
+							<Input/>
+						</FormItem>
 						<div style={{display: "flex", gap: 24}}>
 							<Button htmlType="reset">Reset Value</Button>
 							<Button onClick={changeTheme}>Change Theme</Button>

development/src/MuiDemo.tsx

@@ -1,8 +1,8 @@
 import {useCallback, useMemo, useState} from "react";
 import {createTheme, ThemeProvider} from "@mui/material/styles";
-import {Button, Container, CssBaseline} from "@mui/material";
+import {Button, Container, CssBaseline, TextField} from "@mui/material";
 
-import CustomInput from "./mui-phone";
+import PhoneInput from "./mui-phone";
 
 const Demo = () => {
 	const [value, setValue] = useState({});
@@ -29,13 +29,14 @@ const Demo = () => {
                         </pre>
 					)}
 					<form noValidate autoComplete="off" onSubmit={e => e.preventDefault()}>
-						<CustomInput
+						<PhoneInput
 							enableSearch
 							error={error}
 							variant="filled"
 							searchVariant="standard"
 							onChange={(e) => setValue(e as any)}
 						/>
+						<TextField variant="filled" style={{marginTop: "1.5rem"}}/>
 						<div style={{display: "flex", gap: 24, marginTop: "1rem"}}>
 							<Button type="reset">Reset Value</Button>
 							<Button onClick={handleThemeChange}>Change Theme</Button>