function MainComponent() { const statesOfIndia = [ 'Andhra Pradesh', 'Arunachal Pradesh', 'Assam', 'Bihar', 'Chhattisgarh', 'Goa', 'Gujarat', 'Haryana', 'Himachal Pradesh', 'Jharkhand', 'Karnataka', 'Kerala', 'Madhya Pradesh', 'Maharashtra', 'Manipur', 'Meghalaya', 'Mizoram', 'Nagaland', 'Odisha', 'Punjab', 'Rajasthan', 'Sikkim', 'Tamil Nadu', 'Telangana', 'Tripura', 'Uttar Pradesh', 'Uttarakhand', 'West Bengal' ]; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col gap-4 p-4 md:flex-row md:p-8", __source: { fileName: "", lineNumber: 33, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("aside", { className: "w-full md:w-1/4", __source: { fileName: "", lineNumber: 34, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow rounded-lg p-6", __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold mb-4", __source: { fileName: "", lineNumber: 36, columnNumber: 11 }, __self: this }, "Filters"), /*#__PURE__*/ React.createElement("form", { className: "flex flex-col gap-4", __source: { fileName: "", lineNumber: 37, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "date-range", className: "font-roboto text-sm", __source: { fileName: "", lineNumber: 38, columnNumber: 13 }, __self: this }, "Date Range"), /*#__PURE__*/ React.createElement("input", { type: "date", id: "date-range", name: "date-range", className: "border rounded px-2 py-1", __source: { fileName: "", lineNumber: 39, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("label", { htmlFor: "category", className: "font-roboto text-sm", __source: { fileName: "", lineNumber: 40, columnNumber: 13 }, __self: this }, "Category"), /*#__PURE__*/ React.createElement("select", { id: "category", name: "category", className: "border rounded px-2 py-1", __source: { fileName: "", lineNumber: 41, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "sales", __source: { fileName: "", lineNumber: 42, columnNumber: 15 }, __self: this }, "Sales"), /*#__PURE__*/ React.createElement("option", { value: "expenses", __source: { fileName: "", lineNumber: 43, columnNumber: 15 }, __self: this }, "Expenses")), /*#__PURE__*/ React.createElement("label", { htmlFor: "region", className: "font-roboto text-sm", __source: { fileName: "", lineNumber: 45, columnNumber: 13 }, __self: this }, "Region"), /*#__PURE__*/ React.createElement("select", { id: "region", name: "region", className: "border rounded px-2 py-1", __source: { fileName: "", lineNumber: 46, columnNumber: 13 }, __self: this }, statesOfIndia.map((state, index)=>/*#__PURE__*/ React.createElement("option", { key: index, value: state.toLowerCase().replace(/\s/g, '-'), __source: { fileName: "", lineNumber: 48, columnNumber: 17 }, __self: this }, state))), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#1A73E8] text-white px-4 py-2 rounded font-semibold", __source: { fileName: "", lineNumber: 51, columnNumber: 13 }, __self: this }, "Apply Filters")))), /*#__PURE__*/ React.createElement("main", { className: "w-full md:w-3/4", __source: { fileName: "", lineNumber: 57, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "mb-4", __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold mb-2", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, "Plots and Charts"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow rounded-lg p-4", __source: { fileName: "", lineNumber: 61, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-roboto text-sm mb-3", __source: { fileName: "", lineNumber: 62, columnNumber: 15 }, __self: this }, "Sales Over Time"), /*#__PURE__*/ React.createElement("div", { className: "h-64 bg-gray-100 rounded", __source: { fileName: "", lineNumber: 63, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow rounded-lg p-4", __source: { fileName: "", lineNumber: 65, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-roboto text-sm mb-3", __source: { fileName: "", lineNumber: 66, columnNumber: 15 }, __self: this }, "Expense Distribution"), /*#__PURE__*/ React.createElement("div", { className: "h-64 bg-gray-100 rounded", __source: { fileName: "", lineNumber: 67, columnNumber: 15 }, __self: this })))), /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold mb-2", __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this }, "State-wise Data"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap justify-center gap-4", __source: { fileName: "", lineNumber: 73, columnNumber: 11 }, __self: this }, statesOfIndia.map((state, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "w-[200px] h-[150px] bg-gray-100 rounded shadow", __source: { fileName: "", lineNumber: 75, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: `./svg/${state.toLowerCase().replace(/\s/g, '-')}.svg`, alt: `${state} map`, className: "w-full h-full object-cover rounded", __source: { fileName: "", lineNumber: 76, columnNumber: 17 }, __self: this }))))))); }