Add aria-labels to BadgeButton components in SearchFiltersColumn for …

…improved accessibility
danskernesdigitalebibliotek · Nov 11, 2024 · 00bc5f6 · 00bc5f6
1 parent 424ce9d
commit 00bc5f6
Showing 1 changed file with 2 additions and 0 deletions.
diff --git a/components/shared/searchFilters/SearchFiltersColumn.tsx b/components/shared/searchFilters/SearchFiltersColumn.tsx
@@ -62,6 +62,7 @@ const SearchFiltersColumn = ({
           ref={elementRef}>
           {facet.values.map((value, index) => (
             <BadgeButton
+              ariaLabel={value.term}
               onClick={() => toggleFilter(facet.name, value.term, router)}
               isActive={!!searchParams.getAll(facet.name).includes(value.term)}
               key={index}>
@@ -71,6 +72,7 @@ const SearchFiltersColumn = ({
         </div>
         {hasOverflow && (
           <BadgeButton
+            ariaLabel="Vis flere"
             classNames={cn(`pl-3 w-auto flex flex-row items-center self-start  ml-1`)}
             onClick={() => {
               setIsExpanded(prev => !prev)