Merge pull request #13 from Rajdeepc/bugfix/accessibility-counter

Added accessibility and typo issue fix on React counter package

react/src/machine-coding/counter/counter.tsx

@@ -26,26 +26,29 @@ function Counter() {
     <main className={styles.main}>
       <h2>{value}</h2>
 
-      <div>
-        <button onClick={decrement}>-</button>
-        <button onClick={increment}>+</button>
-      </div>
-
-      <div>
-        <label htmlFor="step">Icrement/Decrement by</label>
+      <section>
+        <button onClick={decrement} aria-label="Decrement">
+          -
+        </button>
+        <button onClick={increment} aria-label="Increment">
+          +
+        </button>
+      </section>
+
+      <section>
+        <label htmlFor="step">Increment/Decrement by</label>
         <input
           type="number"
           id="step"
           defaultValue={step.current}
-          onChange={(e) =>
-            setStep((e.target as HTMLInputElement).valueAsNumber)
-          }
+          onChange={(e) => setStep((e.target as HTMLInputElement).valueAsNumber)}
+          title="Step value"
         />
-      </div>
+      </section>
 
-      <div>
+      <section>
         <button onClick={reset}>Reset</button>
-      </div>
+      </section>
     </main>
   );
 }