From ac79a48c07c538316949d6284bc5d9c0eb2e3f91 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Tue, 7 Jun 2022 12:11:28 +0200
Subject: chore: add aria hidden attribute to SVG icons

---
 src/components/atoms/icons/arrow.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

(limited to 'src/components/atoms/icons/arrow.tsx')

diff --git a/src/components/atoms/icons/arrow.tsx b/src/components/atoms/icons/arrow.tsx
index 2962530..8aec5a1 100644
--- a/src/components/atoms/icons/arrow.tsx
+++ b/src/components/atoms/icons/arrow.tsx
@@ -4,6 +4,10 @@ import styles from './arrow.module.scss';
 export type ArrowDirection = 'top' | 'right' | 'bottom' | 'left';
 
 export type ArrowProps = {
+  /**
+   * Should the svg be hidden from assistive technologies?
+   */
+  'aria-hidden'?: boolean;
   /**
    * Set additional classnames to the icon.
    */
@@ -19,7 +23,7 @@ export type ArrowProps = {
  *
  * Render a svg arrow icon.
  */
-const Arrow: FC<ArrowProps> = ({ className = '', direction }) => {
+const Arrow: FC<ArrowProps> = ({ className = '', direction, ...props }) => {
   const directionClass = styles[`icon--${direction}`];
   const classes = `${styles.icon} ${directionClass} ${className}`;
 
@@ -29,6 +33,7 @@ const Arrow: FC<ArrowProps> = ({ className = '', direction }) => {
         className={classes}
         viewBox="0 0 23.476 64.644995"
         xmlns="http://www.w3.org/2000/svg"
+        {...props}
       >
         <path
           className="arrow-head"
@@ -48,6 +53,7 @@ const Arrow: FC<ArrowProps> = ({ className = '', direction }) => {
         className={classes}
         viewBox="0 0 23.476 64.644995"
         xmlns="http://www.w3.org/2000/svg"
+        {...props}
       >
         <path
           className="arrow-head"
@@ -67,6 +73,7 @@ const Arrow: FC<ArrowProps> = ({ className = '', direction }) => {
         className={classes}
         viewBox="0 0 64.644997 23.476001"
         xmlns="http://www.w3.org/2000/svg"
+        {...props}
       >
         <path
           className="arrow-head"
@@ -85,6 +92,7 @@ const Arrow: FC<ArrowProps> = ({ className = '', direction }) => {
       className={classes}
       viewBox="0 0 64.644997 23.476001"
       xmlns="http://www.w3.org/2000/svg"
+      {...props}
     >
       <path
         className="arrow-head"
-- 
cgit v1.2.3