function MainComponent() { const [formData, setFormData] = React.useState({ name: '', cardNumber: '', expiryDate: '', cvv: '' }); const handleChange = (e)=>{ const { name, value } = e.target; setFormData((prevData)=>({ ...prevData, [name]: value })); }; const handleSubmit = (e)=>{ e.preventDefault(); console.log(formData); alert("Карта добавлена: " + JSON.stringify(formData, null, 2)); }; return /*#__PURE__*/ React.createElement("div", { className: "bg-[#f0f2f5] min-h-screen flex flex-col items-center pt-10", __source: { fileName: "", lineNumber: 24, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-lg shadow-lg w-[90%] max-w-[400px]", __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-2xl text-center text-[#333] mb-6", __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this }, "Кредитная карта"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col space-y-4", __source: { fileName: "", lineNumber: 27, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", placeholder: "Имя владельца", value: formData.name, onChange: handleChange, className: "border p-2 rounded", __source: { fileName: "", lineNumber: 28, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", name: "cardNumber", placeholder: "Номер карты", value: formData.cardNumber, onChange: handleChange, className: "border p-2 rounded", __source: { fileName: "", lineNumber: 29, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "expiryDate", placeholder: "Срок действия", value: formData.expiryDate, onChange: handleChange, className: "border p-2 rounded w-[48%]", __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", name: "cvv", placeholder: "CVV", value: formData.cvv, onChange: handleChange, className: "border p-2 rounded w-[48%]", __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#007bff] text-white font-roboto p-2 rounded hover:bg-[#0056b3]", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, "Добавить карту")))); }