#57 - wrap action buttons in toolbar role and specify control of valu…

…e output
jnahumphreys · Jan 25, 2024 · eaffac2 · eaffac2
1 parent 601d6df
commit eaffac2
Showing 1 changed file with 6 additions and 1 deletion.
diff --git a/src/app/counter-actions.tsx b/src/app/counter-actions.tsx
@@ -2,6 +2,7 @@ import { memo } from "react";
 import styled from "@emotion/styled";
 import { useCounterState, useCounterActions } from "./counter-provider";
 import { Button } from "./button";
+import { COUNTER_VALUE_CONTAINER_ID } from "./counter-output";
 
 function DecrementCount() {
   const count = useCounterState();
@@ -58,7 +59,11 @@ const Container = styled.div({
 
 function CounterActions() {
   return (
-    <Container>
+    <Container
+      aria-label="Counter actions"
+      role="toolbar"
+      aria-controls={COUNTER_VALUE_CONTAINER_ID}
+    >
       <DecrementCount />
       <IncrementCount />
       <ResetCount />