function MainComponent() { const [color, setColor] = React.useState("#ff0000"); return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center w-full min-h-screen bg-[#121212]", __source: { fileName: "", lineNumber: 5, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-roboto text-[#ffffff] mb-8", __source: { fileName: "", lineNumber: 6, columnNumber: 7 }, __self: this }, "Create Your High-Tech F1 Helmet"), /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 7, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "./f1CarBackground.jpg", alt: "F1 car in the background", className: "w-[800px] h-[400px] object-cover rounded-lg", __source: { fileName: "", lineNumber: 8, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute top-0 left-[200px]", __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-[400px] h-[400px] bg-gray-900 rounded-lg overflow-hidden", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("iframe", { title: "3D Helmet Preview", src: `https://3dviewer.net/embed.html#model=https://example.com/highTechF1Helmet.obj&color=${color.substring(1)}`, width: "400", height: "400", allowFullScreen: true, style: { border: "none" }, __source: { fileName: "", lineNumber: 11, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center mt-8", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "colorPicker", className: "mb-2 text-lg font-roboto text-[#ffffff]", __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, "Select Helmet Color:"), /*#__PURE__*/ React.createElement("input", { type: "color", id: "colorPicker", name: "color", value: color, onChange: (e)=>setColor(e.target.value), className: "w-24 h-24 cursor-pointer", __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }))); }