Add animation to Grouped Bar Graph

components/GroupedBarGraph.module.css

@@ -19,6 +19,10 @@
   fill: var(--label);
 }
 
+.bar {
+  transition: fill 0.5s ease-out;
+}
+
 .legend {
   display: flex;
   margin: calc(16rem / 16);

components/GroupedBarGraph.tsx

@@ -603,6 +603,7 @@ function HoverableBar(props: HoverableBarProps) {
       }}
     >
       <Bar
+        className={styles.bar}
         onMouseMove={onMouseMove}
         onMouseOut={onMouseOut}
         x={bar.x}