function MainComponent() { const [searchMode, setSearchMode] = useState(null); const [searchQuery, setSearchQuery] = useState(''); const [viewMode, setViewMode] = useState('grid'); const [filterMode, setFilterMode] = useState('all'); const [savedWords, setSavedWords] = useState([]); const [loading, setLoading] = useState(false); const [loadingMore, setLoadingMore] = useState(false); const [error, setError] = useState(null); const [currentSearchResult, setCurrentSearchResult] = useState(null); const [streamingMessage, setStreamingMessage] = useState(''); const [offset, setOffset] = useState(0); const limit = 12; const handleStreamResponse = useHandleStreamResponse({ onChunk: setStreamingMessage, onFinish: (message)=>{ try { const parsedResult = JSON.parse(message); const resultWithMode = { ...parsedResult, searchMode, timestamp: new Date().toISOString() }; setCurrentSearchResult(resultWithMode); setLoading(false); } catch (e) { console.error('Failed to parse response:', e); setError('応答の解析に失敗しました。もう一度お試しください。'); setLoading(false); } } }); useEffect(()=>{ fetchSavedWords(); }, [ filterMode ]); const fetchSavedWords = async ()=>{ try { const response = await fetch('/api/get-words', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ mode: filterMode, limit, offset }) }); if (!response.ok) { throw new Error('Failed to fetch words'); } const data = await response.json(); setSavedWords((prev)=>offset === 0 ? data : [ ...prev, ...data ]); } catch (error) { console.error('Failed to fetch saved words:', error); setError('単語の取得に失敗しました。'); } }; const handleLoadMore = async ()=>{ setLoadingMore(true); setOffset((prev)=>prev + limit); await fetchSavedWords(); setLoadingMore(false); }; const handleSearch = async ()=>{ if (!searchQuery.trim()) { setError('検索キーワードを入力してください。'); return; } setLoading(true); setError(null); const prompt = searchMode === 'pronunciation' ? `以下の日本語の発音から英語の単語・フレーズを提案してください："${searchQuery}" - 英語表現 - カタカナ読み - 日本語の意味 - 例文を含めてください。` : `以下の使用シーンに適した英語表現を提案してください："${searchQuery}" - 英語表現 - カタカナ読み - 日本語の意味 - 例文を含めてください。`; try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: 'user', content: prompt } ], json_schema: { name: 'japanese_english_search', schema: { type: 'object', properties: { english: { type: 'string', description: '英語表現' }, pronunciation: { type: 'string', description: 'カタカナ読み' }, meaning: { type: 'string', description: '日本語の意味' }, example: { type: 'string', description: '例文' } }, required: [ 'english', 'pronunciation', 'meaning', 'example' ], additionalProperties: false } }, stream: true }) }); if (!response.ok) { throw new Error(`API error: ${response.status}`); } handleStreamResponse(response); } catch (err) { console.error('Search error:', err); setError('検索中にエラーが発生しました。ネットワーク接続を確認して、もう一度お試しください。'); setLoading(false); } }; const addToCards = async ()=>{ if (currentSearchResult) { setLoading(true); try { const response = await fetch('/api/save-word', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ english: currentSearchResult.english, pronunciation: currentSearchResult.pronunciation, meaning: currentSearchResult.meaning, example: currentSearchResult.example, search_mode: currentSearchResult.searchMode }) }); if (!response.ok) { throw new Error('Failed to save word'); } const savedWord = await response.json(); setSavedWords((prev)=>[ savedWord, ...prev ]); setCurrentSearchResult(null); setSearchQuery(''); setSearchMode(null); } catch (error) { console.error('Failed to save word:', error); setError('単語の保存に失敗しました。'); } finally{ setLoading(false); } } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-pattern p-4 md:p-8", __source: { fileName: "", lineNumber: 165, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 166, columnNumber: 7 }, __self: this }, ` @keyframes float { 0% { transform: translateY(0px); } 50% { transform: translateY(-10px); } 100% { transform: translateY(0px); } } @keyframes shine { 0% { background-position: -100% 50%; } 100% { background-position: 200% 50%; } } .animate-float { animation: float 6s ease-in-out infinite; } .shine-effect { background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent); background-size: 200% 100%; animation: shine 2s infinite; } .bg-pattern { background-color: #f0f4ff; background-image: radial-gradient(#e0e7ff 2px, transparent 2px); background-size: 30px 30px; } `), /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto", __source: { fileName: "", lineNumber: 194, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-16 animate-float", __source: { fileName: "", lineNumber: 195, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-7xl font-bold mb-4 relative inline-block", __source: { fileName: "", lineNumber: 196, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-blue-600", __source: { fileName: "", lineNumber: 197, columnNumber: 5 }, __self: this }, "English"), /*#__PURE__*/ React.createElement("span", { className: "ml-4 text-transparent bg-clip-text bg-gradient-to-r from-pink-500 via-purple-500 to-indigo-500", __source: { fileName: "", lineNumber: 198, columnNumber: 5 }, __self: this }, "わーど"), /*#__PURE__*/ React.createElement("div", { className: "absolute -bottom-2 left-0 w-full h-1 bg-gradient-to-r from-transparent via-blue-400 to-transparent opacity-50", __source: { fileName: "", lineNumber: 201, columnNumber: 5 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "text-xl text-gray-600 mt-4 font-light tracking-wide", __source: { fileName: "", lineNumber: 203, columnNumber: 3 }, __self: this }, "楽しく学ぼう！英語表現 ✨")), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-8 mb-16", __source: { fileName: "", lineNumber: 207, columnNumber: 1 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSearchMode('pronunciation'), className: "group relative h-64 rounded-3xl overflow-hidden transition-all duration-300 hover:scale-105 hover:shadow-2xl", __source: { fileName: "", lineNumber: 208, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-gradient-to-br from-sky-400 via-blue-500 to-blue-600 opacity-90 group-hover:opacity-100 transition-opacity", __source: { fileName: "", lineNumber: 212, columnNumber: 5 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "relative h-full p-8 flex flex-col justify-between text-white", __source: { fileName: "", lineNumber: 213, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 214, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-5xl mb-6 flex items-center justify-start", __source: { fileName: "", lineNumber: 215, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white/20 backdrop-blur-sm rounded-2xl p-4 transform rotate-12 group-hover:rotate-0 transition-all duration-300", __source: { fileName: "", lineNumber: 216, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-4xl", __source: { fileName: "", lineNumber: 217, columnNumber: 13 }, __self: this }, "あ"), /*#__PURE__*/ React.createElement("span", { className: "text-2xl ml-1", __source: { fileName: "", lineNumber: 218, columnNumber: 13 }, __self: this }, "A"))), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-2", __source: { fileName: "", lineNumber: 221, columnNumber: 9 }, __self: this }, "ひらがな/カタカナから"), /*#__PURE__*/ React.createElement("p", { className: "text-base text-blue-100", __source: { fileName: "", lineNumber: 222, columnNumber: 9 }, __self: this }, "発音から英語表現を探す")), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end items-center group-hover:translate-x-2 transition-transform", __source: { fileName: "", lineNumber: 224, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "mr-2", __source: { fileName: "", lineNumber: 225, columnNumber: 9 }, __self: this }, "さがす"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-right text-xl", __source: { fileName: "", lineNumber: 226, columnNumber: 9 }, __self: this })))), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSearchMode('meaning'), className: "group relative h-64 rounded-3xl overflow-hidden transition-all duration-300 hover:scale-105 hover:shadow-2xl", __source: { fileName: "", lineNumber: 231, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 bg-gradient-to-br from-purple-400 via-purple-500 to-purple-600 opacity-90 group-hover:opacity-100 transition-opacity", __source: { fileName: "", lineNumber: 235, columnNumber: 5 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "relative h-full p-8 flex flex-col justify-between text-white", __source: { fileName: "", lineNumber: 236, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 237, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-5xl mb-6 flex items-center justify-start", __source: { fileName: "", lineNumber: 238, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white/20 backdrop-blur-sm rounded-2xl p-4 transform -rotate-12 group-hover:rotate-0 transition-all duration-300", __source: { fileName: "", lineNumber: 239, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-4xl", __source: { fileName: "", lineNumber: 240, columnNumber: 13 }, __self: this }, "🗣️"), /*#__PURE__*/ React.createElement("span", { className: "text-2xl ml-1", __source: { fileName: "", lineNumber: 241, columnNumber: 13 }, __self: this }, "💭"))), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-2", __source: { fileName: "", lineNumber: 244, columnNumber: 9 }, __self: this }, "意味から"), /*#__PURE__*/ React.createElement("p", { className: "text-base text-purple-100", __source: { fileName: "", lineNumber: 245, columnNumber: 9 }, __self: this }, "使用シーンから英語表現を探す")), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end items-center group-hover:translate-x-2 transition-transform", __source: { fileName: "", lineNumber: 247, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "mr-2", __source: { fileName: "", lineNumber: 248, columnNumber: 9 }, __self: this }, "さがす"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-right text-xl", __source: { fileName: "", lineNumber: 249, columnNumber: 9 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-2xl p-6 mb-8 shadow-lg", __source: { fileName: "", lineNumber: 254, columnNumber: 1 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row justify-between items-center gap-4", __source: { fileName: "", lineNumber: 255, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex gap-3", __source: { fileName: "", lineNumber: 256, columnNumber: 5 }, __self: this }, [ 'all', 'pronunciation', 'meaning' ].map((mode)=>/*#__PURE__*/ React.createElement("button", { key: mode, onClick: ()=>setFilterMode(mode), className: `px-6 py-3 rounded-xl transition-all duration-300 ${filterMode === mode ? 'bg-blue-500 text-white shadow-lg transform scale-105' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'}`, __source: { fileName: "", lineNumber: 258, columnNumber: 9 }, __self: this }, mode === 'all' ? 'すべて 📚' : mode === 'pronunciation' ? '発音から 🎯' : '意味から 💭'))), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 272, columnNumber: 5 }, __self: this }, [ 'grid', 'list' ].map((mode)=>/*#__PURE__*/ React.createElement("button", { key: mode, onClick: ()=>setViewMode(mode), className: `p-3 rounded-xl transition-all duration-300 ${viewMode === mode ? 'bg-blue-500 text-white shadow-lg transform scale-105' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'}`, __source: { fileName: "", lineNumber: 274, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-${mode === 'grid' ? 'th-large' : 'list'}`, __source: { fileName: "", lineNumber: 283, columnNumber: 11 }, __self: this })))))), searchMode && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black/60 backdrop-blur-sm flex items-center justify-center p-4 z-50", __source: { fileName: "", lineNumber: 291, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-3xl shadow-2xl w-full max-w-2xl transform transition-all", __source: { fileName: "", lineNumber: 292, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-8", __source: { fileName: "", lineNumber: 293, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-6", __source: { fileName: "", lineNumber: 294, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold text-gray-800 flex items-center", __source: { fileName: "", lineNumber: 295, columnNumber: 19 }, __self: this }, searchMode === 'pronunciation' ? /*#__PURE__*/ React.createElement("div", { className: "bg-blue-100 text-blue-600 rounded-xl p-2 mr-3", __source: { fileName: "", lineNumber: 297, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl", __source: { fileName: "", lineNumber: 298, columnNumber: 25 }, __self: this }, "あA")) : /*#__PURE__*/ React.createElement("div", { className: "bg-purple-100 text-purple-600 rounded-xl p-2 mr-3", __source: { fileName: "", lineNumber: 301, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl", __source: { fileName: "", lineNumber: 302, columnNumber: 25 }, __self: this }, "🗣️💭")), searchMode === 'pronunciation' ? 'ひらがな/カタカナから検索' : '意味から検索'), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSearchMode(null), className: "text-gray-400 hover:text-gray-600 transition-colors", __source: { fileName: "", lineNumber: 307, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times text-xl", __source: { fileName: "", lineNumber: 311, columnNumber: 21 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 315, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: searchQuery, onChange: (e)=>setSearchQuery(e.target.value), placeholder: searchMode === 'pronunciation' ? 'ひらがな/カタカナを入力' : '使用シーンを入力', className: "flex-1 p-4 border-2 border-gray-200 rounded-xl text-gray-800 text-lg focus:border-blue-500 focus:ring-2 focus:ring-blue-200 transition-all", autoFocus: true, __source: { fileName: "", lineNumber: 316, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: handleSearch, disabled: loading, className: "px-8 bg-blue-500 text-white rounded-xl hover:bg-blue-600 disabled:opacity-50 transition-all flex items-center justify-center min-w-[120px]", __source: { fileName: "", lineNumber: 324, columnNumber: 19 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("div", { className: "animate-spin rounded-full h-6 w-6 border-b-2 border-white", __source: { fileName: "", lineNumber: 330, columnNumber: 23 }, __self: this }) : 'さがす')), error && /*#__PURE__*/ React.createElement("div", { className: "mt-6 bg-red-100 border-2 border-red-200 text-red-700 px-4 py-3 rounded-xl", __source: { fileName: "", lineNumber: 338, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { className: "font-bold", __source: { fileName: "", lineNumber: 339, columnNumber: 21 }, __self: this }, "エラー: "), /*#__PURE__*/ React.createElement("span", { className: "block sm:inline", __source: { fileName: "", lineNumber: 340, columnNumber: 21 }, __self: this }, error)), loading && streamingMessage && /*#__PURE__*/ React.createElement("div", { className: "mt-6 p-4 border-2 border-blue-200 bg-blue-50 text-blue-700 rounded-xl", __source: { fileName: "", lineNumber: 345, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 346, columnNumber: 21 }, __self: this }, "生成中: ", streamingMessage)), currentSearchResult && /*#__PURE__*/ React.createElement("div", { className: "mt-8 border-2 border-gray-100 rounded-xl p-6 bg-gray-50", __source: { fileName: "", lineNumber: 351, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 352, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-sm font-medium bg-blue-100 text-blue-600 px-4 py-2 rounded-full", __source: { fileName: "", lineNumber: 353, columnNumber: 23 }, __self: this }, "✨ 検索結果")), /*#__PURE__*/ React.createElement("h3", { className: "text-2xl font-bold text-gray-800 mb-3", __source: { fileName: "", lineNumber: 357, columnNumber: 21 }, __self: this }, currentSearchResult.english), /*#__PURE__*/ React.createElement("p", { className: "text-lg text-blue-600", __source: { fileName: "", lineNumber: 360, columnNumber: 21 }, __self: this }, currentSearchResult.pronunciation), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 mt-3", __source: { fileName: "", lineNumber: 363, columnNumber: 21 }, __self: this }, currentSearchResult.meaning), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mt-3 italic bg-white p-4 rounded-xl", __source: { fileName: "", lineNumber: 366, columnNumber: 21 }, __self: this }, currentSearchResult.example), /*#__PURE__*/ React.createElement("button", { onClick: addToCards, className: "mt-6 w-full py-4 bg-blue-500 text-white rounded-xl hover:bg-blue-600 transition-all text-lg font-medium flex items-center justify-center gap-2", __source: { fileName: "", lineNumber: 369, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 373, columnNumber: 23 }, __self: this }, "カードに追加"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus", __source: { fileName: "", lineNumber: 374, columnNumber: 23 }, __self: this })))))), error && !searchMode && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative mb-4 font-inter", __source: { fileName: "", lineNumber: 384, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { className: "font-bold", __source: { fileName: "", lineNumber: 385, columnNumber: 13 }, __self: this }, "エラー: "), /*#__PURE__*/ React.createElement("span", { className: "block sm:inline", __source: { fileName: "", lineNumber: 386, columnNumber: 13 }, __self: this }, error)), loading && !searchMode && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 391, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "animate-pulse space-y-4", __source: { fileName: "", lineNumber: 392, columnNumber: 13 }, __self: this }, [ 1, 2, 3 ].map((i)=>/*#__PURE__*/ React.createElement("div", { key: i, className: "bg-gray-200 dark:bg-gray-700 h-32 rounded p-4", __source: { fileName: "", lineNumber: 394, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-4 bg-gray-300 dark:bg-gray-600 rounded w-3/4 mb-2", __source: { fileName: "", lineNumber: 395, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "h-3 bg-gray-300 dark:bg-gray-600 rounded w-1/2 mb-2", __source: { fileName: "", lineNumber: 396, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "h-3 bg-gray-300 dark:bg-gray-600 rounded w-2/3", __source: { fileName: "", lineNumber: 397, columnNumber: 19 }, __self: this })))), streamingMessage && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-4 border border-blue-200 bg-blue-50 text-blue-700 rounded", __source: { fileName: "", lineNumber: 402, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-inter", __source: { fileName: "", lineNumber: 403, columnNumber: 17 }, __self: this }, "生成中: ", streamingMessage))), /*#__PURE__*/ React.createElement("div", { className: `${viewMode === 'grid' ? 'grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6' : 'space-y-6'} transition-all duration-300`, __source: { fileName: "", lineNumber: 409, columnNumber: 9 }, __self: this }, savedWords.map((word)=>/*#__PURE__*/ React.createElement("div", { key: word.id, className: "bg-white rounded-2xl p-6 shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1", __source: { fileName: "", lineNumber: 411, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4 flex justify-between items-center", __source: { fileName: "", lineNumber: 415, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `text-sm font-medium px-4 py-2 rounded-full ${word.search_mode === 'pronunciation' ? 'bg-blue-100 text-blue-600' : 'bg-purple-100 text-purple-600'}`, __source: { fileName: "", lineNumber: 416, columnNumber: 17 }, __self: this }, word.search_mode === 'pronunciation' ? '🎯 発音から' : '💭 意味から'), /*#__PURE__*/ React.createElement("span", { className: "text-sm text-gray-400", __source: { fileName: "", lineNumber: 423, columnNumber: 17 }, __self: this }, new Date(word.created_at).toLocaleDateString('ja-JP'))), /*#__PURE__*/ React.createElement("h3", { className: "text-2xl font-bold text-gray-800 mb-3 font-inter", __source: { fileName: "", lineNumber: 427, columnNumber: 15 }, __self: this }, word.english), /*#__PURE__*/ React.createElement("p", { className: "text-lg text-blue-600 font-inter", __source: { fileName: "", lineNumber: 430, columnNumber: 15 }, __self: this }, word.pronunciation), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mt-3 font-inter", __source: { fileName: "", lineNumber: 433, columnNumber: 15 }, __self: this }, word.meaning), /*#__PURE__*/ React.createElement("p", { className: "text-gray-500 mt-3 italic bg-gray-50 p-3 rounded-xl font-inter", __source: { fileName: "", lineNumber: 436, columnNumber: 15 }, __self: this }, word.example)))), savedWords.length >= limit && /*#__PURE__*/ React.createElement("div", { className: "text-center mt-8", __source: { fileName: "", lineNumber: 444, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleLoadMore, disabled: loadingMore, className: "px-6 py-3 bg-blue-500 hover:bg-blue-600 text-white rounded-xl transition-all", __source: { fileName: "", lineNumber: 445, columnNumber: 13 }, __self: this }, loadingMore ? /*#__PURE__*/ React.createElement("span", { className: "flex items-center", __source: { fileName: "", lineNumber: 451, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "animate-spin rounded-full h-4 w-4 border-b-2 border-white mr-2", __source: { fileName: "", lineNumber: 452, columnNumber: 19 }, __self: this }), "読み込み中...") : 'もっと見る')), savedWords.length === 0 && !loading && !error && /*#__PURE__*/ React.createElement("div", { className: "text-center py-12 bg-gray-50 dark:bg-gray-800 rounded-lg", __source: { fileName: "", lineNumber: 463, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 dark:text-gray-300 font-inter", __source: { fileName: "", lineNumber: 464, columnNumber: 13 }, __self: this }, "検索結果がありません。別のキーワードで試してみてください。")))); }

Englishわーど

ひらがな/カタカナから

意味から