function MainComponent() { const tools = [ { name: "Organize Files by Extension", component: OrganizeFiles }, { name: "Calculator", component: Calculator }, { name: "Cryptocurrencies Lookup", component: CryptoLookup }, { name: "Calculate Average", component: CalculateAverage }, { name: "Create a QR Code", component: QRCodeGenerator }, { name: "Get Weather", component: GetWeather }, { name: "Calculate Wage after tax and NIC", component: CalculateWage }, { name: "Unit Converter", component: UnitConverter }, { name: "Currency Converter", component: CurrencyConverter }, { name: "Rename Files in Folders", component: RenameFiles }, { name: "Find Prime Numbers in a Range", component: FindPrimes }, { name: "English Dictionary", component: Dictionary }, { name: "Password Generator", component: PasswordGenerator }, { name: "Translate Text", component: TranslateText } ]; const [currentTool, setCurrentTool] = React.useState(null); return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center p-4 bg-gray-100 min-h-screen", __source: { fileName: "", lineNumber: 22, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold font-roboto mb-4", __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }, "Select a tool"), /*#__PURE__*/ React.createElement("ul", { className: "w-[300px] bg-white p-4 shadow-md rounded-lg", __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }, tools.map((tool, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "p-2 border-b last:border-b-0 hover:bg-gray-200 cursor-pointer font-crimson-text", onClick: ()=>setCurrentTool(tool.component), __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, index + 1, ". ", tool.name))), /*#__PURE__*/ React.createElement("div", { className: "w-full mt-6", __source: { fileName: "", lineNumber: 35, columnNumber: 7 }, __self: this }, currentTool && /*#__PURE__*/ React.createElement("currentTool", { __source: { fileName: "", lineNumber: 36, columnNumber: 25 }, __self: this }))); } function OrganizeFiles() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 43, columnNumber: 10 }, __self: this }, "Organize Files by Extension"); } function Calculator() { const [value, setValue] = React.useState(""); const handleClick = (e)=>setValue(value.concat(e.target.name)); const handleClear = ()=>setValue(""); const handleBackspace = ()=>setValue(value.slice(0, -1)); const handleEvaluate = ()=>setValue(eval(value).toString()); return /*#__PURE__*/ React.createElement("div", { className: "container mx-auto p-4", __source: { fileName: "", lineNumber: 54, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4 shadow-md rounded-lg", __source: { fileName: "", lineNumber: 55, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4 text-xl font-crimson-text", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, value), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-4 gap-4", __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "btn", onClick: handleClear, __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }, "AC"), /*#__PURE__*/ React.createElement("button", { className: "btn", onClick: handleBackspace, __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, "C"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "/", onClick: handleClick, __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, "/"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "*", onClick: handleClick, __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, "*"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "7", onClick: handleClick, __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }, "7"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "8", onClick: handleClick, __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, "8"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "9", onClick: handleClick, __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this }, "9"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "-", onClick: handleClick, __source: { fileName: "", lineNumber: 65, columnNumber: 11 }, __self: this }, "-"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "4", onClick: handleClick, __source: { fileName: "", lineNumber: 66, columnNumber: 11 }, __self: this }, "4"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "5", onClick: handleClick, __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, "5"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "6", onClick: handleClick, __source: { fileName: "", lineNumber: 68, columnNumber: 11 }, __self: this }, "6"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "+", onClick: handleClick, __source: { fileName: "", lineNumber: 69, columnNumber: 11 }, __self: this }, "+"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "1", onClick: handleClick, __source: { fileName: "", lineNumber: 70, columnNumber: 11 }, __self: this }, "1"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "2", onClick: handleClick, __source: { fileName: "", lineNumber: 71, columnNumber: 11 }, __self: this }, "2"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: "3", onClick: handleClick, __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this }, "3"), /*#__PURE__*/ React.createElement("button", { className: "col-span-2 btn", name: "0", onClick: handleClick, __source: { fileName: "", lineNumber: 73, columnNumber: 11 }, __self: this }, "0"), /*#__PURE__*/ React.createElement("button", { className: "btn", name: ".", onClick: handleClick, __source: { fileName: "", lineNumber: 74, columnNumber: 11 }, __self: this }, "."), /*#__PURE__*/ React.createElement("button", { className: "btn", onClick: handleEvaluate, __source: { fileName: "", lineNumber: 75, columnNumber: 11 }, __self: this }, "=")))); } function CryptoLookup() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 83, columnNumber: 10 }, __self: this }, "Cryptocurrencies Lookup"); } function CalculateAverage() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 87, columnNumber: 10 }, __self: this }, "Calculate Average"); } function QRCodeGenerator() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 91, columnNumber: 10 }, __self: this }, "Create a QR Code"); } function GetWeather() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 95, columnNumber: 10 }, __self: this }, "Get Weather"); } function CalculateWage() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 99, columnNumber: 10 }, __self: this }, "Calculate Wage after tax and NIC"); } function UnitConverter() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 103, columnNumber: 10 }, __self: this }, "Unit Converter"); } function CurrencyConverter() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 107, columnNumber: 10 }, __self: this }, "Currency Converter"); } function RenameFiles() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 111, columnNumber: 10 }, __self: this }, "Rename Files in Folders"); } function FindPrimes() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 115, columnNumber: 10 }, __self: this }, "Find Prime Numbers in a Range"); } function Dictionary() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 119, columnNumber: 10 }, __self: this }, "English Dictionary"); } function PasswordGenerator() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 123, columnNumber: 10 }, __self: this }, "Password Generator"); } function TranslateText() { return /*#__PURE__*/ React.createElement("div", { className: "font-crimson-text", __source: { fileName: "", lineNumber: 127, columnNumber: 10 }, __self: this }, "Translate Text"); }