function MainComponent() { const [logisticsImages, setLogisticsImages] = React.useState([]); const [currentSlide, setCurrentSlide] = React.useState(0); const sliderRef = React.useRef(null); React.useEffect(()=>{ fetch('/integrations/image-search/imagesearch?q=Logistics Sea Air Road Qatar').then((response)=>response.json()).then((data)=>{ if (data.status === "success") { const images = data.items.slice(0, 3).map((item)=>item.thumbnailImageUrl); setLogisticsImages(images); } }); const interval = setInterval(()=>{ setCurrentSlide((prevCurrentSlide)=>prevCurrentSlide === logisticsImages.length - 1 ? 0 : prevCurrentSlide + 1); }, 3000); return ()=>clearInterval(interval); }, [ logisticsImages.length ]); React.useEffect(()=>{ if (sliderRef.current) { sliderRef.current.style.transform = `translateX(-${currentSlide * 100}%)`; } }, [ currentSlide ]); const services = [ "Customs clearance", "Import and Export Documentation", "Obtains various approval Ministry", "Guidelines and Duty exceptions", "Refund processing" ]; const slogan = "Navigating Global Trade With Precision and Care"; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen text-center bg-gradient-to-br from-[#FF0000] via-[#FFFFFF] to-[#808080]", __source: { fileName: "", lineNumber: 42, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "w-full py-6 bg-gradient-to-r from-[#000000] via-[#FF0000] to-[#ffffff] flex items-center px-4", __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "logo.png", alt: "Thavakkal Customs Clearance Logo", className: "h-[60px] w-[60px]", __source: { fileName: "", lineNumber: 44, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col ml-4", __source: { fileName: "", lineNumber: 45, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl text-white font-roboto", __source: { fileName: "", lineNumber: 46, columnNumber: 11 }, __self: this }, "Thavakkal Customs Clearance"), /*#__PURE__*/ React.createElement("p", { className: "text-md text-white font-roboto italic", __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }, slogan))), /*#__PURE__*/ React.createElement("main", { className: "px-4 py-8 w-full", __source: { fileName: "", lineNumber: 50, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "mb-4 text-2xl text-[#000000] font-roboto", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, "Our Services"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc list-inside", __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this }, services.map((service, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "text-lg text-[#808080] font-roboto", __source: { fileName: "", lineNumber: 54, columnNumber: 13 }, __self: this }, service))), /*#__PURE__*/ React.createElement("div", { className: "relative overflow-hidden mt-6", __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "whitespace-nowrap transition-transform duration-700 ease-out", ref: sliderRef, __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }, logisticsImages.map((image, index)=>/*#__PURE__*/ React.createElement("img", { key: index, src: image, alt: `Logistics ${[ 'Sea', 'Air', 'Road' ][index]} in Qatar`, className: "inline-block w-full h-[200px] object-cover", __source: { fileName: "", lineNumber: 60, columnNumber: 15 }, __self: this }))))), /*#__PURE__*/ React.createElement("footer", { className: "w-full py-4 bg-[#000000]", __source: { fileName: "", lineNumber: 65, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-xl text-white font-roboto", __source: { fileName: "", lineNumber: 66, columnNumber: 9 }, __self: this }, "© 2023 Thavakkal Customs Clearance"))); }