use defaultValue to avoid displaying zero when cleared

yoyomo · May 30, 2024 · 5125165 · 5125165
1 parent 7f766ec
commit 5125165
Showing 1 changed file with 3 additions and 3 deletions.
diff --git a/src/LoopStart.tsx b/src/LoopStart.tsx
@@ -18,9 +18,9 @@ export const LoopStart = () => {
   return (
     <div className="flex flex-col justify-center items-center text-center gap-y-2 bg-gray-100">
       <h1 className="text-3xl font-bold m-2"> SP 404 Perfect Loop Start Calculator:</h1>
-      BPM: <NumberInput value={bpm} onUpdate={setBPM} />
-      Sample Length: <NumberInput value={sampleLength} onUpdate={setSampleLength} />
-      Number of Bars (max. {maxBars}): <NumberInput value={numberOfBars} onUpdate={setNumberOfBars} max={maxBars}/>
+      BPM: <NumberInput defaultValue={bpm} onUpdate={setBPM} />
+      Sample Length: <NumberInput defaultValue={sampleLength} onUpdate={setSampleLength} />
+      Number of Bars (max. {maxBars}): <NumberInput defaultValue={numberOfBars} onUpdate={setNumberOfBars} max={maxBars}/>
       <label>Loop Start:</label>
       <div className="text-lg">{loopStart}</div>
     </div>