function MainComponent() { const [submitted, setSubmitted] = React.useState(false); const [formData, setFormData] = React.useState({ name: '', email: '', phone: '', message: '' }); const handleInputChange = (event)=>{ const { name, value } = event.target; setFormData((prevState)=>({ ...prevState, [name]: value })); }; const handleSubmit = async (event)=>{ event.preventDefault(); try { const response = await fetch('/api/db/developerhp', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ query: "INSERT INTO `contact_form_data` (`name`, `email`, `phone`, `message`) VALUES (?, ?, ?, ?)", values: [ formData.name, formData.email, formData.phone, formData.message ] }) }); const data = await response.json(); if (data) { setSubmitted(true); alert("Transmission Complete"); } } catch (error) { console.error('Error saving form data:', error); } }; const formContent = /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 39, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", placeholder: "Name", className: "block p-2 m-2 w-full", value: formData.name, onChange: handleInputChange, __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", placeholder: "Email", className: "block p-2 m-2 w-full", value: formData.email, onChange: handleInputChange, __source: { fileName: "", lineNumber: 42, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", name: "phone", placeholder: "Phone (Optional)", className: "block p-2 m-2 w-full", value: formData.phone, onChange: handleInputChange, __source: { fileName: "", lineNumber: 44, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("textarea", { name: "message", placeholder: "Your Message", className: "block p-4 m-2 w-full h-[150px]", value: formData.message, onChange: handleInputChange, __source: { fileName: "", lineNumber: 46, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#0066FF] px-6 py-2 text-white rounded-md", onClick: handleSubmit, __source: { fileName: "", lineNumber: 48, columnNumber: 7 }, __self: this }, "Send Message")); const submissionMessage = /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 52, columnNumber: 29 }, __self: this }, "Thank you for your inquiry. We will get back to you soon."); return /*#__PURE__*/ React.createElement("div", { className: "font-roboto", __source: { fileName: "", lineNumber: 55, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-[#F5F5F5]", __source: { fileName: "", lineNumber: 56, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "flex justify-between items-center p-6 bg-white", __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/logo.png", alt: "System Development Company Logo", className: "h-[50px]", __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("nav", { __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "flex gap-8 text-[#121212]", __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 62, columnNumber: 15 }, __self: this }, "About Us"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 63, columnNumber: 15 }, __self: this }, "Services"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 64, columnNumber: 15 }, __self: this }, "Careers"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 65, columnNumber: 15 }, __self: this }, "Contact Us")))), /*#__PURE__*/ React.createElement("div", { className: "text-center py-10", __source: { fileName: "", lineNumber: 69, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 70, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/hero-image.jpg", alt: "Technology solutions in action", className: "w-full object-cover h-[400px]", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute top-10 left-10 text-white", __source: { fileName: "", lineNumber: 72, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold mb-4", __source: { fileName: "", lineNumber: 73, columnNumber: 15 }, __self: this }, "Innovative Software Solutions"), /*#__PURE__*/ React.createElement("button", { className: "bg-[#0066FF] px-6 py-2 rounded-md text-white", __source: { fileName: "", lineNumber: 74, columnNumber: 15 }, __self: this }, "Contact Us"))), /*#__PURE__*/ React.createElement("div", { className: "py-6", __source: { fileName: "", lineNumber: 77, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl", __source: { fileName: "", lineNumber: 78, columnNumber: 13 }, __self: this }, "About Us"), /*#__PURE__*/ React.createElement("p", { className: "py-4", __source: { fileName: "", lineNumber: 79, columnNumber: 13 }, __self: this }, "Empowering businesses through innovative technology."), /*#__PURE__*/ React.createElement("a", { href: "/about", className: "text-[#0066FF] underline", __source: { fileName: "", lineNumber: 80, columnNumber: 13 }, __self: this }, "Read More")), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-3 gap-4 p-6", __source: { fileName: "", lineNumber: 82, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-white shadow-md", __source: { fileName: "", lineNumber: 83, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-cogs fa-3x text-[#121212]", "aria-hidden": "true", __source: { fileName: "", lineNumber: 84, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-xl", __source: { fileName: "", lineNumber: 85, columnNumber: 15 }, __self: this }, "Custom Software"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 86, columnNumber: 15 }, __self: this }, "Develop tailored software solutions that meet your specific requirements.")), /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-white shadow-md", __source: { fileName: "", lineNumber: 88, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-network-wired fa-3x text-[#121212]", "aria-hidden": "true", __source: { fileName: "", lineNumber: 89, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-xl", __source: { fileName: "", lineNumber: 90, columnNumber: 15 }, __self: this }, "System Integration"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 91, columnNumber: 15 }, __self: this }, "Seamlessly integrate advanced technology systems into your business processes.")), /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-white shadow-md", __source: { fileName: "", lineNumber: 93, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-business-time fa-3x text-[#121212]", "aria-hidden": "true", __source: { fileName: "", lineNumber: 94, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-xl", __source: { fileName: "", lineNumber: 95, columnNumber: 15 }, __self: this }, "IT Consulting"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 96, columnNumber: 15 }, __self: this }, "Expert advice to enhance your technological capabilities and growth."))), /*#__PURE__*/ React.createElement("div", { className: "p-6 bg-white shadow-md m-6", __source: { fileName: "", lineNumber: 99, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-4", __source: { fileName: "", lineNumber: 100, columnNumber: 13 }, __self: this }, "Get in Touch"), submitted ? submissionMessage : formContent)), /*#__PURE__*/ React.createElement("footer", { className: "bg-[#121212] text-white p-6", __source: { fileName: "", lineNumber: 104, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 105, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 106, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg", __source: { fileName: "", lineNumber: 107, columnNumber: 15 }, __self: this }, "Quick Links"), /*#__PURE__*/ React.createElement("ul", { __source: { fileName: "", lineNumber: 108, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 109, columnNumber: 17 }, __self: this }, "Home"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 110, columnNumber: 17 }, __self: this }, "About Us"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 111, columnNumber: 17 }, __self: this }, "Services"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 112, columnNumber: 17 }, __self: this }, "Privacy Policy"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 115, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg", __source: { fileName: "", lineNumber: 116, columnNumber: 15 }, __self: this }, "Social Media"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 117, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-facebook-square fa-2x", __source: { fileName: "", lineNumber: 118, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fa fa-twitter-square fa-2x", __source: { fileName: "", lineNumber: 119, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fa fa-linkedin fa-2x", __source: { fileName: "", lineNumber: 120, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 123, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg", __source: { fileName: "", lineNumber: 124, columnNumber: 15 }, __self: this }, "Contact"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 125, columnNumber: 15 }, __self: this }, "123 Tech Blvd, Innovation City"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 126, columnNumber: 15 }, __self: this }, "+1 234 567 8900")))))); }