{"version":3,"sources":["components/SignupPopup/SignupPopup.tsx","components/UI/CustomButton.tsx","components/UI/InputV4.tsx"],"names":["EMAIL_CHECK_QUERY","UPDATE_CASHOFFER_USER","UPDATE_PROFILE","LOGIN_MUTATION","CREATE_ACCOUNT_MUTATION","USER_EXISTS","UNABLE_TO_REGISTER","create","name","form","signupVisible","useAuthPopupState","dispatch","useAuthPopupDispatch","React","useState","ziperror","setziperror","confirmEmailDirty","setConfirmEmailDirty","disabled","setdisabled","useMutation","onCompleted","data","getupdateProfile","type","args","result3","message","description","onError","err","graphQLErrors","extensions","response","status","displayMsg","error","console","executeUpdateProfile","updateProfileResult","loading","setLoading","skipQuery","setSkipQuery","setErrorMessage","setmakeCreateCall","confirmPasswordDirty","setConfirmPasswordDirty","showVerificationCodeInput","setShowVerificationCodeInput","resetForm","resetFields","updateCashOfferUser","result2","_","updatePassword","generateVerificationCode","email","a","fetch","environmentVariableList","AUTH_API_ENDPOINT","method","headers","Headers","Accept","body","JSON","stringify","ok","json","Error","statusText","ERROR_MESSAGE","fetchFailed","default","log","requestFailed","useLazyQuery","fetchPolicy","getUserByEmail","Success","IsSocialLogin","SocialLoginProvider","StatusId","Email","executeSignup","variables","DisplayName","getFieldValue","Email2","FirstName","LastName","Mobile","replace","Password","Zip","OptinMarketingEmail","includes","setFields","errors","executeEmailCheckQuery","emailCheckQueryResult","authLogin","errorTitle","errorMessage","executeLogin","loginResult","signup","TagManager","initialize","gtmId","REACT_APP_GTM_ID","dataLayer","event","eventCategory","eventAction","eventLabel","e","signupResult","setvinvalue","target","getFieldsValue","firstName","lastName","phonenumber","email2","optinMarketing","zipcode","UserNotificationPreferences","password","Username","verification","VerificationCode","Isvalid","updateInput","UserEmail","input","result","confirmToNames","value","callback","validationResult","validateName","length","destroyOnClose","closable","footer","title","css","breakpoints","sm","alt","src","require","style","top","borderRadius","visible","onCancel","preventDefault","stopPropagation","content","property","hideRequiredMark","layout","onSubmit","validateFieldsAndScroll","values","termsOfUse","warning","Item","getFieldDecorator","normalize","v","trimStart","rules","required","validator","Label","key","extra","validateFields","force","toLowerCase","onBlur","validatePassword","isPassword","onChange","len","maxLength","span","size","autoComplete","initialValue","href","lg","md","onClick","htmlType","CustomButton","filled","children","props","bgColor","colors","darkCharcoal","textColor","BlueLinkButton","blue","InputV4","forwardRef","_ref","hasIn","onPaste","isPricing","Suffix","ref","useRef","current","prefix","placeholder","data-automation-id","suffix"],"mappings":"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","file":"static/js/37.bcc955be.chunk.js","sourcesContent":["import {\r\n  Button,\r\n  Checkbox,\r\n  Col,\r\n  Form,\r\n  Input,\r\n  Row,\r\n  Spin,\r\n  message,\r\n  notification,\r\n} from \"antd\";\r\nimport { ERROR_MESSAGE, breakpoints } from \"../../constants\";\r\nimport {\r\n  Mutation,\r\n  Query,\r\n  UpdateCashOfferUserInput,\r\n} from \"../../generated/graphql\";\r\nimport React, { useState } from \"react\";\r\nimport {\r\n  useAuthPopupDispatch,\r\n  useAuthPopupState,\r\n} from \"../../context/AuthPopupContext\";\r\nimport { useLazyQuery, useMutation } from \"@apollo/react-hooks\";\r\nimport { validateName, validatePassword } from \"../../utils/validate\";\r\n\r\nimport { BlueLinkButton } from \"../UI/CustomButton\";\r\nimport { FormComponentProps } from \"antd/lib/form\";\r\nimport { Helmet } from \"react-helmet\";\r\nimport { InputV4 } from \"../UI/InputV4\";\r\nimport { Modal } from \"antd\";\r\nimport TagManager from \"react-gtm-module\";\r\nimport { css } from \"@emotion/core\";\r\nimport { environmentVariableList } from \"../../config/env\";\r\nimport { loader } from \"graphql.macro\";\r\n\r\nconst EMAIL_CHECK_QUERY = loader(\"./emailCheckQuery.graphql\");\r\nconst UPDATE_CASHOFFER_USER = loader(\"./updateCashOfferUserMutation.graphql\");\r\nconst UPDATE_PROFILE = loader(\"./updateProfileMutation.graphql\");\r\nconst LOGIN_MUTATION = loader(\"./loginMutation.graphql\");\r\nconst CREATE_ACCOUNT_MUTATION = loader(\"./createAccountMutation.graphql\");\r\nconst USER_EXISTS =\r\n    \"The email you entered already has an account tied to it. Please log in with that email or select Forgot Password to reset it.\",\r\n  UNABLE_TO_REGISTER =\r\n    \"Your account cannot be created at this time. Please try again.\";\r\n\r\nconst SignupPopup: React.FC<FormComponentProps> = ({ form }) => {\r\n  const { signupVisible } = useAuthPopupState();\r\n  const dispatch = useAuthPopupDispatch();\r\n\r\n  const [ziperror, setziperror] = React.useState<boolean>(false);\r\n  const [confirmEmailDirty, setConfirmEmailDirty] = React.useState<boolean>(\r\n    false\r\n  );\r\n  const [disabled, setdisabled] = React.useState<boolean>(false);\r\n  const [executeUpdateProfile, updateProfileResult] = useMutation<Mutation>(\r\n    UPDATE_PROFILE,\r\n    {\r\n      onCompleted: (data) => {\r\n        if (data && data !== null && data.getupdateProfile) {\r\n          dispatch({\r\n            type: \"POST_UPDATE_SUCCESS\",\r\n            args: data.getupdateProfile,\r\n          });\r\n          result3();\r\n          const displayMsg = \"Successfully uploaded details.\";\r\n          notification[\"success\"]({\r\n            message: \"Success\",\r\n            description: displayMsg,\r\n          });\r\n        }\r\n      },\r\n      onError: (err) => {\r\n        try {\r\n          const status =\r\n            err &&\r\n            err.graphQLErrors[0] &&\r\n            err.graphQLErrors[0].extensions &&\r\n            err.graphQLErrors[0].extensions.response &&\r\n            err.graphQLErrors[0].extensions.response.status;\r\n\r\n          if (status === 500) {\r\n            return notification[\"error\"]({\r\n              message: \"Error\",\r\n              description:\r\n                `First and Last Name can only have 50 characters.` ||\r\n                \"Could not Update account\",\r\n            });\r\n          }\r\n\r\n          const displayMsg = err && err.graphQLErrors[0].message;\r\n          if (displayMsg === \"Invalid Zipcode.\") {\r\n            setziperror(true);\r\n          }\r\n          notification[\"error\"]({\r\n            message: \"Error\",\r\n            description: displayMsg || \"Could not Update account\",\r\n          });\r\n        } catch (error) {\r\n          console.error(error);\r\n        }\r\n      },\r\n    }\r\n  );\r\n  const [loading, setLoading] = useState(false);\r\n  const [skipQuery, setSkipQuery] = useState(true);\r\n  const [errorMessage, setErrorMessage] = useState(\"\");\r\n  const [makeCreateCall, setmakeCreateCall] = React.useState<boolean>(false);\r\n  const [confirmPasswordDirty, setConfirmPasswordDirty] = React.useState<\r\n    boolean\r\n  >(false);\r\n  const [showVerificationCodeInput, setShowVerificationCodeInput] = useState(\r\n    false\r\n  );\r\n  const resetForm = () => {\r\n    form.resetFields();\r\n    setConfirmEmailDirty(false);\r\n    setConfirmPasswordDirty(false);\r\n    setmakeCreateCall(false);\r\n    setdisabled(false);\r\n  };\r\n\r\n  const [updatePassword, updatePasswordResult] = useMutation<Mutation>(\r\n    UPDATE_CASHOFFER_USER,\r\n    {\r\n      onCompleted: (data) => {\r\n        if (data && data.updateCashOfferUser) {\r\n          notification[\"success\"]({\r\n            message: \"User Created successfully\",\r\n            description: \"New User created successfully\",\r\n          });\r\n          result2();\r\n          // resetForm();\r\n        } else {\r\n          notification[\"error\"]({\r\n            message: \"Error\",\r\n            description:\r\n              \"We are not able to complete this, please try again later\",\r\n          });\r\n        }\r\n      },\r\n      onError: (_) => {\r\n        notification[\"error\"]({\r\n          message: \"Error\",\r\n          description:\r\n            \"We are not able to complete this, please try again later\",\r\n        });\r\n      },\r\n    }\r\n  );\r\n  const generateVerificationCode = async (email: string) => {\r\n    try {\r\n      setLoading(true);\r\n      setErrorMessage(\"\");\r\n      const response = await fetch(\r\n        `${environmentVariableList.AUTH_API_ENDPOINT}/api/Authentication/GenerateCOVerificationCode`,\r\n        {\r\n          method: \"POST\",\r\n          headers: new Headers({\r\n            Accept: \"application/json\",\r\n            \"Content-Type\": \"application/json\",\r\n          }),\r\n          body: JSON.stringify({\r\n            email,\r\n          }),\r\n        }\r\n      );\r\n\r\n      if (!response.ok) {\r\n        if (!response.json) {\r\n          throw Error(response.statusText || ERROR_MESSAGE.fetchFailed);\r\n        }\r\n\r\n        //todo: ask Komal to update error response from api\r\n        throw Error(ERROR_MESSAGE.default);\r\n      }\r\n      console.log(\"verification code\");\r\n      setShowVerificationCodeInput(true);\r\n    } catch (error) {\r\n      let message = \"\";\r\n\r\n      switch (error.message) {\r\n        case ERROR_MESSAGE.fetchFailed:\r\n          message = ERROR_MESSAGE.requestFailed;\r\n          break;\r\n        default:\r\n          message = error.message;\r\n      }\r\n      console.error(message);\r\n      setErrorMessage(message);\r\n    } finally {\r\n      setLoading(false);\r\n      setSkipQuery(true);\r\n    }\r\n  };\r\n\r\n  const [executeEmailCheckQuery, emailCheckQueryResult] = useLazyQuery<Query>(\r\n    EMAIL_CHECK_QUERY,\r\n    {\r\n      fetchPolicy: \"network-only\",\r\n      onCompleted: (data) => {\r\n        if (!skipQuery) {\r\n          setSkipQuery(true);\r\n          if (data && data.getUserByEmail && data.getUserByEmail.Success) {\r\n            if (data.getUserByEmail.IsSocialLogin) {\r\n              // For social login, ask user to login through social button\r\n              notification[\"info\"]({\r\n                message: `${data.getUserByEmail.SocialLoginProvider} user`,\r\n                description: `Please use the Continue with ${data.getUserByEmail.SocialLoginProvider} button to login`,\r\n              });\r\n            } else if (data.getUserByEmail.StatusId === 9) {\r\n              notification[\"info\"]({\r\n                message: `Verification Required`,\r\n                description: `Please check your email: ${data.getUserByEmail.Email} for the verification code sent and verify code to continue.`,\r\n              });\r\n              generateVerificationCode(data.getUserByEmail.Email);\r\n              setdisabled(true);\r\n            } else if (!showVerificationCodeInput) {\r\n              console.log(\"verification4 called\");\r\n              executeSignup({\r\n                variables: {\r\n                  DisplayName: form.getFieldValue(\"email\"),\r\n                  Email: form.getFieldValue(\"email\"),\r\n                  Email2: form.getFieldValue(\"email\"),\r\n                  FirstName: form.getFieldValue(\"firstName\"),\r\n                  LastName: form.getFieldValue(\"lastName\"),\r\n                  Mobile: form\r\n                    .getFieldValue(\"phonenumber\")\r\n                    .replace(/[^0-9]/g, \"\"),\r\n                  Password: form.getFieldValue(\"password\"),\r\n                  Zip: form.getFieldValue(\"zipcode\"),\r\n                  OptinMarketingEmail: form.getFieldValue(\"optinMarketing\"),\r\n                },\r\n              });\r\n            }\r\n          }\r\n        }\r\n      },\r\n      onError: (error) => {\r\n        console.error(error, error.message);\r\n        let message = \"\";\r\n        setSkipQuery(true);\r\n        if (error.message.includes(\"body\")) {\r\n          if (!showVerificationCodeInput && !skipQuery) {\r\n            console.log(\"verification5 called\");\r\n            executeSignup({\r\n              variables: {\r\n                DisplayName: form.getFieldValue(\"email\"),\r\n                Email: form.getFieldValue(\"email\"),\r\n                Email2: form.getFieldValue(\"email\"),\r\n                FirstName: form.getFieldValue(\"firstName\"),\r\n                LastName: form.getFieldValue(\"lastName\"),\r\n                Mobile: form\r\n                  .getFieldValue(\"phonenumber\")\r\n                  .replace(/[^0-9]/g, \"\"),\r\n                Password: form.getFieldValue(\"password\"),\r\n                Zip: form.getFieldValue(\"zipcode\"),\r\n                OptinMarketingEmail: form.getFieldValue(\"optinMarketing\"),\r\n              },\r\n            });\r\n          }\r\n        }\r\n        if (error.message.includes(\"Network error\")) {\r\n          message = ERROR_MESSAGE.requestFailed;\r\n          form.setFields({\r\n            email: {\r\n              errors: [new Error(message)],\r\n            },\r\n          });\r\n        }\r\n      },\r\n    }\r\n  );\r\n  const [executeLogin, loginResult] = useMutation<Mutation>(LOGIN_MUTATION, {\r\n    onCompleted: (data) => {\r\n      if (data && data.authLogin) {\r\n        dispatch({\r\n          type: \"POST_LOGIN_SUCCESS\",\r\n          args: data.authLogin,\r\n        });\r\n        dispatch({\r\n          type: \"HIDE_AUTH_POPUP\",\r\n        });\r\n        resetForm();\r\n        setSkipQuery(true);\r\n      }\r\n    },\r\n    onError: (err) => {\r\n      console.error(err);\r\n\r\n      let errorTitle = \"Error\";\r\n      let errorMessage =\r\n        err.message || \"Something went wrong. Please try again.\";\r\n\r\n      if (err.message.includes(\"GraphQL error\")) {\r\n        let errorDetail =\r\n          (err &&\r\n            err!.graphQLErrors[0] &&\r\n            err!.graphQLErrors[0]!.extensions &&\r\n            err!.graphQLErrors[0]!.extensions!.error) ||\r\n          \"\";\r\n\r\n        errorMessage = err.graphQLErrors[0] && err.graphQLErrors[0].message;\r\n\r\n        if (errorMessage === \"User name already exists\") {\r\n          errorTitle = \"Email Already Exists\";\r\n          errorMessage = USER_EXISTS;\r\n          errorDetail = USER_EXISTS;\r\n        }\r\n      } else if (err.message.includes(\"Network error: Failed to fetch\")) {\r\n        errorTitle = \"Network Error\";\r\n        errorMessage = UNABLE_TO_REGISTER;\r\n      }\r\n\r\n      notification[\"error\"]({\r\n        message: errorTitle,\r\n        description: errorMessage,\r\n      });\r\n    },\r\n  });\r\n\r\n  const [executeSignup, signupResult] = useMutation<Mutation>(\r\n    CREATE_ACCOUNT_MUTATION,\r\n    {\r\n      onCompleted: (data) => {\r\n        if (data && data.signup) {\r\n          dispatch({\r\n            type: \"POST_LOGIN_SUCCESS\",\r\n            args: data.signup,\r\n          });\r\n          notification[\"success\"]({\r\n            message: \"New User created.\",\r\n            description: \"New user successfully created.\",\r\n          });\r\n          resetForm();\r\n\r\n          try {\r\n            // Send google tag event\r\n            TagManager.initialize({\r\n              gtmId: environmentVariableList.REACT_APP_GTM_ID || \"\",\r\n              dataLayer: {\r\n                event: \"GAEvent\",\r\n                eventCategory: \"Account Management\",\r\n                eventAction: \"Create Account\",\r\n                eventLabel: \"Registered\",\r\n              },\r\n            });\r\n            // Segment event\r\n            // window.analytics.track(\"Account Created\", {\r\n            //   state: data.signup.State,\r\n            //   zip: data.signup.Zip,\r\n            // });\r\n          } catch (e) {\r\n            console.error(e);\r\n          }\r\n        }\r\n      },\r\n      onError: (err) => {\r\n        console.error(err);\r\n\r\n        let errorTitle = \"Error\";\r\n        let errorMessage =\r\n          err.message || \"Something went wrong. Please try again.\";\r\n\r\n        if (err.message.includes(\"GraphQL error\")) {\r\n          let errorDetail =\r\n            (err &&\r\n              err!.graphQLErrors[0] &&\r\n              err!.graphQLErrors[0]!.extensions &&\r\n              err!.graphQLErrors[0]!.extensions!.error) ||\r\n            \"\";\r\n\r\n          errorMessage = err.graphQLErrors[0] && err.graphQLErrors[0].message;\r\n\r\n          if (errorMessage === \"User name already exists\") {\r\n            errorTitle = \"Email Already Exists\";\r\n            errorMessage = USER_EXISTS;\r\n            errorDetail = USER_EXISTS;\r\n          }\r\n        } else if (err.message.includes(\"Network error: Failed to fetch\")) {\r\n          errorTitle = \"Network Error\";\r\n          errorMessage = UNABLE_TO_REGISTER;\r\n        }\r\n\r\n        notification[\"error\"]({\r\n          message: errorTitle,\r\n          description: errorMessage,\r\n        });\r\n      },\r\n    }\r\n  );\r\n  const setvinvalue = (e: any) => {\r\n    if (e.target.name === \"password\") {\r\n      console.log(\"text\");\r\n    }\r\n  };\r\n  const result2 = async () => {\r\n    const {\r\n      firstName,\r\n      lastName,\r\n      phonenumber,\r\n      email,\r\n      email2,\r\n      optinMarketing,\r\n      zipcode,\r\n    } = form.getFieldsValue();\r\n    await executeUpdateProfile({\r\n      variables: {\r\n        Email: email,\r\n        Email2: email2,\r\n        FirstName: firstName,\r\n        LastName: lastName,\r\n        Mobile: phonenumber.replace(/[^0-9]/g, \"\"),\r\n        Zip: zipcode,\r\n        //  UserUuid: Uuid,\r\n        UserNotificationPreferences: optinMarketing === true ? \"1,2\" : \"1\",\r\n        //  canReceiveSMS === true ? \"1,2\" : \"1\",\r\n      },\r\n    });\r\n  };\r\n  const result3 = async () => {\r\n    const { email, password } = form.getFieldsValue();\r\n    setShowVerificationCodeInput(false);\r\n    setSkipQuery(true);\r\n    await executeLogin({\r\n      variables: {\r\n        Password: password,\r\n        Username: email,\r\n      },\r\n    });\r\n  };\r\n  const verification = async () => {\r\n    console.log(\"verif called\");\r\n    if (showVerificationCodeInput) {\r\n      console.log(\"verification1 called\");\r\n      try {\r\n        setLoading(true);\r\n        setErrorMessage(\"\");\r\n        const response = await fetch(\r\n          `${environmentVariableList.AUTH_API_ENDPOINT}/api/Authentication/ValidateVerificationCode`,\r\n          {\r\n            method: \"POST\",\r\n            headers: new Headers({\r\n              Accept: \"application/json\",\r\n              \"Content-Type\": \"application/json\",\r\n            }),\r\n            body: JSON.stringify({\r\n              VerificationCode: form.getFieldValue(\"code\"),\r\n              email: form.getFieldValue(\"email\"),\r\n            }),\r\n          }\r\n        );\r\n\r\n        if (!response.ok) {\r\n          if (!response.json) {\r\n            notification[\"error\"]({\r\n              message: \"Error\",\r\n              description: \"Please check the verification code\",\r\n            });\r\n            throw Error(response.statusText || ERROR_MESSAGE.fetchFailed);\r\n          }\r\n\r\n          //todo: ask Komal to update error response from api\r\n          throw Error(ERROR_MESSAGE.default);\r\n        }\r\n\r\n        const result = await response.json();\r\n\r\n        if (result.Isvalid) {\r\n          //  setShowCreatePasswordInput(true);\r\n          console.log(\"valid\");\r\n          const updateInput: UpdateCashOfferUserInput = {\r\n            Password: form.getFieldValue(\"password\"),\r\n            UserEmail: form.getFieldValue(\"email\"),\r\n          };\r\n\r\n          const result = async () => {\r\n            await updatePassword({\r\n              variables: {\r\n                input: updateInput,\r\n              },\r\n            });\r\n          };\r\n\r\n          result();\r\n        } else {\r\n          notification[\"error\"]({\r\n            message: \"Something went wrong\",\r\n            description:\r\n              \"Looks like there was an error while processing,Please check the verification code and try again..\",\r\n          });\r\n          throw Error(\"Invalid code, please try again.\");\r\n        }\r\n      } catch (error) {\r\n        let message = \"\";\r\n\r\n        switch (error.message) {\r\n          case ERROR_MESSAGE.fetchFailed:\r\n            message = ERROR_MESSAGE.requestFailed;\r\n            break;\r\n          default:\r\n            message = error.message;\r\n        }\r\n        notification[\"error\"]({\r\n          message: \"Something went wrong\",\r\n          description:\r\n            \"Looks like there was an error while processing,Please check the verification code and try again..\",\r\n        });\r\n        console.error(message);\r\n        setErrorMessage(message);\r\n      } finally {\r\n        setLoading(false);\r\n      }\r\n    } else if (!showVerificationCodeInput) {\r\n      console.log(\"verification2 called\");\r\n\r\n      await executeEmailCheckQuery({\r\n        variables: {\r\n          email: form.getFieldValue(\"email\"),\r\n        },\r\n      });\r\n    }\r\n  };\r\n\r\n  // const [executePostSignup] = useMutation<Mutation>(POST_SIGNUP_MUTATION);\r\n  const handleSubmit = (e: React.FormEvent) => {\r\n    e.preventDefault();\r\n    e.stopPropagation();\r\n    setSkipQuery(false);\r\n    console.log(\"called!\");\r\n    form.validateFieldsAndScroll(async (error, values) => {\r\n      if (values.termsOfUse !== true) {\r\n        message.warning(\"Please agree to our Terms of Use and Privacy Policy\");\r\n        return;\r\n      }\r\n      if (!error) {\r\n        verification();\r\n      }\r\n    });\r\n  };\r\n  const confirmToFirstEmail = (_: any, value: any, callback: any) => {\r\n    if (\r\n      value &&\r\n      value.toLowerCase() !== form.getFieldValue(\"email\").toLowerCase()\r\n    ) {\r\n      callback(\"Please confirm that you entered the same email.\");\r\n    } else {\r\n      callback();\r\n    }\r\n  };\r\n  const confirmToNextEmail = (_: any, value: any, callback: any): void => {\r\n    if (value && confirmEmailDirty) {\r\n      form.validateFields([\"emailConfirm\"], {\r\n        force: true,\r\n      });\r\n    }\r\n    callback();\r\n  };\r\n  const handlePasswordConfirmBlur = (e: React.FocusEvent<HTMLInputElement>) => {\r\n    const value = e.target.value;\r\n    setConfirmPasswordDirty(confirmPasswordDirty || !!value);\r\n  };\r\n\r\n  const confirmToNextPassword = (_: any, value: any, callback: any): void => {\r\n    const validationResult = validatePassword(value);\r\n    if (value && validationResult.length > 0) {\r\n      callback(`Must contain at least ${validationResult}`);\r\n    }\r\n    if (value && confirmPasswordDirty) {\r\n      form.validateFields([\"passwordConfirm\"], {\r\n        force: true,\r\n      });\r\n    }\r\n    callback();\r\n  };\r\n\r\n  const confirmToFirstPassword = (_: any, value: any, callback: any): void => {\r\n    if (value && value !== form.getFieldValue(\"password\")) {\r\n      callback(\"Please confirm you enter the same password\");\r\n    } else {\r\n      callback();\r\n    }\r\n  };\r\n\r\n  const confirmToNames = (_: any, value: any, callback: any): void => {\r\n    const validationResult = validateName(value);\r\n    if (value && validationResult.length > 0) {\r\n      callback(`${validationResult}`);\r\n    } else {\r\n      callback();\r\n    }\r\n  };\r\n\r\n  return (\r\n    <Modal\r\n      destroyOnClose\r\n      closable={true}\r\n      footer={null}\r\n      title={\r\n        <div\r\n          css={css`\r\n            @media (min-width: ${breakpoints.sm}) {\r\n              display: none !important;\r\n            }\r\n            display: flex;\r\n            justify-content: center;\r\n            align-items: center;\r\n            height: 56px;\r\n            width: 205px;\r\n          `}\r\n        >\r\n          <img\r\n            css={css`\r\n              width: 100%;\r\n              height: 16px;\r\n            `}\r\n            alt={\"Rumbleon\"}\r\n            src={require(\"../Layout/images/rumbleon-black-logo.svg\")}\r\n          />\r\n        </div>\r\n      }\r\n      style={{ top: \"5%\", borderRadius: \"3px\" }}\r\n      visible={signupVisible}\r\n      onCancel={(e: any) => {\r\n        e.preventDefault();\r\n        e.stopPropagation();\r\n        if (\r\n          signupResult.loading ||\r\n          loginResult.loading ||\r\n          updateProfileResult.loading ||\r\n          emailCheckQueryResult.loading\r\n        )\r\n          return;\r\n        dispatch({\r\n          type: \"HIDE_AUTH_POPUP\",\r\n        });\r\n      }}\r\n      css={css`\r\n        display: flex;\r\n        justify-content: center;\r\n        align-items: center;\r\n\r\n        .ant-modal-close-x {\r\n          display: block;\r\n          width: 30px;\r\n          height: 30px;\r\n          font-size: 16px;\r\n          font-style: normal;\r\n          line-height: 30px;\r\n          text-align: center;\r\n          text-transform: none;\r\n          border-radius: 15px;\r\n          text-rendering: auto;\r\n        }\r\n        .ant-modal-body {\r\n          padding: 27px;\r\n        }\r\n        .ant-modal-header {\r\n          border: none;\r\n        }\r\n        @media (max-width: ${breakpoints.sm}) {\r\n          margin: 0 !important;\r\n          max-width: 100% !important;\r\n          top: 0 !important;\r\n          font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n          font-weight: bold;\r\n          width: 100% !important;\r\n\r\n          .ant-modal-header {\r\n            border-bottom: 1px solid #e0e0e0;\r\n          }\r\n          .ant-modal-close-x {\r\n            position: absolute;\r\n            top: 29px;\r\n            right: 15px;\r\n            display: block;\r\n            font-size: 20px;\r\n            font-style: normal;\r\n            line-height: 30px;\r\n            text-align: center;\r\n            text-transform: none;\r\n            border-radius: 15px;\r\n            text-rendering: auto;\r\n            color: #212121;\r\n          }\r\n          .ant-modal-content {\r\n            width: 100%;\r\n            position: absolute;\r\n            top: 0;\r\n          }\r\n        }\r\n      `}\r\n    >\r\n      <Helmet>\r\n        <title>RumbleOn | Sign Up</title>\r\n        <meta\r\n          name=\"description\"\r\n          content=\"Sign up on RumbleOn Classifieds to list a motorcycle for sale, or buy used vehicles near you.\"\r\n        />\r\n        <meta property=\"og:title\" content=\"RumbleOn Classifieds | Sign Up\" />\r\n        <meta\r\n          property=\"og:description\"\r\n          content=\"Sign up to browse vehicles for sale near you or list a vehicle for sale.\"\r\n        />\r\n        <meta\r\n          property=\"og:image\"\r\n          content=\"https://go.rumbleon.com/hubfs/Classifieds%20OG/Core/signup.png\"\r\n        />\r\n      </Helmet>\r\n      <Form\r\n        hideRequiredMark={true}\r\n        layout=\"vertical\"\r\n        onSubmit={handleSubmit}\r\n        css={css`\r\n          // border: 1px solid black;\r\n          // padding: 20px 25px !important;\r\n          h3 {\r\n            text-align: center;\r\n            font-size: 18px;\r\n            font-weight: bold;\r\n            font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n            margin-bottom: 20px;\r\n          }\r\n          p {\r\n            font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n            color: #2b2b2b;\r\n          }\r\n          span {\r\n            font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n            color: #2b2b2b;\r\n          }\r\n          a {\r\n            text-decoration: underline;\r\n            font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n          }\r\n          .ant-form-extra {\r\n            text-transform: uppercase;\r\n            fontfamily: InterStateRegular;\r\n            text-align: start !important;\r\n            padding-left: 12px;\r\n            font-size: 12px;\r\n            color: #2b2b2b;\r\n          }\r\n          .ant-input-wrapper {\r\n            display: flex;\r\n            flex-direction: column-reverse;\r\n          }\r\n          .has-error .ant-form-explain,\r\n          .has-error .ant-form-split {\r\n            color: #f5222d;\r\n            text-align: start;\r\n            padding-left: 12px !important;\r\n            font-size: 12px;\r\n          }\r\n          .has-error .ant-input-group-addon {\r\n            color: #454545;\r\n          }\r\n        `}\r\n      >\r\n        <h3>Create An Account</h3>\r\n        <div>\r\n          <Form.Item>\r\n            {form.getFieldDecorator(\"firstName\", {\r\n              normalize: (v: string) => (v ? v.trimStart() : \"\"),\r\n              rules: [\r\n                {\r\n                  required: true,\r\n                  message: \"Please enter your first name\",\r\n                },\r\n                {\r\n                  validator: confirmToNames,\r\n                },\r\n              ],\r\n            })(\r\n              <InputV4\r\n                Label={\"First name\"}\r\n                // onChange={setvinvalue}\r\n                key=\"First name\"\r\n                disabled={\r\n                  signupResult.loading ||\r\n                  loginResult.loading ||\r\n                  emailCheckQueryResult.loading ||\r\n                  updateProfileResult.loading\r\n                }\r\n              />\r\n            )}\r\n          </Form.Item>\r\n          <Form.Item>\r\n            {form.getFieldDecorator(\"lastName\", {\r\n              normalize: (v: string) => (v ? v.trimStart() : \"\"),\r\n              rules: [\r\n                {\r\n                  required: true,\r\n                  message: \"Please enter your last name\",\r\n                },\r\n                {\r\n                  validator: confirmToNames,\r\n                },\r\n              ],\r\n            })(\r\n              <InputV4\r\n                Label={\"Last name\"}\r\n                // onChange={setvinvalue}\r\n                key=\"Last name\"\r\n                disabled={\r\n                  signupResult.loading ||\r\n                  loginResult.loading ||\r\n                  updateProfileResult.loading ||\r\n                  emailCheckQueryResult.loading\r\n                }\r\n              />\r\n            )}\r\n          </Form.Item>\r\n          <Form.Item extra=\"For account creation only - Remains Private\">\r\n            {form.getFieldDecorator(\"email\", {\r\n              rules: [\r\n                {\r\n                  required: true,\r\n                  message: \"Please enter your email\",\r\n                },\r\n                {\r\n                  type: \"email\",\r\n                  message: \"Please enter a valid email\",\r\n                },\r\n                {\r\n                  validator: confirmToNextEmail,\r\n                },\r\n              ],\r\n            })(\r\n              <InputV4\r\n                Label={\"Email\"}\r\n                // onChange={setvinvalue}\r\n                key=\"Email\"\r\n                type=\"email\"\r\n                disabled={\r\n                  disabled ||\r\n                  signupResult.loading ||\r\n                  loginResult.loading ||\r\n                  updateProfileResult.loading ||\r\n                  emailCheckQueryResult.loading\r\n                }\r\n              />\r\n            )}\r\n          </Form.Item>\r\n          <Form.Item extra=\"For account creation only - Remains Private\">\r\n            {form.getFieldDecorator(\"emailConfirm\", {\r\n              rules: [\r\n                {\r\n                  required: true,\r\n                  message: \"Please re-enter your email\",\r\n                },\r\n                {\r\n                  validator: confirmToFirstEmail,\r\n                },\r\n              ],\r\n            })(\r\n              <InputV4\r\n                Label=\"Confirm email\"\r\n                key={\"ConfirmEmail\"}\r\n                //onPaste={(e: any) => e.preventDefault()}\r\n                onBlur={(e: any) => {\r\n                  const value = e.target.value;\r\n                  setConfirmEmailDirty(confirmEmailDirty || !!value);\r\n                }}\r\n                // onChange={setvinvalue}\r\n                disabled={\r\n                  disabled ||\r\n                  signupResult.loading ||\r\n                  loginResult.loading ||\r\n                  updateProfileResult.loading ||\r\n                  emailCheckQueryResult.loading\r\n                }\r\n              />\r\n            )}\r\n          </Form.Item>\r\n          <Form.Item extra=\"Must contain at least one number, a capital letter, and a minimum of six characters.\">\r\n            {form.getFieldDecorator(\"password\", {\r\n              rules: [\r\n                {\r\n                  required: true,\r\n                  message: \"Please enter your password\",\r\n                },\r\n                {\r\n                  validator: confirmToNextPassword,\r\n                },\r\n              ],\r\n            })(\r\n              <InputV4\r\n                Label=\"Password\"\r\n                isPassword={true}\r\n                key={\"Password\"}\r\n                onChange={setvinvalue}\r\n                disabled={\r\n                  signupResult.loading ||\r\n                  loginResult.loading ||\r\n                  updateProfileResult.loading ||\r\n                  emailCheckQueryResult.loading\r\n                }\r\n              />\r\n            )}\r\n          </Form.Item>\r\n          <Form.Item\r\n            css={css`\r\n              .ant-input-wrapper {\r\n                display: flex;\r\n                flex-direction: column-reverse;\r\n              }\r\n\r\n              .has-error .ant-input-group-addon {\r\n                color: #454545;\r\n              }\r\n            `}\r\n          >\r\n            {form.getFieldDecorator(\"passwordConfirm\", {\r\n              rules: [\r\n                {\r\n                  required: true,\r\n                  message: \"Please enter your password\",\r\n                },\r\n                {\r\n                  validator: confirmToFirstPassword,\r\n                },\r\n              ],\r\n            })(\r\n              <InputV4\r\n                onBlur={handlePasswordConfirmBlur}\r\n                Label=\"Confirm password\"\r\n                key=\"confirmpass\"\r\n                isPassword={true}\r\n                onChange={setvinvalue}\r\n                disabled={\r\n                  signupResult.loading ||\r\n                  loginResult.loading ||\r\n                  updateProfileResult.loading ||\r\n                  emailCheckQueryResult.loading\r\n                }\r\n              />\r\n            )}\r\n          </Form.Item>\r\n          <Form.Item>\r\n            {form.getFieldDecorator(\"zipcode\", {\r\n              normalize: (v: string) => (v ? v.replace(/\\D/g, \"\") : \"\"),\r\n              rules: [\r\n                {\r\n                  required: true,\r\n                  message: \"Please enter your zip code\",\r\n                },\r\n                {\r\n                  len: 5,\r\n                  message: \"Please enter a valid zipcode\",\r\n                },\r\n              ],\r\n            })(\r\n              <div>\r\n                <InputV4\r\n                  maxLength={5}\r\n                  Label=\"Zip Code\"\r\n                  key={\"zip\"}\r\n                  disabled={\r\n                    signupResult.loading ||\r\n                    loginResult.loading ||\r\n                    updateProfileResult.loading ||\r\n                    emailCheckQueryResult.loading\r\n                  }\r\n                />\r\n                {ziperror && (\r\n                  <h5\r\n                    css={css`\r\n                      color: #f5222d;\r\n                    `}\r\n                  >\r\n                    Invalid Zip Code\r\n                  </h5>\r\n                )}\r\n              </div>\r\n            )}\r\n          </Form.Item>\r\n          <Form.Item extra=\"For account creation only - Remains Private\">\r\n            {form.getFieldDecorator(\"phonenumber\", {\r\n              normalize: (v: string) =>\r\n                v\r\n                  ? v\r\n                      .replace(/\\D/g, \"\")\r\n                      .replace(/(\\d{3})(\\d{3})(\\d{4})/, \"($1) $2-$3\")\r\n                  : \"\",\r\n              rules: [\r\n                {\r\n                  required: true,\r\n                  message: \"Please enter your phone number\",\r\n                },\r\n                {\r\n                  len: 14,\r\n                  message: \"Please enter a valid phone number\",\r\n                },\r\n              ],\r\n            })(\r\n              <InputV4\r\n                Label=\"Phone number\"\r\n                maxLength={10}\r\n                key={\"Phonenumber\"}\r\n                onChange={setvinvalue}\r\n                disabled={\r\n                  signupResult.loading ||\r\n                  loginResult.loading ||\r\n                  updateProfileResult.loading ||\r\n                  emailCheckQueryResult.loading\r\n                }\r\n              />\r\n            )}\r\n          </Form.Item>\r\n          {showVerificationCodeInput && (\r\n            <Form.Item>\r\n              <Row>\r\n                <Col span={24}>\r\n                  <h3>Verify code</h3>\r\n                </Col>\r\n\r\n                <Col span={24}>\r\n                  <p>\r\n                    Check your email for the 6 digit verification code we sent\r\n                    and enter it below. Be sure to check your spam folder if you\r\n                    don't see it in your inbox.\r\n                  </p>\r\n\r\n                  <Col span={24}>\r\n                    <Form.Item>\r\n                      {form.getFieldDecorator(\"code\", {\r\n                        normalize: (v) => (v ? v.replace(/\\D/g, \"\") : \"\"),\r\n                        rules: [\r\n                          {\r\n                            required: true,\r\n                            message: \"Verification code is required.\",\r\n                          },\r\n                          {\r\n                            len: 6,\r\n                            message: \"Please enter a valid verification code.\",\r\n                          },\r\n                        ],\r\n                      })(\r\n                        <Input\r\n                          maxLength={6}\r\n                          size=\"large\"\r\n                          disabled={loading}\r\n                          autoComplete=\"off\"\r\n                          css={css`\r\n                            text-align: center;\r\n                            letter-spacing: 0.75rem;\r\n                            font-size: 1.5rem;\r\n                            font-weight: bold;\r\n                          `}\r\n                        />\r\n                      )}\r\n                    </Form.Item>\r\n                  </Col>\r\n                </Col>\r\n              </Row>\r\n            </Form.Item>\r\n          )}\r\n          <Form.Item>\r\n            {form.getFieldDecorator(\"termsOfUse\", {\r\n              initialValue: false,\r\n              rules: [\r\n                { required: true, message: \"Please read the Terms of Use\" },\r\n              ],\r\n            })(\r\n              <Checkbox\r\n                disabled={\r\n                  signupResult.loading ||\r\n                  loginResult.loading ||\r\n                  updateProfileResult.loading ||\r\n                  emailCheckQueryResult.loading\r\n                }\r\n              >\r\n                I agree to the{\" \"}\r\n                <a href=\"/termsofuse\" target=\"_blank\">\r\n                  Terms of Use\r\n                </a>\r\n                ,{\" \"}\r\n                <a href=\"/privacy\" target=\"_blank\">\r\n                  Privacy Policy\r\n                </a>\r\n              </Checkbox>\r\n            )}\r\n          </Form.Item>\r\n          {/* <Form.Item\r\n              css={css`\r\n                font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n                font-weight: 300 !important;\r\n              `}\r\n            >\r\n              {form.getFieldDecorator(\"privacyPolicy\", {\r\n                initialValue: false,\r\n                rules: [\r\n                  { required: true, message: \"Please read the Privacy Policy\" },\r\n                ],\r\n              })(\r\n                <Checkbox>\r\n                  I agree to the{\" \"}\r\n                  <a href=\"/privacy\" target=\"_blank\">\r\n                    Privacy Policy\r\n                  </a>\r\n                </Checkbox>\r\n              )}\r\n            </Form.Item> */}\r\n          <Form.Item\r\n            css={css`\r\n              font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n              font-weight: 300 !important;\r\n            `}\r\n          >\r\n            {form.getFieldDecorator(\r\n              \"optinMarketing\",\r\n              {}\r\n            )(\r\n              <Checkbox\r\n                disabled={\r\n                  signupResult.loading ||\r\n                  loginResult.loading ||\r\n                  updateProfileResult.loading ||\r\n                  emailCheckQueryResult.loading\r\n                }\r\n                css={css`\r\n                  font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n                  font-weight: 300 !important;\r\n                `}\r\n              >\r\n                I agree to receive marketing emails (optional)\r\n              </Checkbox>\r\n            )}\r\n          </Form.Item>\r\n          <a href=\"/termsofuse?#119\" target=\"_blank\">\r\n            Do Not Sell My Personal Info\r\n          </a>\r\n        </div>\r\n        <div>\r\n          <Row\r\n            css={css`\r\n              justify-content: center;\r\n              align-items: center;\r\n              width: 100%;\r\n            `}\r\n          >\r\n            {showVerificationCodeInput && (\r\n              <Col lg={24} md={24} sm={24}>\r\n                <Button\r\n                  type=\"primary\"\r\n                  css={css`\r\n                    display: block !important;\r\n                    margin: auto;\r\n                    margin-bottom: 10px;\r\n                    width: 200px;\r\n                    height: 48px;\r\n                    background: #2b2b2b;\r\n                    font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n                    font-size: 16px !important;\r\n                    :hover {\r\n                      background: white;\r\n                      color: #2b2b2b !important;\r\n                      span {\r\n                        color: #2b2b2b !important;\r\n                      }\r\n                    }\r\n                    span {\r\n                      color: white;\r\n                    }\r\n                  `}\r\n                  onClick={() => {\r\n                    setShowVerificationCodeInput(false);\r\n                    setdisabled(false);\r\n                  }}\r\n                >\r\n                  Change Email\r\n                </Button>\r\n              </Col>\r\n            )}\r\n            <Col lg={24} md={24} sm={24}>\r\n              <Button\r\n                loading={\r\n                  signupResult.loading ||\r\n                  loginResult.loading ||\r\n                  updateProfileResult.loading ||\r\n                  emailCheckQueryResult.loading\r\n                }\r\n                htmlType=\"submit\"\r\n                type=\"primary\"\r\n                css={css`\r\n                  display: block !important;\r\n                  margin: auto;\r\n                  width: 200px;\r\n                  height: 48px;\r\n                  background: #2b2b2b;\r\n                  font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n                  font-size: 16px !important;\r\n                  :hover {\r\n                    background: white;\r\n                    color: #2b2b2b !important;\r\n                    span {\r\n                      color: #2b2b2b !important;\r\n                    }\r\n                  }\r\n                  span {\r\n                    color: white;\r\n                  }\r\n                `}\r\n              >\r\n                Create Account\r\n              </Button>\r\n              <h5\r\n                css={css`\r\n                  text-align: center;\r\n                `}\r\n              >\r\n                Already have an account?{\" \"}\r\n                <BlueLinkButton\r\n                  disabled={\r\n                    signupResult.loading ||\r\n                    updateProfileResult.loading ||\r\n                    emailCheckQueryResult.loading\r\n                  }\r\n                  onClick={(_) => {\r\n                    if (signupResult.loading || emailCheckQueryResult.loading)\r\n                      return;\r\n                    dispatch({\r\n                      type: \"SHOW_LOGIN\",\r\n                    });\r\n                  }}\r\n                >\r\n                  Login\r\n                </BlueLinkButton>\r\n              </h5>\r\n            </Col>\r\n          </Row>\r\n        </div>\r\n      </Form>\r\n    </Modal>\r\n  );\r\n};\r\n\r\nexport default Form.create({ name: \"signup-form\" })(SignupPopup);\r\n","import React, { FC, MouseEvent, ReactNode } from \"react\";\r\n\r\nimport { Button } from \"antd\";\r\nimport { colors } from \"../../constants/styles\";\r\nimport { css } from \"@emotion/core\";\r\n\r\nexport const CustomButton: FC<{\r\n  filled?: boolean;\r\n  [key: string]: any;\r\n}> = ({ filled = false, children, ...props }) => {\r\n  const bgColor = filled ? colors.darkCharcoal : \"white\",\r\n    textColor = !filled ? colors.darkCharcoal : \"white\";\r\n\r\n  return (\r\n    <Button\r\n      {...props}\r\n      css={css`\r\n        background: ${bgColor};\r\n        color: ${textColor};\r\n        border: 1px solid ${colors.darkCharcoal};\r\n        cursor: pointer;\r\n        &:hover,\r\n        &:focus {\r\n          background: ${bgColor};\r\n          color: ${textColor};\r\n          border: 1px solid ${colors.darkCharcoal};\r\n        }\r\n        &:disabled {\r\n          opacity: 0.4;\r\n          cursor: pointer;\r\n        }\r\n      `}\r\n    >\r\n      {children}\r\n    </Button>\r\n  );\r\n};\r\n\r\nexport const BlueLinkButton = ({\r\n  children,\r\n  disabled,\r\n  onClick,\r\n  ...props\r\n}: {\r\n  children: ReactNode;\r\n  disabled?: boolean;\r\n  onClick: (e: MouseEvent) => void;\r\n}) => (\r\n  <button\r\n    {...props}\r\n    disabled={disabled}\r\n    onClick={onClick}\r\n    css={css`\r\n      background: none;\r\n      border: none;\r\n      padding: 0;\r\n      color: ${colors.blue};\r\n      cursor: pointer;\r\n      text-decoration: underline;\r\n      font-weight: bold;\r\n    `}\r\n  >\r\n    {children}\r\n  </button>\r\n);\r\n","import React, { FC, forwardRef, useRef } from \"react\";\r\n\r\nimport { Input } from \"antd\";\r\nimport Password from \"antd/lib/input/Password\";\r\nimport { css } from \"@emotion/core\";\r\n\r\n// interface Props {\r\n//   Label: string; // will be the same placeholder and prefix.\r\n//   value?: string;\r\n//   onChange?: (e: any) => void;\r\n//   onPaste?: (e: any) => void;\r\n//   onBlur?: (e: any) => void;\r\n//   disabled?: boolean;\r\n//   isPricing?: boolean;\r\n//   maxLength?: number;\r\n//   key?: string;\r\n//   err?: boolean;\r\n//   type?: string;\r\n//   Suffix?: string;\r\n// }\r\n\r\nexport const InputV4: FC<{\r\n  Label: string; // will be the same placeholder and prefix.\r\n  value?: string;\r\n  hasIn?: boolean;\r\n  onChange?: (e: any) => void;\r\n  onPaste?: (e: any) => void;\r\n  onBlur?: (e: any) => void;\r\n  disabled?: boolean;\r\n  isPricing?: boolean;\r\n  maxLength?: number;\r\n  key?: string;\r\n  type?: string;\r\n  Suffix?: string;\r\n  isPassword?: boolean;\r\n}> = forwardRef(\r\n  (\r\n    {\r\n      Label,\r\n      onChange,\r\n      hasIn,\r\n      onBlur,\r\n      onPaste,\r\n      disabled,\r\n      isPricing,\r\n      maxLength,\r\n      key,\r\n      isPassword,\r\n      type,\r\n      Suffix,\r\n      ...props\r\n    },\r\n    _ref\r\n  ) => {\r\n    const ref = useRef<Input & Password>(null);\r\n    return (\r\n      <div\r\n        css={css`\r\n    .ant-input:hover {\r\n      border: none !important;\r\n      box-shadow: 0 0 0 2px rgba(27, 81, 207, 0.2);\r\n    }\r\n    .ant-input:focus {\r\n      border-left: none !important;\r\n      border-right: none !important;\r\n      border-top: none !important;\r\n    }\r\n    .ant-input-prefix {\r\n      left: 12px !important;\r\n      top: 21px !important;\r\n      color: #4c4c4c;\r\n      transition: opacity 200ms ease;\r\n      font-family: font-family: Interstate, Arial, Helvetica, sans-serif !important;\r\n      text-transform: uppercase !important;\r\n    }\r\n    .ant-input-suffix {\r\n      \r\n      display: ${\r\n        !isPassword\r\n          ? ref.current && ref.current?.input.value\r\n            ? \"\"\r\n            : \"none !important\"\r\n          : \"\"\r\n      };\r\n      top: ${!isPassword ? \"47px !important\" : \"\"};\r\n      left: ${!isPassword ? \"12px !important\" : \"\"};\r\n      font-size: ${!isPassword ? \"15px\" : \"\"};\r\n    }\r\n    .ant-input {\r\n      background: #eeeeee !important;\r\n      transition: opacity 200ms ease !important;\r\n      padding-top: ${ref.current && ref.current?.input.value ? \"35px\" : \"\"};\r\n      padding-left: ${\r\n        ref.current && ref.current?.input.value\r\n          ? isPricing\r\n            ? \"21px !important\"\r\n            : \"12px !important\"\r\n          : \"\"\r\n      };\r\n      font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n      font-weight: 300 !important;\r\n      font-size: 16px !important;\r\n      border-radius: 5px 5px 0 0 !important;\r\n      border-bottom: 1px solid #2b2b2b;\r\n      height: 64px !important;\r\n      ::placeholder {\r\n        /* Chrome, Firefox, Opera, Safari 10.1+ */\r\n        color: #4c4c4c;\r\n        opacity: 1; /* Firefox */\r\n        font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n      }\r\n\r\n      :-ms-input-placeholder {\r\n        /* Internet Explorer 10-11 */\r\n        color: #4c4c4c;\r\n        font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n      }\r\n\r\n      ::-ms-input-placeholder {\r\n        /* Microsoft Edge */\r\n        color: #4c4c4c;\r\n        font-family: aktiv-grotesk, arial, Helvetica, sans-serif !important;\r\n      }\r\n    }\r\n  `}\r\n      >\r\n        {isPassword ? (\r\n          <Input.Password\r\n            prefix={ref.current && ref.current?.input.value ? `${Label}` : \"\"}\r\n            placeholder={`${Label}`}\r\n            onChange={onChange}\r\n            onPaste={onPaste}\r\n            onBlur={onBlur}\r\n            disabled={disabled}\r\n            data-automation-id={`${key}`}\r\n            size=\"large\"\r\n            ref={ref}\r\n            {...props}\r\n          />\r\n        ) : (\r\n          <Input\r\n            prefix={\r\n              (ref.current && ref.current?.input.value) || hasIn === true\r\n                ? `${Label}`\r\n                : \"\"\r\n            }\r\n            onChange={onChange}\r\n            onPaste={onPaste}\r\n            onBlur={onBlur}\r\n            disabled={disabled}\r\n            data-automation-id={`${key}`}\r\n            size=\"large\"\r\n            // value={value}\r\n            placeholder={`${Label}`}\r\n            maxLength={maxLength}\r\n            type={type}\r\n            suffix={isPricing ? `${Suffix}` : \"\"}\r\n            ref={ref}\r\n            {...props}\r\n          />\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n);\r\n// export default InputV4;\r\n"],"sourceRoot":""}