function FramerMotion(props) { const [mounted, setMounted] = useState(false); const ref = useRef(null); useEffect(()=>{ const checkRef = setInterval(()=>{ if (window.Motion) { clearInterval(checkRef); } if (ref.current) { clearInterval(checkRef); window.React = React; const script = document.createElement("script"); script.src = "https://cdn.jsdelivr.net/npm/framer-motion@11.11.17/dist/framer-motion.min.js"; script.type = "module"; script.onload = ()=>{ setMounted(true); }; ref.current.appendChild(script); } }, 100); return ()=>{ clearInterval(checkRef); if (ref.current) { const script = ref.current.querySelector("script"); if (script) { ref.current.removeChild(script); } } delete window.motion; }; }, []); const mountElm = /*#__PURE__*/ React.createElement("div", { className: "hidden", ref: ref, __source: { fileName: "", lineNumber: 35, columnNumber: 20 }, __self: this }); return mounted ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(window.Motion.motion.div, { ...props, __source: { fileName: "", lineNumber: 38, columnNumber: 7 }, __self: this }), mountElm) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { ...props, __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }), mountElm); } function FramerMotionStory() { return /*#__PURE__*/ React.createElement(FramerMotion, { __source: { fileName: "", lineNumber: 50, columnNumber: 10 }, __self: this }); } function MainComponent() { const { useState, useCallback } = React; const [isMenuOpen, setIsMenuOpen] = useState(false); const [formStatus, setFormStatus] = useState(""); const [formData, setFormData] = useState({ name: "", email: "", message: "" }); const handleSubmit = useCallback(async (e)=>{ e.preventDefault(); try { await fetch("/api/db/contact-form-43", { method: "POST", body: JSON.stringify({ query: "INSERT INTO `contact_messages` (name, email, message) VALUES (?, ?, ?)", values: [ formData.name, formData.email, formData.message ] }) }); setFormStatus("Message sent successfully!"); setFormData({ name: "", email: "", message: "" }); e.target.reset(); } catch (error) { setFormStatus("Failed to send message. Please try again."); } }, [ formData ]); const handleInputChange = useCallback((e)=>{ const { name, value } = e.target; setFormData((prev)=>({ ...prev, [name]: value })); }, []); const MainContent = /*#__PURE__*/ React.createElement("div", { className: "flex flex-col gap-12 mb-16", __source: { fileName: "", lineNumber: 40, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-12 items-start", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-[#F6F6F6] font-inter-tight-medium text-3xl md:text-5xl mb-6", __source: { fileName: "", lineNumber: 43, columnNumber: 11 }, __self: this }, "Get in Touch"), /*#__PURE__*/ React.createElement("p", { className: "text-[#B1B1B1] font-inter-tight-regular text-lg mb-8", __source: { fileName: "", lineNumber: 46, columnNumber: 11 }, __self: this }, "I'm always interested in new photography opportunities and collaborations. Whether you're looking to commission work, need immediate assistance, or just want to discuss photography, I'd love to hear from you."), /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 53, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#DFFF4E] font-inter-tight-medium text-xl mb-2", __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this }, "Location"), /*#__PURE__*/ React.createElement("p", { className: "text-[#B1B1B1] font-inter-tight-regular", __source: { fileName: "", lineNumber: 57, columnNumber: 15 }, __self: this }, "San Francisco, CA")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 61, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#DFFF4E] font-inter-tight-medium text-xl mb-2", __source: { fileName: "", lineNumber: 62, columnNumber: 15 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("p", { className: "text-[#B1B1B1] font-inter-tight-regular", __source: { fileName: "", lineNumber: 65, columnNumber: 15 }, __self: this }, "info@bartonwerner.com")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#DFFF4E] font-inter-tight-medium text-xl mb-2", __source: { fileName: "", lineNumber: 70, columnNumber: 15 }, __self: this }, "Phone"), /*#__PURE__*/ React.createElement("p", { className: "text-[#B1B1B1] font-inter-tight-regular", __source: { fileName: "", lineNumber: 73, columnNumber: 15 }, __self: this }, "+1 (555) 123-4567")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 77, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#DFFF4E] font-inter-tight-medium text-xl mb-2", __source: { fileName: "", lineNumber: 78, columnNumber: 15 }, __self: this }, "Support Hours"), /*#__PURE__*/ React.createElement("p", { className: "text-[#B1B1B1] font-inter-tight-regular", __source: { fileName: "", lineNumber: 81, columnNumber: 15 }, __self: this }, "Monday - Friday: 9AM - 6PM PST")))), /*#__PURE__*/ React.createElement("div", { className: "bg-[#2C2C2C] p-8 rounded-lg", __source: { fileName: "", lineNumber: 87, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 88, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 89, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", placeholder: "Your Name", required: true, value: formData.name, onChange: handleInputChange, className: "w-full bg-[#1B1B1B] border border-[#4B4B4B] rounded p-3 text-[#F6F6F6] font-inter-tight-regular focus:outline-none focus:border-[#DFFF4E]", __source: { fileName: "", lineNumber: 90, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 100, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", placeholder: "Your Email", required: true, value: formData.email, onChange: handleInputChange, className: "w-full bg-[#1B1B1B] border border-[#4B4B4B] rounded p-3 text-[#F6F6F6] font-inter-tight-regular focus:outline-none focus:border-[#DFFF4E]", __source: { fileName: "", lineNumber: 101, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 111, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { name: "message", placeholder: "Your Message", required: true, value: formData.message, onChange: handleInputChange, rows: "6", className: "w-full bg-[#1B1B1B] border border-[#4B4B4B] rounded p-3 text-[#F6F6F6] font-inter-tight-regular focus:outline-none focus:border-[#DFFF4E]", __source: { fileName: "", lineNumber: 112, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-[#DFFF4E] text-[#1B1B1B] font-inter-tight-regular py-3 px-6 rounded hover:bg-[#2C2C2C] hover:text-[#F6F6F6] transition-colors duration-300", __source: { fileName: "", lineNumber: 122, columnNumber: 13 }, __self: this }, "Send Message"), formStatus && /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-[#DFFF4E] font-inter-tight-regular text-center", __source: { fileName: "", lineNumber: 129, columnNumber: 15 }, __self: this }, formStatus)))), /*#__PURE__*/ React.createElement("div", { className: "bg-[#2C2C2C] p-8 rounded-lg", __source: { fileName: "", lineNumber: 136, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-[#F6F6F6] font-inter-tight-medium text-2xl mb-6", __source: { fileName: "", lineNumber: 137, columnNumber: 9 }, __self: this }, "Live Chat Support"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 140, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-[#B1B1B1] font-inter-tight-regular", __source: { fileName: "", lineNumber: 141, columnNumber: 11 }, __self: this }, "Chat with our support team in real-time"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>window.open("https://chat.bartonwerner.com", "_blank"), className: "bg-[#DFFF4E] text-[#1B1B1B] font-inter-tight-regular py-3 px-6 rounded hover:bg-[#2C2C2C] hover:text-[#F6F6F6] transition-colors duration-300 flex items-center gap-2", __source: { fileName: "", lineNumber: 144, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-comments", __source: { fileName: "", lineNumber: 150, columnNumber: 13 }, __self: this }), "Start Chat")))); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#1B1B1B] flex flex-col", __source: { fileName: "", lineNumber: 159, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "fixed top-0 left-0 right-0 bg-[#1B1B1B] border-b border-[#4B4B4B] z-50", __source: { fileName: "", lineNumber: 160, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto px-8 py-6 flex justify-between items-center", __source: { fileName: "", lineNumber: 161, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-[#DFFF4E] font-inter-tight-medium text-2xl", __source: { fileName: "", lineNumber: 162, columnNumber: 11 }, __self: this }, "Barton Werner"), /*#__PURE__*/ React.createElement("div", { className: "hidden md:flex space-x-8", __source: { fileName: "", lineNumber: 165, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "text-[#B1B1B1] hover:text-[#DFFF4E] font-inter-tight-regular", __source: { fileName: "", lineNumber: 166, columnNumber: 13 }, __self: this }, "Gallery"), /*#__PURE__*/ React.createElement("a", { href: "/about", className: "text-[#B1B1B1] hover:text-[#DFFF4E] font-inter-tight-regular", __source: { fileName: "", lineNumber: 172, columnNumber: 13 }, __self: this }, "About"), /*#__PURE__*/ React.createElement("a", { href: "/contact", className: "text-[#DFFF4E] font-inter-tight-regular", __source: { fileName: "", lineNumber: 178, columnNumber: 13 }, __self: this }, "Contact")), /*#__PURE__*/ React.createElement("button", { className: "md:hidden text-[#DFFF4E]", onClick: ()=>setIsMenuOpen(!isMenuOpen), __source: { fileName: "", lineNumber: 185, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${isMenuOpen ? "fa-times" : "fa-bars"}`, __source: { fileName: "", lineNumber: 189, columnNumber: 13 }, __self: this }))), isMenuOpen && /*#__PURE__*/ React.createElement("div", { className: "md:hidden bg-[#1B1B1B] border-t border-[#4B4B4B] px-8 py-4", __source: { fileName: "", lineNumber: 193, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "block py-2 text-[#B1B1B1] hover:text-[#DFFF4E] font-inter-tight-regular", __source: { fileName: "", lineNumber: 194, columnNumber: 13 }, __self: this }, "Gallery"), /*#__PURE__*/ React.createElement("a", { href: "/about", className: "block py-2 text-[#B1B1B1] hover:text-[#DFFF4E] font-inter-tight-regular", __source: { fileName: "", lineNumber: 200, columnNumber: 13 }, __self: this }, "About"), /*#__PURE__*/ React.createElement("a", { href: "#", className: "block py-2 text-[#DFFF4E] font-inter-tight-regular", __source: { fileName: "", lineNumber: 206, columnNumber: 13 }, __self: this }, "Contact"))), /*#__PURE__*/ React.createElement("div", { className: "pt-[100px] md:pt-[160px] px-4 md:px-8 flex-grow", __source: { fileName: "", lineNumber: 215, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 216, columnNumber: 9 }, __self: this }, MainContent)), /*#__PURE__*/ React.createElement("footer", { className: "bg-[#1B1B1B] border-t border-[#4B4B4B] py-8 md:py-12", __source: { fileName: "", lineNumber: 218, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto px-4 md:px-8", __source: { fileName: "", lineNumber: 219, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-6 md:gap-8", __source: { fileName: "", lineNumber: 220, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center md:text-left", __source: { fileName: "", lineNumber: 221, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#DFFF4E] font-inter-tight-medium text-xl mb-3 md:mb-4", __source: { fileName: "", lineNumber: 222, columnNumber: 15 }, __self: this }, "Contact"), /*#__PURE__*/ React.createElement("p", { className: "text-[#B1B1B1] font-inter-tight-regular", __source: { fileName: "", lineNumber: 225, columnNumber: 15 }, __self: this }, "info@bartonwerner.com"), /*#__PURE__*/ React.createElement("p", { className: "text-[#B1B1B1] font-inter-tight-regular", __source: { fileName: "", lineNumber: 228, columnNumber: 15 }, __self: this }, "+1 (555) 123-4567")), /*#__PURE__*/ React.createElement("div", { className: "text-center md:text-left", __source: { fileName: "", lineNumber: 232, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#DFFF4E] font-inter-tight-medium text-xl mb-3 md:mb-4", __source: { fileName: "", lineNumber: 233, columnNumber: 15 }, __self: this }, "Follow"), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center md:justify-start space-x-6", __source: { fileName: "", lineNumber: 236, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-[#B1B1B1] hover:text-[#DFFF4E]", __source: { fileName: "", lineNumber: 237, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-instagram text-2xl", __source: { fileName: "", lineNumber: 238, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-[#B1B1B1] hover:text-[#DFFF4E]", __source: { fileName: "", lineNumber: 240, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-twitter text-2xl", __source: { fileName: "", lineNumber: 241, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-[#B1B1B1] hover:text-[#DFFF4E]", __source: { fileName: "", lineNumber: 243, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-youtube text-2xl", __source: { fileName: "", lineNumber: 244, columnNumber: 19 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "text-center md:text-left", __source: { fileName: "", lineNumber: 248, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-[#DFFF4E] font-inter-tight-medium text-xl mb-3 md:mb-4", __source: { fileName: "", lineNumber: 249, columnNumber: 15 }, __self: this }, "Location"), /*#__PURE__*/ React.createElement("p", { className: "text-[#B1B1B1] font-inter-tight-regular", __source: { fileName: "", lineNumber: 252, columnNumber: 15 }, __self: this }, "San Francisco, CA"), /*#__PURE__*/ React.createElement("p", { className: "text-[#B1B1B1] font-inter-tight-regular", __source: { fileName: "", lineNumber: 255, columnNumber: 15 }, __self: this }, "United States"))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 md:mt-12 text-center", __source: { fileName: "", lineNumber: 260, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-[#B1B1B1] font-inter-tight-regular text-sm md:text-base", __source: { fileName: "", lineNumber: 261, columnNumber: 13 }, __self: this }, "© 2024 Barton Werner. All rights reserved."))))); }