From 8117693427e4dba2f3b5bd24f36704d8d5e65ae2 Mon Sep 17 00:00:00 2001
From: Lukas Senionis <warliukz@gmail.com>
Date: Wed, 20 Nov 2024 21:50:10 +0200
Subject: [PATCH] fix(Footer): add missing focus/nav properties (#113)

---
 src/components/FooterLegend.ts | 52 +++++++++++++++++++++++++++++++++-
 1 file changed, 51 insertions(+), 1 deletion(-)

diff --git a/src/components/FooterLegend.ts b/src/components/FooterLegend.ts
index 762e7813..4b679225 100644
--- a/src/components/FooterLegend.ts
+++ b/src/components/FooterLegend.ts
@@ -31,11 +31,42 @@ export enum GamepadButton {
   STEAM_GUIDE,
   STEAM_QUICK_MENU,
 }
-export declare enum NavEntryPositionPreferences {
+export enum NavEntryPositionPreferences {
+  /**
+   * Always give focus to the first child element.
+   */
   FIRST,
+
+  /**
+   * Always give focus to the last child element.
+   */
   LAST,
+
+  /**
+   * Give focus to the child element that would maintain the flow in the X axis.
+   * 
+   * Imagine you have a calculator window with 9 standard buttons.
+   * You have 3 rows of buttons, with 3 buttons per row.
+   * If you select button with number 8 and navigate down, the buttons
+   * will be navigated in the following order 8->5->3.
+   * The flow is maintained for the X axis while you're navigating the Y axis.
+   */
   MAINTAIN_X,
+
+  /**
+   * Give focus to the child element that would maintain the flow in the Y axis.
+   * 
+   * Imagine you have a calculator window with 9 standard buttons.
+   * You have 3 columns of buttons, with 3 buttons per column.
+   * If you select button with number 4 and navigate right, the buttons
+   * will be navigated in the following order 4->5->6.
+   * The flow is maintained for the Y axis while you're navigating the X axis.
+   */
   MAINTAIN_Y,
+
+  /**
+   * Give focus to the first child element with `preferredFocus == true` prop.
+   */
   PREFERRED_CHILD,
 }
 export interface GamepadEventDetail {
@@ -48,6 +79,25 @@ export declare type ActionDescriptionMap = {
 };
 export declare type GamepadEvent = CustomEvent<GamepadEventDetail>;
 export interface FooterLegendProps {
+  /**
+   * Navigation entry strategy to be used when gaining focus during navigation.
+   * 
+   * This is meant to be used on a parent container that has children. Once the
+   * container (e.g. Focusable) is navigated to and has children in it, the children
+   * is then navigated to (focused) using the provided strategy.
+   * 
+   * If no strategy is provided, it seems that the `NavEntryPositionPreferences.FIRST`
+   * is used initialy, but for the next time the parent remembers previously focused
+   * child and focused back on it instead.
+   */
+  navEntryPreferPosition?: NavEntryPositionPreferences;
+
+  /**
+   * Mark the element as the preferred child (to be focused) whenever the parent uses the
+   * `NavEntryPositionPreferences.PREFERRED_CHILD` navigation strategy.
+   */
+  preferredFocus?: boolean;
+
   actionDescriptionMap?: ActionDescriptionMap;
   onOKActionDescription?: ReactNode;
   onCancelActionDescription?: ReactNode;