function MainComponent() { const [parkingRatioMin, setParkingRatioMin] = React.useState(1); const [parkingRatioMax, setParkingRatioMax] = React.useState(100); const handleParkingRatioChange = (e, setter)=>{ const value = parseInt(e.target.value); setter(value); if (setter === setParkingRatioMin && value > parkingRatioMax) { setParkingRatioMax(value); } else if (setter === setParkingRatioMax && value < parkingRatioMin) { setParkingRatioMin(value); } }; return /*#__PURE__*/ React.createElement("div", { className: "max-w-md mx-auto mt-10 p-6 bg-white rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 16, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold mb-6 text-gray-800", __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }, "物件情報入力"), /*#__PURE__*/ React.createElement("form", { className: "space-y-6", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "walkingMinutes", className: "block text-sm font-medium text-gray-700 mb-1", __source: { fileName: "", lineNumber: 21, columnNumber: 11 }, __self: this }, "徒歩分数"), /*#__PURE__*/ React.createElement("select", { id: "walkingMinutes", name: "walkingMinutes", className: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this }, [ ...Array.from({ length: 30 }) ].map((_, i)=>/*#__PURE__*/ React.createElement("option", { key: i + 1, value: i + 1, __source: { fileName: "", lineNumber: 30, columnNumber: 15 }, __self: this }, i + 1, "分")))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "unitsSold", className: "block text-sm font-medium text-gray-700 mb-1", __source: { fileName: "", lineNumber: 36, columnNumber: 11 }, __self: this }, "販売戸数"), /*#__PURE__*/ React.createElement("input", { type: "number", id: "unitsSold", name: "unitsSold", min: "1", className: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50", __source: { fileName: "", lineNumber: 39, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "averageArea", className: "block text-sm font-medium text-gray-700 mb-1", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, "平均専有面積 (m²)"), /*#__PURE__*/ React.createElement("input", { type: "number", id: "averageArea", name: "averageArea", min: "0", step: "0.1", className: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "parkingRatio", className: "block text-sm font-medium text-gray-700 mb-1", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, "駐車場設置率 (%)"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 66, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "range", id: "parkingRatioMin", name: "parkingRatioMin", min: "1", max: "100", value: parkingRatioMin, onChange: (e)=>handleParkingRatioChange(e, setParkingRatioMin), className: "w-full h-2 bg-gray-200 rounded-lg appearance-none cursor-pointer", __source: { fileName: "", lineNumber: 67, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "range", id: "parkingRatioMax", name: "parkingRatioMax", min: "1", max: "100", value: parkingRatioMax, onChange: (e)=>handleParkingRatioChange(e, setParkingRatioMax), className: "w-full h-2 bg-gray-200 rounded-lg appearance-none cursor-pointer", __source: { fileName: "", lineNumber: 77, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between mt-2", __source: { fileName: "", lineNumber: 88, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-sm text-gray-600", __source: { fileName: "", lineNumber: 89, columnNumber: 13 }, __self: this }, parkingRatioMin, "%"), /*#__PURE__*/ React.createElement("span", { className: "text-sm text-gray-600", __source: { fileName: "", lineNumber: 90, columnNumber: 13 }, __self: this }, parkingRatioMax, "%"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 94, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "targetSalesDays", className: "block text-sm font-medium text-gray-700 mb-1", __source: { fileName: "", lineNumber: 95, columnNumber: 11 }, __self: this }, "目標完売日数"), /*#__PURE__*/ React.createElement("input", { type: "number", id: "targetSalesDays", name: "targetSalesDays", min: "1", className: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50", __source: { fileName: "", lineNumber: 98, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition duration-150 ease-in-out", __source: { fileName: "", lineNumber: 107, columnNumber: 9 }, __self: this }, "送信"))); }