fix(components-motion): add focus a11y style for Bounce motion (#873)

sabertazimi · May 28, 2022 · 97e01d8 · 97e01d8 · vercel · May 28, 2022
1 parent cbb8ac2
commit 97e01d8
Showing 1 changed file with 5 additions and 0 deletions.
diff --git a/components/Motion/Bounce.tsx b/components/Motion/Bounce.tsx
@@ -18,6 +18,10 @@ const inViewVariants: MotionProps['whileInView'] = {
   x: 0,
 };
 
+const focusVariants: MotionProps['whileFocus'] = {
+  x: -5,
+};
+
 const hoverVariants: MotionProps['whileHover'] = {
   x: -5,
 };
@@ -40,6 +44,7 @@ const Bounce = ({
     className={cx('inline-flex', className)}
     initial={initialVariants}
     whileInView={inViewVariants}
+    whileFocus={focusVariants}
     whileHover={hoverVariants}
     whileTap={tapVariants}
     transition={{