function MainComponent() { const defaultWeight = 50; const [consonantWeights, setConsonantWeights] = useState({ b: defaultWeight, d: defaultWeight, f: defaultWeight, g: defaultWeight, h: defaultWeight, k: defaultWeight, l: defaultWeight, m: defaultWeight, n: defaultWeight, p: defaultWeight, r: defaultWeight, s: defaultWeight, t: defaultWeight, v: defaultWeight, w: defaultWeight, y: defaultWeight, z: defaultWeight }); const [vowelWeights, setVowelWeights] = useState({ a: defaultWeight, e: defaultWeight, i: defaultWeight, o: defaultWeight, u: defaultWeight }); const [nasalWeights, setNasalWeights] = useState({ m: defaultWeight, n: defaultWeight, ng: defaultWeight }); const [pattern, setPattern] = useState(''); const [wordCount, setWordCount] = useState(10); const [generatedWords, setGeneratedWords] = useState([]); const [error, setError] = useState(''); const [isPropertiesOpen, setIsPropertiesOpen] = useState(false); const [displayFormat, setDisplayFormat] = useState('list'); const [showDeleteConfirm, setShowDeleteConfirm] = useState(''); const [showUpdates, setShowUpdates] = useState(false); const [newLetter, setNewLetter] = useState({ category: '', letter: '', weight: defaultWeight }); const examplePatterns = [ 'CV', 'CVC', 'CV(N)', 'CVCV', 'CVCCV', '(C)VCV' ]; const validatePattern = (pattern)=>{ return /^[CVN()]+$/.test(pattern); }; const resetWeights = ()=>{ setConsonantWeights(Object.fromEntries(Object.keys(consonantWeights).map((k)=>[ k, defaultWeight ]))); setVowelWeights(Object.fromEntries(Object.keys(vowelWeights).map((k)=>[ k, defaultWeight ]))); setNasalWeights(Object.fromEntries(Object.keys(nasalWeights).map((k)=>[ k, defaultWeight ]))); }; const getWeightedRandomChar = (weights)=>{ const totalWeight = Object.values(weights).reduce((sum, weight)=>sum + weight, 0); let random = Math.random() * totalWeight; for (const [char, weight] of Object.entries(weights)){ random -= weight; if (random <= 0) return char; } return Object.keys(weights)[0]; }; const generateWords = ()=>{ if (!validatePattern(pattern)) { setError('Pattern can only contain C, V, N, and parentheses ()'); return; } setError(''); const getRandomChar = (type)=>{ if (type === 'C') return getWeightedRandomChar(consonantWeights); if (type === 'V') return getWeightedRandomChar(vowelWeights); return getWeightedRandomChar(nasalWeights); }; const words = []; for(let i = 0; i < wordCount; i++){ let word = ''; let j = 0; while(j < pattern.length){ if (pattern[j] === '(') { const endIndex = pattern.indexOf(')', j); if (Math.random() < 0.5) { const subPattern = pattern.slice(j + 1, endIndex); word += subPattern.split('').map((char)=>getRandomChar(char)).join(''); } j = endIndex + 1; } else { word += getRandomChar(pattern[j]); j++; } } words.push(word); } setGeneratedWords(words); }; const handleDeleteLetter = (category, letter)=>{ const setterMap = { consonants: setConsonantWeights, vowels: setVowelWeights, nasals: setNasalWeights }; const weightsMap = { consonants: consonantWeights, vowels: vowelWeights, nasals: nasalWeights }; const weights = { ...weightsMap[category] }; if (Object.keys(weights).length > 1) { delete weights[letter]; setterMap[category](weights); } }; const handleAddLetter = (category)=>{ if (!newLetter.letter) return; const setterMap = { consonants: setConsonantWeights, vowels: setVowelWeights, nasals: setNasalWeights }; const weightsMap = { consonants: consonantWeights, vowels: vowelWeights, nasals: nasalWeights }; setterMap[category]((prev)=>({ ...prev, [newLetter.letter.toLowerCase()]: defaultWeight })); setNewLetter({ category: '', letter: '', weight: defaultWeight }); }; const handleDeleteAll = (category)=>{ const setterMap = { consonants: setConsonantWeights, vowels: setVowelWeights, nasals: setNasalWeights }; const weightsMap = { consonants: consonantWeights, vowels: vowelWeights, nasals: nasalWeights }; const firstKey = Object.keys(weightsMap[category])[0]; setterMap[category]({ [firstKey]: defaultWeight }); setShowDeleteConfirm(''); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 p-8 flex", __source: { fileName: "", lineNumber: 134, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `fixed top-0 right-0 h-full w-[400px] bg-white shadow-lg transform transition-transform duration-300 ease-in-out ${isPropertiesOpen ? 'translate-x-0' : 'translate-x-full'} z-50`, __source: { fileName: "", lineNumber: 135, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-full flex flex-col", __source: { fileName: "", lineNumber: 136, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-gray-200 p-3 flex justify-between items-center border-b border-gray-300", __source: { fileName: "", lineNumber: 137, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold font-inter", __source: { fileName: "", lineNumber: 138, columnNumber: 13 }, __self: this }, "Properties"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsPropertiesOpen(false), className: "text-gray-600 hover:text-gray-800 transition-colors", __source: { fileName: "", lineNumber: 139, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 143, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "p-6 flex-1 overflow-y-auto", __source: { fileName: "", lineNumber: 146, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 147, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 148, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 149, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-2", __source: { fileName: "", lineNumber: 150, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-inter text-gray-700", __source: { fileName: "", lineNumber: 151, columnNumber: 7 }, __self: this }, "Consonants"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 154, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowDeleteConfirm('consonants'), className: "px-2 py-1 text-sm text-red-600 hover:bg-red-50 rounded", __source: { fileName: "", lineNumber: 155, columnNumber: 9 }, __self: this }, "Delete All"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setNewLetter({ category: 'consonants', letter: '', weight: defaultWeight }), className: "px-2 py-1 text-sm bg-blue-50 text-blue-600 rounded hover:bg-blue-100", __source: { fileName: "", lineNumber: 161, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus", __source: { fileName: "", lineNumber: 165, columnNumber: 11 }, __self: this })))), /*#__PURE__*/ React.createElement("p", { className: "text-xs text-gray-500 mb-2", __source: { fileName: "", lineNumber: 169, columnNumber: 5 }, __self: this }, "Higher weights (1-100) increase the chance of a letter being selected"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-2", __source: { fileName: "", lineNumber: 170, columnNumber: 5 }, __self: this }, Object.entries(consonantWeights).map(([letter, weight])=>/*#__PURE__*/ React.createElement("div", { key: letter, className: "flex items-center space-x-2 p-2 border rounded", __source: { fileName: "", lineNumber: 172, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-mono w-6", __source: { fileName: "", lineNumber: 173, columnNumber: 11 }, __self: this }, letter), /*#__PURE__*/ React.createElement("input", { type: "number", min: "1", max: "100", value: weight, onChange: (e)=>setConsonantWeights((prev)=>({ ...prev, [letter]: Math.min(100, Math.max(1, parseInt(e.target.value) || 1)) })), className: "w-full p-1 border rounded text-sm", __source: { fileName: "", lineNumber: 174, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleDeleteLetter('consonants', letter), className: "text-red-500 hover:text-red-700", __source: { fileName: "", lineNumber: 185, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 189, columnNumber: 13 }, __self: this })))), newLetter.category === 'consonants' && /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2 p-2 border rounded bg-blue-50", __source: { fileName: "", lineNumber: 194, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: newLetter.letter, onChange: (e)=>setNewLetter((prev)=>({ ...prev, letter: e.target.value })), className: "w-16 p-1 border rounded text-sm", maxLength: 2, placeholder: "Letter", __source: { fileName: "", lineNumber: 195, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleAddLetter('consonants'), className: "text-blue-600 hover:text-blue-800", __source: { fileName: "", lineNumber: 203, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check", __source: { fileName: "", lineNumber: 207, columnNumber: 13 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 213, columnNumber: 1 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-2", __source: { fileName: "", lineNumber: 214, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-inter text-gray-700", __source: { fileName: "", lineNumber: 215, columnNumber: 7 }, __self: this }, "Vowels"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 218, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowDeleteConfirm('vowels'), className: "px-2 py-1 text-sm text-red-600 hover:bg-red-50 rounded", __source: { fileName: "", lineNumber: 219, columnNumber: 9 }, __self: this }, "Delete All"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setNewLetter({ category: 'vowels', letter: '', weight: defaultWeight }), className: "px-2 py-1 text-sm bg-blue-50 text-blue-600 rounded hover:bg-blue-100", __source: { fileName: "", lineNumber: 225, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus", __source: { fileName: "", lineNumber: 229, columnNumber: 11 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-2", __source: { fileName: "", lineNumber: 233, columnNumber: 5 }, __self: this }, Object.entries(vowelWeights).map(([letter, weight])=>/*#__PURE__*/ React.createElement("div", { key: letter, className: "flex items-center space-x-2 p-2 border rounded", __source: { fileName: "", lineNumber: 235, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-mono w-6", __source: { fileName: "", lineNumber: 236, columnNumber: 11 }, __self: this }, letter), /*#__PURE__*/ React.createElement("input", { type: "number", min: "1", max: "100", value: weight, onChange: (e)=>setVowelWeights((prev)=>({ ...prev, [letter]: Math.min(100, Math.max(1, parseInt(e.target.value) || 1)) })), className: "w-full p-1 border rounded text-sm", __source: { fileName: "", lineNumber: 237, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleDeleteLetter('vowels', letter), className: "text-red-500 hover:text-red-700", __source: { fileName: "", lineNumber: 248, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 252, columnNumber: 13 }, __self: this })))), newLetter.category === 'vowels' && /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2 p-2 border rounded bg-blue-50", __source: { fileName: "", lineNumber: 257, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: newLetter.letter, onChange: (e)=>setNewLetter((prev)=>({ ...prev, letter: e.target.value })), className: "w-16 p-1 border rounded text-sm", maxLength: 2, placeholder: "Letter", __source: { fileName: "", lineNumber: 258, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleAddLetter('vowels'), className: "text-blue-600 hover:text-blue-800", __source: { fileName: "", lineNumber: 266, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check", __source: { fileName: "", lineNumber: 270, columnNumber: 13 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 277, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-2", __source: { fileName: "", lineNumber: 278, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-inter text-gray-700", __source: { fileName: "", lineNumber: 279, columnNumber: 7 }, __self: this }, "Nasals"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 282, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowDeleteConfirm('nasals'), className: "px-2 py-1 text-sm text-red-600 hover:bg-red-50 rounded", __source: { fileName: "", lineNumber: 283, columnNumber: 9 }, __self: this }, "Delete All"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setNewLetter({ category: 'nasals', letter: '', weight: defaultWeight }), className: "px-2 py-1 text-sm bg-blue-50 text-blue-600 rounded hover:bg-blue-100", __source: { fileName: "", lineNumber: 289, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus", __source: { fileName: "", lineNumber: 293, columnNumber: 11 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-2", __source: { fileName: "", lineNumber: 297, columnNumber: 5 }, __self: this }, Object.entries(nasalWeights).map(([letter, weight])=>/*#__PURE__*/ React.createElement("div", { key: letter, className: "flex items-center space-x-2 p-2 border rounded", __source: { fileName: "", lineNumber: 299, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-mono w-6", __source: { fileName: "", lineNumber: 300, columnNumber: 11 }, __self: this }, letter), /*#__PURE__*/ React.createElement("input", { type: "number", min: "1", max: "100", value: weight, onChange: (e)=>setNasalWeights((prev)=>({ ...prev, [letter]: Math.min(100, Math.max(1, parseInt(e.target.value) || 1)) })), className: "w-full p-1 border rounded text-sm", __source: { fileName: "", lineNumber: 301, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleDeleteLetter('nasals', letter), className: "text-red-500 hover:text-red-700", __source: { fileName: "", lineNumber: 312, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 316, columnNumber: 13 }, __self: this })))), newLetter.category === 'nasals' && /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2 p-2 border rounded bg-blue-50", __source: { fileName: "", lineNumber: 321, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", value: newLetter.letter, onChange: (e)=>setNewLetter((prev)=>({ ...prev, letter: e.target.value })), className: "w-16 p-1 border rounded text-sm", maxLength: 2, placeholder: "Letter", __source: { fileName: "", lineNumber: 322, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleAddLetter('nasals'), className: "text-blue-600 hover:text-blue-800", __source: { fileName: "", lineNumber: 330, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check", __source: { fileName: "", lineNumber: 334, columnNumber: 13 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-2", __source: { fileName: "", lineNumber: 340, columnNumber: 1 }, __self: this }, examplePatterns.map((p)=>/*#__PURE__*/ React.createElement("button", { key: p, onClick: ()=>setPattern(p), className: "px-3 py-1 text-sm font-inter border border-gray-300 rounded hover:bg-gray-100", __source: { fileName: "", lineNumber: 342, columnNumber: 7 }, __self: this }, p))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 351, columnNumber: 1 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-inter text-gray-700 mb-1", __source: { fileName: "", lineNumber: 352, columnNumber: 5 }, __self: this }, "Number of words to generate"), /*#__PURE__*/ React.createElement("input", { type: "number", min: "1", max: "50", value: wordCount, onChange: (e)=>setWordCount(Math.min(50, Math.max(1, parseInt(e.target.value) || 1))), className: "w-full p-2 border border-gray-300 rounded font-inter text-sm", __source: { fileName: "", lineNumber: 355, columnNumber: 5 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "mt-6", __source: { fileName: "", lineNumber: 365, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-inter text-gray-700 mb-2", __source: { fileName: "", lineNumber: 366, columnNumber: 3 }, __self: this }, "Output Display"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 369, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "inline-flex items-center", __source: { fileName: "", lineNumber: 370, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "radio", name: "displayFormat", value: "list", checked: displayFormat === 'list', onChange: (e)=>setDisplayFormat(e.target.value), className: "form-radio text-blue-600", __source: { fileName: "", lineNumber: 371, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-sm font-inter", __source: { fileName: "", lineNumber: 379, columnNumber: 7 }, __self: this }, "List View")), /*#__PURE__*/ React.createElement("label", { className: "inline-flex items-center", __source: { fileName: "", lineNumber: 381, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "radio", name: "displayFormat", value: "grid", checked: displayFormat === 'grid', onChange: (e)=>setDisplayFormat(e.target.value), className: "form-radio text-blue-600", __source: { fileName: "", lineNumber: 382, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-sm font-inter", __source: { fileName: "", lineNumber: 390, columnNumber: 7 }, __self: this }, "Grid View")))), error && /*#__PURE__*/ React.createElement("div", { className: "text-red-500 text-sm font-inter", __source: { fileName: "", lineNumber: 396, columnNumber: 17 }, __self: this }, error), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ generateWords(); setIsPropertiesOpen(false); }, className: "w-full bg-blue-600 text-white py-3 rounded font-inter font-semibold hover:bg-blue-700 transition-colors shadow-sm", __source: { fileName: "", lineNumber: 401, columnNumber: 15 }, __self: this }, "Generate"))))), /*#__PURE__*/ React.createElement("div", { className: `flex-1 transition-all duration-300 ${isPropertiesOpen ? 'mr-[400px]' : ''}`, __source: { fileName: "", lineNumber: 414, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 415, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-center mb-4 font-inter", __source: { fileName: "", lineNumber: 416, columnNumber: 5 }, __self: this }, "Welcome To Awkwords Rebooted (Fanmade)"), /*#__PURE__*/ React.createElement("p", { className: "text-center mb-8 text-gray-600 font-inter", __source: { fileName: "", lineNumber: 417, columnNumber: 5 }, __self: this }, "The original Awkwords has been inactive, so this is a fan-made reboot of the beloved word generator."), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end gap-2 mb-4", __source: { fileName: "", lineNumber: 421, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowUpdates(true), className: "bg-gray-200 hover:bg-gray-300 px-4 py-2 rounded font-inter", __source: { fileName: "", lineNumber: 422, columnNumber: 7 }, __self: this }, "Updates"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsPropertiesOpen(true), className: "bg-gray-200 hover:bg-gray-300 px-4 py-2 rounded font-inter", __source: { fileName: "", lineNumber: 428, columnNumber: 7 }, __self: this }, "Properties")), /*#__PURE__*/ React.createElement("div", { className: "bg-white border border-gray-300 rounded-lg p-6 shadow-lg", __source: { fileName: "", lineNumber: 436, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `max-h-[500px] overflow-y-auto ${displayFormat === 'grid' ? 'grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4' : ''}`, __source: { fileName: "", lineNumber: 437, columnNumber: 7 }, __self: this }, generatedWords.map((word, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: `${displayFormat === 'list' ? 'p-4 border-b border-gray-200 text-center last:border-b-0' : 'p-4 border border-gray-200 rounded'} font-mono text-xl hover:bg-gray-50`, __source: { fileName: "", lineNumber: 439, columnNumber: 11 }, __self: this }, word)))))), /*#__PURE__*/ React.createElement("div", { onClick: ()=>setIsPropertiesOpen(false), className: `fixed inset-0 bg-black transition-opacity duration-300 ${isPropertiesOpen ? 'opacity-50' : 'opacity-0 pointer-events-none'} z-40`, __source: { fileName: "", lineNumber: 450, columnNumber: 7 }, __self: this }), showDeleteConfirm && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 456, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-lg shadow-xl max-w-sm w-full mx-4", __source: { fileName: "", lineNumber: 457, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold mb-4", __source: { fileName: "", lineNumber: 458, columnNumber: 7 }, __self: this }, "Delete All ", showDeleteConfirm.charAt(0).toUpperCase() + showDeleteConfirm.slice(1), "?"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mb-6", __source: { fileName: "", lineNumber: 459, columnNumber: 7 }, __self: this }, "This will delete all letters except one. This action cannot be undone."), /*#__PURE__*/ React.createElement("div", { className: "flex justify-end gap-4", __source: { fileName: "", lineNumber: 460, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowDeleteConfirm(''), className: "px-4 py-2 text-gray-600 hover:bg-gray-100 rounded", __source: { fileName: "", lineNumber: 461, columnNumber: 9 }, __self: this }, "Cancel"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleDeleteAll(showDeleteConfirm), className: "px-4 py-2 bg-red-600 text-white rounded hover:bg-red-700", __source: { fileName: "", lineNumber: 467, columnNumber: 9 }, __self: this }, "Delete All")))), showUpdates && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 479, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-lg shadow-xl max-w-sm w-full mx-4", __source: { fileName: "", lineNumber: 480, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-4", __source: { fileName: "", lineNumber: 481, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-semibold", __source: { fileName: "", lineNumber: 482, columnNumber: 9 }, __self: this }, "Recent Updates"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowUpdates(false), className: "text-gray-600 hover:text-gray-800", __source: { fileName: "", lineNumber: 483, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 487, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 490, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 491, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "font-semibold mb-2", __source: { fileName: "", lineNumber: 492, columnNumber: 11 }, __self: this }, "Credits"), /*#__PURE__*/ React.createElement("ul", { className: "space-y-2 text-gray-600", __source: { fileName: "", lineNumber: 493, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 494, columnNumber: 13 }, __self: this }, "u/Der_Panzerjaeger (Reddit) - List view option"), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 495, columnNumber: 13 }, __self: this }, "u/brunow2023 (Reddit) - Letter weight system")))))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 503, columnNumber: 1 }, __self: this }, ` @keyframes slideIn { from { transform: translateX(100%); } to { transform: translateX(0); } } @keyframes slideOut { from { transform: translateX(0); } to { transform: translateX(100%); } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 0.5; } } @keyframes fadeOut { from { opacity: 0.5; } to { opacity: 0; } } `)); }