From 71c921e5782f9064390efb3b6cf0b0f510282964 Mon Sep 17 00:00:00 2001
From: Alexey Antonov <alexwizp@gmail.com>
Date: Tue, 5 Nov 2024 17:38:44 +0200
Subject: [PATCH] fix: [Stateful: Indices Overview page] Inaccurate
 announcement for programming language buttons (#197428)

Closes: #196282

## Summary

Button elements should be clear and understandable to users, including
those using assistive technologies. `h5` tag looks unnatural inside a
button.

## What was changed?:

1. `h5` -> `strong`

## Screen:

<img width="1190" alt="image"
src="https://github.com/user-attachments/assets/ea02864f-4091-4cc9-a674-ebf1f4ee7499">

(cherry picked from commit 7f97c8074f7d6c2adf4a7a35fa7ac96b25f6cfe4)
---
 .../components/language_client_panel.tsx                  | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/kbn-search-api-panels/components/language_client_panel.tsx b/packages/kbn-search-api-panels/components/language_client_panel.tsx
index 2f89c8da7578..2c07d3118d94 100644
--- a/packages/kbn-search-api-panels/components/language_client_panel.tsx
+++ b/packages/kbn-search-api-panels/components/language_client_panel.tsx
@@ -62,8 +62,12 @@ export const LanguageClientPanel: React.FC<SelectClientProps> = ({
                 width={euiTheme.size.xl}
               />
               <EuiSpacer size="s" />
-              <EuiText textAlign="center" color={isSelectedLanguage ? 'default' : 'subdued'}>
-                <h5>{language.name}</h5>
+              <EuiText
+                size="relative"
+                textAlign="center"
+                color={isSelectedLanguage ? 'default' : 'subdued'}
+              >
+                <strong>{language.name}</strong>
               </EuiText>
             </EuiFlexItem>
           </EuiFlexGroup>