function MainComponent() { const [hoursSlept, setHoursSlept] = React.useState(''); const [waterDrank, setWaterDrank] = React.useState(0); const [stepsTaken, setStepsTaken] = React.useState(0); const [breakfastCalories, setBreakfastCalories] = React.useState(0); const [lunchCalories, setLunchCalories] = React.useState(0); const [snackCalories, setSnackCalories] = React.useState(0); const [dinnerCalories, setDinnerCalories] = React.useState(0); const handleWaterChange = (e)=>{ const value = e.target.value; setWaterDrank(Math.max(0, value)); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#F0F4F8]", __source: { fileName: "", lineNumber: 16, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-semibold mb-8 font-roboto text-[#333]", __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }, "Daily Log"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-64 h-64 bg-white rounded-full relative shadow", __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute w-12 h-12 rounded-full bg-blue-500 top-6 right-1/2 transform translate-x-1/2", __source: { fileName: "", lineNumber: 21, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute w-12 h-12 rounded-full bg-blue-500 bottom-6 right-1/2 transform translate-x-1/2", __source: { fileName: "", lineNumber: 22, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mt-4 text-center", __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold font-roboto text-[#333]", __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, "Sleep Tracker"), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto text-[#555]", __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, hoursSlept))), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-md my-8 space-y-6", __source: { fileName: "", lineNumber: 30, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 31, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "waterDrank", className: "text-sm font-medium text-[#333] font-roboto", __source: { fileName: "", lineNumber: 32, columnNumber: 11 }, __self: this }, "Water Drank (ml)"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center border-2 rounded-lg overflow-hidden", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>setWaterDrank(waterDrank - 100), className: "px-3 py-2 text-xl font-roboto", __source: { fileName: "", lineNumber: 34, columnNumber: 13 }, __self: this }, "-"), /*#__PURE__*/ React.createElement("div", { className: "px-2 py-2 w-24 text-center border-0 focus:ring-0 sm:text-sm", __source: { fileName: "", lineNumber: 35, columnNumber: 13 }, __self: this }, waterDrank, " ml"), /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>setWaterDrank(waterDrank + 100), className: "px-3 py-2 text-xl font-roboto", __source: { fileName: "", lineNumber: 38, columnNumber: 13 }, __self: this }, "+"))), /*#__PURE__*/ React.createElement("form", { className: "space-y-6", onSubmit: (e)=>e.preventDefault(), __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "number", name: "stepsTaken", value: stepsTaken, onChange: (e)=>setStepsTaken(e.target.value), className: "mt-1 p-2 block w-full border-gray-300 shadow-sm focus:ring-green-500 focus:border-green-500 sm:text-sm rounded-md", placeholder: "Steps Taken", min: "0", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "breakfastCalories", value: breakfastCalories, onChange: (e)=>setBreakfastCalories(e.target.value), className: "mt-1 p-2 block w-full border-gray-300 shadow-sm focus:ring-yellow-500 focus:border-yellow-500 sm:text-sm rounded-md", placeholder: "Breakfast Calories", min: "0", __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "lunchCalories", value: lunchCalories, onChange: (e)=>setLunchCalories(e.target.value), className: "mt-1 p-2 block w-full border-gray-300 shadow-sm focus:ring-yellow-500 focus:border-yellow-500 sm:text-sm rounded-md", placeholder: "Lunch Calories", min: "0", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "snackCalories", value: snackCalories, onChange: (e)=>setSnackCalories(e.target.value), className: "mt-1 p-2 block w-full border-gray-300 shadow-sm focus:ring-yellow-500 focus:border-yellow-500 sm:text-sm rounded-md", placeholder: "Snack Calories", min: "0", __source: { fileName: "", lineNumber: 57, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "dinnerCalories", value: dinnerCalories, onChange: (e)=>setDinnerCalories(e.target.value), className: "mt-1 p-2 block w-full border-gray-300 shadow-sm focus:ring-yellow-500 focus:border-yellow-500 sm:text-sm rounded-md", placeholder: "Dinner Calories", min: "0", __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-[#4F46E5] hover:bg-[#3730a3] font-roboto", __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, "Submit")))); }