function MainComponent() { const [isSubmitting, setIsSubmitting] = React.useState(false); const [submitSuccess, setSubmitSuccess] = React.useState(false); const handleSubmit = (event)=>{ event.preventDefault(); setIsSubmitting(true); // Simulate API call setTimeout(()=>{ setIsSubmitting(false); setSubmitSuccess(true); }, 2000); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#101820FF] p-4", __source: { fileName: "", lineNumber: 14, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `p-6 max-w-md w-full bg-[#F2AA4CFF] rounded-lg shadow-md ${submitSuccess ? 'success-animation' : ''}`, __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-center font-roboto mb-6", __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, 'Automate Kali NetHunter CHROOT Configuration'), !submitSuccess ? /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "space-y-4", __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 21, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "deviceModel", className: "block mb-2 text-sm font-medium text-[#101820FF] font-roboto", __source: { fileName: "", lineNumber: 22, columnNumber: 15 }, __self: this }, "Device Model"), /*#__PURE__*/ React.createElement("input", { name: "deviceModel", type: "text", className: "w-full p-3 bg-white rounded-md border border-[#101820FF] text-[#101820FF] font-roboto", placeholder: "e.g., OnePlus 9 Pro", required: true, __source: { fileName: "", lineNumber: 25, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 33, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "androidVersion", className: "block mb-2 text-sm font-medium text-[#101820FF] font-roboto", __source: { fileName: "", lineNumber: 34, columnNumber: 15 }, __self: this }, "Android Version"), /*#__PURE__*/ React.createElement("input", { name: "androidVersion", type: "text", className: "w-full p-3 bg-white rounded-md border border-[#101820FF] text-[#101820FF] font-roboto", placeholder: "e.g., Android 11 (R)", required: true, __source: { fileName: "", lineNumber: 37, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 45, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "architecture", className: "block mb-2 text-sm font-medium text-[#101820FF] font-roboto", __source: { fileName: "", lineNumber: 46, columnNumber: 15 }, __self: this }, "Architecture"), /*#__PURE__*/ React.createElement("select", { name: "architecture", className: "w-full p-3 bg-white rounded-md border border-[#101820FF] text-[#101820FF] font-roboto", required: true, __source: { fileName: "", lineNumber: 49, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 50, columnNumber: 17 }, __self: this }, "Select Architecture"), /*#__PURE__*/ React.createElement("option", { value: "arm64", __source: { fileName: "", lineNumber: 51, columnNumber: 17 }, __self: this }, "ARM64"), /*#__PURE__*/ React.createElement("option", { value: "armhf", __source: { fileName: "", lineNumber: 52, columnNumber: 17 }, __self: this }, "ARMHF"), /*#__PURE__*/ React.createElement("option", { value: "amd64", __source: { fileName: "", lineNumber: 53, columnNumber: 17 }, __self: this }, "AMD64"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "storageSize", className: "block mb-2 text-sm font-medium text-[#101820FF] font-roboto", __source: { fileName: "", lineNumber: 57, columnNumber: 15 }, __self: this }, "Storage Size (GB)"), /*#__PURE__*/ React.createElement("input", { name: "storageSize", type: "number", className: "w-full p-3 bg-white rounded-md border border-[#101820FF] text-[#101820FF] font-roboto", placeholder: "Minimum 20 GB", min: "20", required: true, __source: { fileName: "", lineNumber: 60, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: isSubmitting, className: `py-3 px-6 bg-[#101820FF] text-white font-bold uppercase rounded-md ${isSubmitting ? 'opacity-50' : 'hover:bg-opacity-90'} font-roboto`, __source: { fileName: "", lineNumber: 70, columnNumber: 15 }, __self: this }, isSubmitting ? 'Configuring...' : 'Configure'))) : /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 80, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-center font-roboto mb-6 text-[#101820FF]", __source: { fileName: "", lineNumber: 81, columnNumber: 13 }, __self: this }, "Configuration Complete 🎉"), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto text-center text-[#101820FF]", __source: { fileName: "", lineNumber: 84, columnNumber: 13 }, __self: this }, "Your Kali NetHunter CHROOT is now configured on your device."))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 90, columnNumber: 7 }, __self: this }, ` @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes success-shrink { 0% { transform: scale(1); } 100% { transform: scale(0.95); } } html, body { animation: fadeIn 1s ease 0s 1 normal forwards; } .success-animation { animation: success-shrink 0.3s ease-in-out 0s 1 normal forwards; } `)); }