2021-03-03 21:30:41 +00:00
|
|
|
import React, { useState } from "react";
|
2022-03-16 15:51:02 +00:00
|
|
|
import { EmailSettings } from "../utils/email";
|
2021-03-03 21:30:41 +00:00
|
|
|
import EmailInput from "./";
|
|
|
|
|
|
|
|
const Template = ({
|
|
|
|
allowDomainPunycode,
|
|
|
|
allowLocalPartPunycode,
|
|
|
|
allowDomainIp,
|
|
|
|
allowStrictLocalPart,
|
|
|
|
allowSpaces,
|
|
|
|
allowName,
|
|
|
|
allowLocalDomainName,
|
|
|
|
...rest
|
|
|
|
}) => {
|
|
|
|
const [emailValue, setEmailValue] = useState("");
|
|
|
|
|
|
|
|
const onChangeHandler = (value) => {
|
|
|
|
setEmailValue(value);
|
|
|
|
};
|
2022-03-16 15:51:02 +00:00
|
|
|
const settings = EmailSettings.parse({
|
2021-03-03 21:30:41 +00:00
|
|
|
allowDomainPunycode,
|
|
|
|
allowLocalPartPunycode,
|
|
|
|
allowDomainIp,
|
|
|
|
allowStrictLocalPart,
|
|
|
|
allowSpaces,
|
|
|
|
allowName,
|
|
|
|
allowLocalDomainName,
|
2022-03-16 15:51:02 +00:00
|
|
|
});
|
2021-03-03 21:30:41 +00:00
|
|
|
return (
|
|
|
|
<EmailInput
|
|
|
|
{...rest}
|
|
|
|
value={emailValue}
|
|
|
|
emailSettings={settings}
|
|
|
|
onValidateInput={(isEmailValid) => rest.onValidateInput(isEmailValid)}
|
|
|
|
onChange={(e) => {
|
|
|
|
rest.onChange(e.target.value);
|
|
|
|
onChangeHandler(e.target.value);
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
2021-03-04 22:58:36 +00:00
|
|
|
export const basic = Template.bind({});
|
|
|
|
basic.args = {
|
2021-03-03 21:30:41 +00:00
|
|
|
allowDomainPunycode: false,
|
|
|
|
allowLocalPartPunycode: false,
|
|
|
|
allowDomainIp: false,
|
|
|
|
allowSpaces: false,
|
|
|
|
allowName: false,
|
|
|
|
allowLocalDomainName: false,
|
|
|
|
allowStrictLocalPart: true,
|
|
|
|
placeholder: "Input email",
|
|
|
|
size: "base",
|
|
|
|
};
|