function MainComponent() { const [inputValue, setInputValue] = React.useState(""); const [results, setResults] = React.useState([]); const [dictionaryResults, setDictionaryResults] = React.useState([]); const dictionary = { "listen": "聞く", "silent": "静かな", "enlist": "入隊する", "こんにちは": "Hello", "さようなら": "Goodbye" }; const handleSubmit = (e)=>{ e.preventDefault(); const anagrams = findAnagrams(inputValue); setResults(anagrams); const validWords = anagrams.filter((word)=>dictionary[word] !== undefined); setDictionaryResults(validWords); }; const handleInputChange = (e)=>{ setInputValue(e.target.value); }; const findAnagrams = (str)=>{ if (!str) return []; let results = []; const generate = (prefix, remaining)=>{ if (remaining.length === 0) results.push(prefix); for(let i = 0; i < remaining.length; i++){ generate(prefix + remaining[i], remaining.slice(0, i) + remaining.slice(i + 1)); } }; generate("", str); return results; }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col items-center justify-center bg-[#f7f9fc] p-4", __source: { fileName: "", lineNumber: 39, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-roboto mb-6 text-gray-800", __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, "アナグラムを検索して表示してください"), /*#__PURE__*/ React.createElement("form", { className: "mb-6 w-full max-w-md shadow-lg rounded-lg bg-white p-6", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "anagramInput", className: "w-full p-3 border-none bg-gray-100 rounded mb-4 focus:ring-2 focus:ring-blue-500", placeholder: "例: silent", value: inputValue, onChange: handleInputChange, __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-blue-600 text-white p-3 rounded hover:bg-blue-700 transition duration-300", __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this }, "検索")), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between w-full max-w-3xl space-x-4", __source: { fileName: "", lineNumber: 57, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-1/2 text-center mb-6", __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-roboto mb-4 text-gray-800", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, "検索結果"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc list-inside text-left text-gray-700 max-h-[150px] overflow-y-auto", __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, results.length === 0 ? /*#__PURE__*/ React.createElement("li", { className: "text-lg", __source: { fileName: "", lineNumber: 62, columnNumber: 15 }, __self: this }, "合致する単語なし") : results.map((result, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "text-lg", __source: { fileName: "", lineNumber: 65, columnNumber: 17 }, __self: this }, result)))), /*#__PURE__*/ React.createElement("div", { className: "w-1/2 text-center mb-6", __source: { fileName: "", lineNumber: 70, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-roboto mb-4 text-gray-800", __source: { fileName: "", lineNumber: 71, columnNumber: 11 }, __self: this }, "辞書から一致する単語"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc list-inside text-left text-gray-700 max-h-[150px] overflow-y-auto", __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this }, dictionaryResults.length === 0 ? /*#__PURE__*/ React.createElement("li", { className: "text-lg", __source: { fileName: "", lineNumber: 74, columnNumber: 15 }, __self: this }, "合致する単語なし") : dictionaryResults.map((result, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "text-lg", __source: { fileName: "", lineNumber: 77, columnNumber: 17 }, __self: this }, result, " - ", dictionary[result])))))); }