function MainComponent() { const handleSubmit = (event)=>{ event.preventDefault(); const formData = new FormData(event.target); const data = Object.fromEntries(formData.entries()); // Handle the form data as required }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen p-4 bg-[#F7F7F7]", __source: { fileName: "", lineNumber: 10, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-[#123456] mb-8 font-roboto", __source: { fileName: "", lineNumber: 11, columnNumber: 7 }, __self: this }, "Basketball Player Data Collection"), /*#__PURE__*/ React.createElement("form", { className: "w-full max-w-lg", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap -mx-3 mb-6", __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full px-3 mb-6 md:mb-0", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2 font-roboto", htmlFor: "player-name", __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }, "Player Name"), /*#__PURE__*/ React.createElement("input", { className: "appearance-none block w-full bg-white text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500", id: "player-name", type: "text", placeholder: "John Doe", name: "playerName", __source: { fileName: "", lineNumber: 20, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 px-3 mb-6 md:mb-0", __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2 font-roboto", htmlFor: "player-age", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, "Age"), /*#__PURE__*/ React.createElement("input", { className: "appearance-none block w-full bg-white text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500", id: "player-age", type: "number", min: "0", placeholder: "18", name: "age", __source: { fileName: "", lineNumber: 30, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 px-3", __source: { fileName: "", lineNumber: 37, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2 font-roboto", htmlFor: "player-height", __source: { fileName: "", lineNumber: 38, columnNumber: 13 }, __self: this }, "Height (cm)"), /*#__PURE__*/ React.createElement("input", { className: "appearance-none block w-full bg-white text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500", id: "player-height", type: "number", min: "0", placeholder: "190", name: "height", __source: { fileName: "", lineNumber: 41, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 px-3 mb-6 md:mb-0", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2 font-roboto", htmlFor: "player-weight", __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this }, "Weight (kg)"), /*#__PURE__*/ React.createElement("input", { className: "appearance-none block w-full bg-white text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500", id: "player-weight", type: "number", min: "0", placeholder: "85", name: "weight", __source: { fileName: "", lineNumber: 52, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 px-3", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2 font-roboto", htmlFor: "player-vertical-jump", __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this }, "Vertical Jump (cm)"), /*#__PURE__*/ React.createElement("input", { className: "appearance-none block w-full bg-white text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500", id: "player-vertical-jump", type: "number", min: "0", placeholder: "60", name: "verticalJump", __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 px-3 mb-6 md:mb-0", __source: { fileName: "", lineNumber: 70, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2 font-roboto", htmlFor: "player-speed", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }, "20M SPRINT TIME (SECS)"), /*#__PURE__*/ React.createElement("input", { className: "appearance-none block w-full bg-white text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500", id: "player-speed", type: "number", min: "0", step: "0.01", placeholder: "3.5", name: "sprintTime", __source: { fileName: "", lineNumber: 72, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 px-3", __source: { fileName: "", lineNumber: 80, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2 font-roboto", htmlFor: "player-shooting", __source: { fileName: "", lineNumber: 81, columnNumber: 13 }, __self: this }, "Shooting Accuracy (%)"), /*#__PURE__*/ React.createElement("input", { className: "appearance-none block w-full bg-white text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500", id: "player-shooting", type: "number", min: "0", max: "100", placeholder: "75", name: "shootingAccuracy", __source: { fileName: "", lineNumber: 84, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "md:flex md:items-center", __source: { fileName: "", lineNumber: 93, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "md:w-1/3", __source: { fileName: "", lineNumber: 94, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "shadow bg-[#4CAF50] hover:bg-[#46a049] text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline transform active:scale-95 transition duration-150 ease-in-out", type: "submit", __source: { fileName: "", lineNumber: 95, columnNumber: 13 }, __self: this }, "Submit")))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 102, columnNumber: 7 }, __self: this }, ` body { font-family: 'Roboto', sans-serif; } `)); }