Fixed a11y violations (#26125)

* fixed a11y violations

Signed-off-by: Agnieszka Gancarczyk <agancarc@redhat.com>

* fixed a11y violations

Signed-off-by: Agnieszka Gancarczyk <agancarc@redhat.com>

* fixed a11y violations

Signed-off-by: Agnieszka Gancarczyk <agancarc@redhat.com>

* fixed a11y violations

Signed-off-by: Agnieszka Gancarczyk <agancarc@redhat.com>

---------

Signed-off-by: Agnieszka Gancarczyk <agancarc@redhat.com>
Co-authored-by: Agnieszka Gancarczyk <agancarc@redhat.com>

js/apps/admin-ui/maven-resources/theme/keycloak.v2/admin/messages/messages_en.properties

@@ -2982,3 +2982,4 @@ viewDocumentation=Refer to documentation
 viewGuides=View guides
 joinCommunity=Join community
 readBlog=Read blog
+customValue=Custom value

js/apps/admin-ui/src/clients/authorization/policy/Client.tsx

@@ -84,6 +84,7 @@ export const Client = () => {
           <Select
             toggleId="clients"
             variant={SelectVariant.typeaheadMulti}
+            typeAheadAriaLabel={t("clients")}
             onToggle={(open) => setOpen(open)}
             isOpen={open}
             selections={field.value}
@@ -102,7 +103,6 @@ export const Client = () => {
               }
               setOpen(false);
             }}
-            aria-label={t("clients")}
           >
             {convert(clients)}
           </Select>

js/apps/admin-ui/src/components/alert/AlertPanel.tsx

@@ -23,6 +23,7 @@ export function AlertPanel({ alerts, onCloseAlert }: AlertPanelProps) {
           key={id}
           isLiveRegion
           variant={AlertVariant[variant]}
+          component="p"
           variantLabel=""
           title={message}
           actionClose={

js/apps/admin-ui/src/components/key-value-form/ValueSelect.tsx

@@ -41,6 +41,10 @@ export const ValueSelect = ({
       ))}
     </Select>
   ) : (
-    <KeycloakTextInput id="customValue" data-testid={rest.name} {...field} />
+    <KeycloakTextInput
+      aria-label={t("customValue")}
+      data-testid={rest.name}
+      {...field}
+    />
   );
 };

js/apps/admin-ui/src/realm-settings/user-profile/attribute/AttributeGeneralSettings.tsx

@@ -126,7 +126,7 @@ export const AttributeGeneralSettings = () => {
             fieldLabelId="realm-setting:attributeGroup"
           />
         }
-        fieldId="kc-attribute-group"
+        fieldId="kc-attributeGroup"
       >
         <Controller
           name="group"
@@ -135,6 +135,7 @@ export const AttributeGeneralSettings = () => {
           render={({ field }) => (
             <Select
               toggleId="kc-attributeGroup"
+              aria-label={t("attributeGroup")}
               onToggle={() =>
                 setIsAttributeGroupDropdownOpen(!isAttributeGroupDropdownOpen)
               }

js/apps/admin-ui/src/realm-settings/user-profile/attribute/AttributeValidations.tsx

@@ -131,7 +131,7 @@ export const AttributeValidations = () => {
             </Tbody>
           </TableComposable>
         ) : (
-          <Text className="kc-emptyValidators" component={TextVariants.h6}>
+          <Text className="kc-emptyValidators" component={TextVariants.p}>
             {t("emptyValidators")}
           </Text>
         )}

js/apps/admin-ui/src/user-federation/ldap/mappers/LdapMapperDetails.tsx

@@ -295,6 +295,7 @@ export default function LdapMapperDetails() {
                 render={({ field }) => (
                   <Select
                     toggleId="kc-providerId"
+                    typeAheadAriaLabel={t("mapperType")}
                     required
                     onToggle={() =>
                       setIsMapperDropdownOpen(!isMapperDropdownOpen)