{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/wyXeTqJXKi8E0wzo08ht/Ga7DGnqf9XPloIulIWUv/ContactForm.js"],
  "sourcesContent": ["// Welcome to Code in Framer\n// Get Started: https://www.framer.com/docs/guides/\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{useState}from\"react\";/**\n * These annotations control how your component sizes\n * Learn more: https://www.framer.com/docs/guides/auto-sizing\n *\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n */ export default function ContactForm(props){// TODO:\n// - Add window.fetch POST request to form\n// - set form blank after request\n// - add success message after post\nconst[formData,setFormData]=useState({name:\"\",email:\"\",phone:\"\",company:\"\",website:\"\",position:\"\"});const[errorSend,setErrorSend]=useState(false);const[successSend,setSuccessSend]=useState(false);const handleChange=event=>{setFormData({...formData,[event.target.id]:event.target.value});};const handleSubmit=e=>{e.preventDefault();setErrorSend(false);// Add window.fetch POST request to form\n// Add success message after post\nfetch(`https://submit-form.com/${props.formId}`,{method:\"POST\",headers:{\"Content-Type\":\"application/json\",Accept:\"application/json\"},body:JSON.stringify(formData)}).then(()=>{setSuccessSend(true);setFormData({name:\"\",email:\"\",phone:\"\",company:\"\",website:\"\",position:\"\"});}).catch(error=>{setErrorSend(true);console.log(error);});};const windowWidth=window.innerWidth;const rowContainer={display:\"flex\",width:\"100%\",justifyContent:\"space-between\",flexDirection:\"column\"};return /*#__PURE__*/ _jsx(\"div\",{style:containerStyle,id:\"contact-form\",children:/*#__PURE__*/ _jsxs(\"form\",{// To learn more about styling see:\n// https://reactjs.org/docs/dom-elements.html#style\nstyle:formContainer,onSubmit:handleSubmit,id:\"contactForm\",\"data-botpoison-public-key\":\"pk_ea1dbbe0-b2ef-405f-8f3e-e74da63f4092\",children:[/*#__PURE__*/ _jsxs(\"div\",{style:rowContainer,children:[/*#__PURE__*/ _jsxs(\"div\",{style:inputContainer,children:[/*#__PURE__*/ _jsx(\"label\",{for:\"name\",style:labelStyle,children:\"Name\"}),/*#__PURE__*/ _jsx(\"input\",{type:\"text\",id:\"name\",style:inputStyle,required:true,value:formData.name,onChange:handleChange,placeholder:\"John Carter\"})]}),/*#__PURE__*/ _jsxs(\"div\",{style:inputContainer,children:[/*#__PURE__*/ _jsx(\"label\",{for:\"email\",style:labelStyle,children:\"Email\"}),/*#__PURE__*/ _jsx(\"input\",{type:\"text\",required:true,id:\"email\",style:inputStyle,value:formData.email,onChange:handleChange,placeholder:\"example@email.com\"})]})]}),/*#__PURE__*/ _jsxs(\"div\",{style:rowContainer,children:[/*#__PURE__*/ _jsxs(\"div\",{style:inputContainer,children:[/*#__PURE__*/ _jsx(\"label\",{htmlFor:\"phone\",style:labelStyle,children:\"Phone\"}),/*#__PURE__*/ _jsx(\"input\",{type:\"text\",required:true,id:\"phone\",value:formData.phone,style:inputStyle,onChange:handleChange,placeholder:\"(123) 456 - 789\"})]}),/*#__PURE__*/ _jsxs(\"div\",{style:inputContainer,children:[/*#__PURE__*/ _jsx(\"label\",{htmlFor:\"company\",style:labelStyle,children:\"Company\"}),/*#__PURE__*/ _jsx(\"input\",{type:\"text\",required:true,id:\"company\",value:formData.company,style:inputStyle,onChange:handleChange,placeholder:\"Your Business\"})]})]}),/*#__PURE__*/ _jsxs(\"div\",{style:rowContainer,children:[/*#__PURE__*/ _jsxs(\"div\",{style:inputContainer,children:[/*#__PURE__*/ _jsx(\"label\",{htmlFor:\"website\",style:labelStyle,children:\"Website\"}),/*#__PURE__*/ _jsx(\"input\",{type:\"text\",required:true,id:\"website\",style:inputStyle,value:formData.website,onChange:handleChange,placeholder:\"yourwebsite.com\"})]}),/*#__PURE__*/ _jsxs(\"div\",{style:inputContainer,children:[/*#__PURE__*/ _jsx(\"label\",{htmlFor:\"position\",style:labelStyle,children:\"Position\"}),/*#__PURE__*/ _jsx(\"input\",{type:\"text\",required:true,id:\"position\",value:formData.position,onChange:handleChange,style:inputStyle,placeholder:\"CEO\"})]})]}),/*#__PURE__*/ _jsxs(\"button\",{type:\"submit\",id:\"button\",style:{...buttonStyles,background:props.button.colour||\"#000\",borderRadius:`${props.button.radius||6}px`},children:[props.button.title||\"Title\",\" \u2192\"]}),errorSend&&/*#__PURE__*/ _jsx(\"p\",{children:\" Error in submit \"}),successSend&&/*#__PURE__*/ _jsx(\"p\",{children:\"Thank you for your submission \"})]})});};// Styles are written in object syntax\n// Learn more: https://reactjs.org/docs/dom-elements.html#style\nconst containerStyle={height:\"100%\",display:\"flex\",justifyContent:\"center\",alignItems:\"center\",overflow:\"hidden\",width:\"100%\"};const formContainer={padding:40,borderRadius:\"50px\",width:\"100%\"};const inputStyle={borderRadius:\"6px\",padding:\"10px\",width:\"100%\",border:\"1px solid #EFF0F6\"};const inputContainer={display:\"flex\",flexDirection:\"column\",width:\"100%\",paddingBottom:\"20px\"};const labelStyle={marginBottom:\"10px\",fontSize:\"16px\"};const buttonStyles={background:\"#000\",border:\"none\",color:\"white\",padding:\"10px 20px\",borderRadius:\"10px\",fontSize:\"16px\",textAlign:\"center\",width:\"100%\"};ContactForm.defaultProps={btnTitle:\"Btn Title\",btnColour:\"#000\",formId:\"\",button:{title:\"Title\",colour:\"#000\",radius:\"6\"}};addPropertyControls(ContactForm,{formId:{title:\"Formspark\",type:ControlType.String},button:{type:ControlType.Object,controls:{title:{type:ControlType.String},colour:{type:ControlType.Color},radius:{type:ControlType.Number}}}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ContactForm\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"any\",\"framerSupportedLayoutWidth\":\"any\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ContactForm.map"],
  "mappings": "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",
  "names": ["ContactForm", "props", "formData", "setFormData", "ye", "errorSend", "setErrorSend", "successSend", "setSuccessSend", "handleChange", "event", "handleSubmit", "e", "error", "windowWidth", "window", "rowContainer", "p", "containerStyle", "u", "formContainer", "inputContainer", "labelStyle", "inputStyle", "buttonStyles", "addPropertyControls", "ControlType"]
}