\n {/* Header */}\n

Shred Reader

\n Press Space to Play/Pause\n

\n\n {/* Main Reader Display */}\n

\n\n

\n {wpm} wpm\n

\n\n \n

\n {word ? left : \"\"}\n

\n {word ? focus : \"...\"}\n

\n {word ? right : \"\"}\n

\n\n {/* Controls Panel */}\n \n

\n \n {percent}%\n \n onProgressInput(Number(e.target.value))}\n className=\"flex-1\"\n />\n \n {formatTimeRemaining(words.length, currentIndex, wpm)}\n \n

\n\n

\n \n \n \n\n \n \n \n

\n\n
\n \n setWpm(Number(e.target.value))}\n className=\"flex-1\"\n />\n \n
\n

\n\n
\n \n setUseSmartPacing(e.target.checked)}\n className=\"accent-white w-4 h-4 cursor-pointer\"\n />\n Smart Pacing (Pause on Punctuation)\n \n\n
\n \n setFontSizePx(Number(e.target.value))}\n className=\"w-24\"\n />\n \n
\n
\n\n
\n
\n \n Source Text\n \n \n {words.length} words\n \n
\n setSourceText(e.target.value)}\n className=\"w-full h-32 bg-[#111] border border-gray-800 rounded-xl p-4 text-sm text-gray-300 focus:outline-none focus:border-gray-600 resize-none transition-colors leading-relaxed\"\n />\n
\n

\n \n );\n}\n","deleted","label",[182,183,165],"frontend","components","permalink","https://www.val.town/x/KMan/shredreader/code/frontend/components/App.tsx","extension","actionData","errors"]