Translations for TagGroup (#6890)

* Translations for TagGroup

* add number of tags

* Revert " fix/bug useTablist #5996 (#6023)"

This reverts commit c4a783e.

* Revert "Extract `ToggleStateProps` type to use only what is needed in `useToggleState` (#3836)"

This reverts commit 81e3804.

---------

Co-authored-by: Daniel Lu <[email protected]>

Author: snowystinger

packages/@react-aria/selection/src/useSelectableCollection.ts

@@ -164,57 +164,49 @@ export function useSelectableCollection(options: AriaSelectableCollectionOptions
     switch (e.key) {
       case 'ArrowDown': {
         if (delegate.getKeyBelow) {
+          e.preventDefault();
           let nextKey = manager.focusedKey != null
-              ? delegate.getKeyBelow?.(manager.focusedKey)
+              ? delegate.getKeyBelow(manager.focusedKey)
               : delegate.getFirstKey?.();
           if (nextKey == null && shouldFocusWrap) {
             nextKey = delegate.getFirstKey?.(manager.focusedKey);
           }
-          if (nextKey != null) {
-            e.preventDefault();
-            navigateToKey(nextKey);
-          }
+          navigateToKey(nextKey);
         }
         break;
       }
       case 'ArrowUp': {
         if (delegate.getKeyAbove) {
+          e.preventDefault();
           let nextKey = manager.focusedKey != null
-              ? delegate.getKeyAbove?.(manager.focusedKey)
+              ? delegate.getKeyAbove(manager.focusedKey)
               : delegate.getLastKey?.();
           if (nextKey == null && shouldFocusWrap) {
             nextKey = delegate.getLastKey?.(manager.focusedKey);
           }
-          if (nextKey != null) {
-            e.preventDefault();
-            navigateToKey(nextKey);
-          }
+          navigateToKey(nextKey);
         }
         break;
       }
       case 'ArrowLeft': {
         if (delegate.getKeyLeftOf) {
-          let nextKey = delegate.getKeyLeftOf?.(manager.focusedKey);
+          e.preventDefault();
+          let nextKey = delegate.getKeyLeftOf(manager.focusedKey);
           if (nextKey == null && shouldFocusWrap) {
             nextKey = direction === 'rtl' ? delegate.getFirstKey?.(manager.focusedKey) : delegate.getLastKey?.(manager.focusedKey);
           }
-          if (nextKey != null) {
-            e.preventDefault();
-            navigateToKey(nextKey, direction === 'rtl' ? 'first' : 'last');
-          }
+          navigateToKey(nextKey, direction === 'rtl' ? 'first' : 'last');
         }
         break;
       }
       case 'ArrowRight': {
         if (delegate.getKeyRightOf) {
-          let nextKey = delegate.getKeyRightOf?.(manager.focusedKey);
+          e.preventDefault();
+          let nextKey = delegate.getKeyRightOf(manager.focusedKey);
           if (nextKey == null && shouldFocusWrap) {
             nextKey = direction === 'rtl' ? delegate.getLastKey?.(manager.focusedKey) : delegate.getFirstKey?.(manager.focusedKey);
           }
-          if (nextKey != null) {
-            e.preventDefault();
-            navigateToKey(nextKey, direction === 'rtl' ? 'last' : 'first');
-          }
+          navigateToKey(nextKey, direction === 'rtl' ? 'last' : 'first');
         }
         break;
       }
@@ -244,20 +236,16 @@ export function useSelectableCollection(options: AriaSelectableCollectionOptions
         break;
       case 'PageDown':
         if (delegate.getKeyPageBelow) {
+          e.preventDefault();
           let nextKey = delegate.getKeyPageBelow(manager.focusedKey);
-          if (nextKey != null) {
-            e.preventDefault();
-            navigateToKey(nextKey);
-          }
+          navigateToKey(nextKey);
         }
         break;
       case 'PageUp':
         if (delegate.getKeyPageAbove) {
+          e.preventDefault();
           let nextKey = delegate.getKeyPageAbove(manager.focusedKey);
-          if (nextKey != null) {
-            e.preventDefault();
-            navigateToKey(nextKey);
-          }
+          navigateToKey(nextKey);
         }
         break;
       case 'a':

packages/@react-aria/tabs/src/TabsKeyboardDelegate.ts

@@ -16,13 +16,11 @@ export class TabsKeyboardDelegate<T> implements KeyboardDelegate {
   private collection: Collection<Node<T>>;
   private flipDirection: boolean;
   private disabledKeys: Set<Key>;
-  private tabDirection: boolean;
 
   constructor(collection: Collection<Node<T>>, direction: Direction, orientation: Orientation, disabledKeys: Set<Key> = new Set()) {
     this.collection = collection;
     this.flipDirection = direction === 'rtl' && orientation === 'horizontal';
     this.disabledKeys = disabledKeys;
-    this.tabDirection = orientation === 'horizontal';
   }
 
   getKeyLeftOf(key: Key) {
@@ -39,6 +37,13 @@ export class TabsKeyboardDelegate<T> implements KeyboardDelegate {
     return this.getNextKey(key);
   }
 
+  getKeyAbove(key: Key) {
+    return this.getPreviousKey(key);
+  }
+
+  getKeyBelow(key: Key) {
+    return this.getNextKey(key);
+  }
 
   private isDisabled(key: Key) {
     return this.disabledKeys.has(key) || !!this.collection.getItem(key)?.props?.isDisabled;
@@ -59,20 +64,6 @@ export class TabsKeyboardDelegate<T> implements KeyboardDelegate {
     }
     return key;
   }
-  
-  getKeyAbove(key: Key) {
-    if (this.tabDirection) {
-      return null;
-    }
-    return this.getPreviousKey(key);
-  }
-
-  getKeyBelow(key: Key) {
-    if (this.tabDirection) {
-      return null;
-    }
-    return this.getNextKey(key);
-  }
 
   getNextKey(key) {
     do {

packages/@react-spectrum/s2/intl/ar-AE.json

@@ -14,5 +14,8 @@
   "picker.placeholder": "حدد خيارًا...",
   "slider.maximum": "أقصى",
   "slider.minimum": "أدنى",
-  "tag.noTags": "بدون"
+  "tag.actions": "الإجراءات",
+  "tag.hideButtonLabel": "إظهار أقل",
+  "tag.noTags": "بدون",
+  "tag.showAllButtonLabel": "عرض الكل ({tagCount, number})"
 }

packages/@react-spectrum/s2/intl/bg-BG.json

@@ -14,5 +14,8 @@
   "picker.placeholder": "Изберете опция",
   "slider.maximum": "Максимум",
   "slider.minimum": "Минимум",
-  "tag.noTags": "Нито един"
+  "tag.actions": "Действия",
+  "tag.hideButtonLabel": "Показване на по-малко",
+  "tag.noTags": "Нито един",
+  "tag.showAllButtonLabel": "Показване на всички ({tagCount, number})"
 }

packages/@react-spectrum/s2/intl/cs-CZ.json

@@ -14,5 +14,8 @@
   "picker.placeholder": "Vyberte vhodnou možnost...",
   "slider.maximum": "Maximum",
   "slider.minimum": "Minimum",
-  "tag.noTags": "Žádný"
+  "tag.actions": "Akce",
+  "tag.hideButtonLabel": "Zobrazit méně",
+  "tag.noTags": "Žádný",
+  "tag.showAllButtonLabel": "Zobrazit vše ({tagCount, number})"
 }

packages/@react-spectrum/s2/intl/da-DK.json

@@ -14,5 +14,8 @@
   "picker.placeholder": "Vælg en mulighed ...",
   "slider.maximum": "Maksimum",
   "slider.minimum": "Minimum",
-  "tag.noTags": "Ingen"
+  "tag.actions": "Handlinger",
+  "tag.hideButtonLabel": "Vis mindre",
+  "tag.noTags": "Ingen",
+  "tag.showAllButtonLabel": "Vis alle ({tagCount, number})"
 }

packages/@react-spectrum/s2/intl/de-DE.json

@@ -14,5 +14,8 @@
   "picker.placeholder": "Option auswählen...",
   "slider.maximum": "Maximum",
   "slider.minimum": "Minimum",
-  "tag.noTags": "Keine"
+  "tag.actions": "Aktionen",
+  "tag.hideButtonLabel": "Weniger zeigen",
+  "tag.noTags": "Keine",
+  "tag.showAllButtonLabel": "Alle anzeigen ({tagCount, number})"
 }

packages/@react-spectrum/s2/intl/el-GR.json

@@ -14,5 +14,8 @@
   "picker.placeholder": "Επιλέξτε…",
   "slider.maximum": "Μέγιστο",
   "slider.minimum": "Ελάχιστο",
-  "tag.noTags": "Κανένα"
+  "tag.actions": "Ενέργειες",
+  "tag.hideButtonLabel": "Εμφάνιση λιγότερων",
+  "tag.noTags": "Κανένα",
+  "tag.showAllButtonLabel": "Εμφάνιση όλων ({tagCount, number})"
 }

packages/@react-spectrum/s2/intl/en-US.json

@@ -14,5 +14,8 @@
   "picker.placeholder": "Select…",
   "slider.minimum": "Minimum",
   "slider.maximum": "Maximum",
+  "tag.showAllButtonLabel": "Show all ({tagCount, number})",
+  "tag.hideButtonLabel": "Show less",
+  "tag.actions": "Actions",
   "tag.noTags": "None"
 }

packages/@react-spectrum/s2/intl/es-ES.json

@@ -14,5 +14,8 @@
   "picker.placeholder": "Seleccione una opción…",
   "slider.maximum": "Máximo",
   "slider.minimum": "Mínimo",
-  "tag.noTags": "Ninguno"
+  "tag.actions": "Acciones",
+  "tag.hideButtonLabel": "Mostrar menos",
+  "tag.noTags": "Ninguno",
+  "tag.showAllButtonLabel": "Mostrar todo ({tagCount, number})"
 }