♿️ (frontend) navigation with tab and other modifications

- In DocGrid, when navigating with tab, we can see where we are
- In Doc, don't read "doc title input" but "rename"
- In docSearch, don't read "search" icon and read "aucun document
  trouvé" with screen reader

src/frontend/apps/impress/src/components/quick-search/QuickSearchInput.tsx

@@ -47,7 +47,11 @@ export const QuickSearchInput = ({
         $gap={spacing['2xs']}
         $padding={{ all: 'base' }}
       >
-        {!loading && <Icon iconName="search" $variation="600" />}
+        {!loading && (
+          <span aria-hidden="true">
+            <Icon iconName="search" $variation="600" />
+          </span>
+        )}
         {loading && (
           <div>
             <Loader size="small" />

src/frontend/apps/impress/src/cunningham/cunningham-style.css

@@ -605,3 +605,28 @@ input:-webkit-autofill:focus {
 .c__tooltip {
   padding: 4px 6px;
 }
+
+/**
+ * lecture ou non des icons
+ */
+ .sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+
+[data-icon]:before {
+  font-family: 'Material Icons';
+  content: attr(data-icon);
+}
+
+button:focus {
+  outline: 3px solid #4D90FE; 
+}
+

src/frontend/apps/impress/src/features/docs/doc-header/components/DocTitle.tsx

@@ -1,5 +1,3 @@
-/* eslint-disable jsx-a11y/click-events-have-key-events */
-/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
 import {
   Tooltip,
   VariantType,
@@ -114,7 +112,6 @@ const DocTitleInput = ({ doc }: DocTitleProps) => {
           defaultValue={isUntitled ? undefined : titleDisplay}
           onKeyDownCapture={handleKeyDown}
           suppressContentEditableWarning={true}
-          aria-label="doc title input"
           onBlurCapture={(event) =>
             handleTitleSubmit(event.target.textContent || '')
           }

src/frontend/apps/impress/src/features/docs/doc-search/components/DocSearchModal.tsx

@@ -51,7 +51,7 @@ export const DocSearchModal = ({ ...modalProps }: DocSearchModalProps) => {
     return {
       groupName: docs.length > 0 ? t('Select a document') : '',
       elements: search ? docs : [],
-      emptyString: t('No document found'),
+      //emptyString: t('No document found'),
       endActions: hasNextPage
         ? [{ content: <InView onChange={() => void fetchNextPage()} /> }]
         : [],
@@ -96,6 +96,20 @@ export const DocSearchModal = ({ ...modalProps }: DocSearchModalProps) => {
                 renderElement={(doc) => <DocSearchItem doc={doc} />}
               />
             )}
+            {/* Message accessible pour les résultats vides */}
+            {search && docsData.elements.length === 0 && (
+              <p
+                role="alert"
+                aria-live="polite"
+                style={{
+                  textAlign: 'center',
+                  marginTop: '1rem',
+                  color: '#666',
+                }}
+              >
+                {t('No document found')}
+              </p>
+            )}
           </Box>
         </QuickSearch>
       </Box>

src/frontend/apps/impress/src/i18n/translations.json

@@ -246,7 +246,7 @@
       "It's true, you didn't have to click on a block that covers half the page to say you agree to the placement of cookies — even if you don't know what it means!": "C'est vrai, vous n'avez pas à cliquer sur un bloc qui couvre la moitié de la page pour dire que vous acceptez le placement de cookies — même si vous ne savez pas ce que cela signifie !",
       "Language": "Langue",
       "Last update: {{update}}": "Dernière mise à jour : {{update}}",
-      "Legal Notice": "Mentions Legales",
+      "Legal Notice": "Mentions Légales",
       "Legal notice": "Mention légale",
       "Link Copied !": "Lien copié !",
       "Link parameters": "Paramètres du lien",