@decky/ui 4.7.0 → 4.7.2

package/dist/utils/index.js

@@ -13,13 +13,13 @@ export function findSP() {
     if (document.title == 'SP')
         return window;
     const navTrees = getGamepadNavigationTrees();
-    return navTrees?.find((x) => x.m_ID == 'root_1_').Root.Element.ownerDocument.defaultView;
+    return navTrees?.find((x) => x.m_ID == 'root_1_')?.Root?.Element?.ownerDocument?.defaultView;
 }
 export function getFocusNavController() {
     return window.GamepadNavTree?.m_context?.m_controller || window.FocusNavController;
 }
 export function getGamepadNavigationTrees() {
     const focusNav = getFocusNavController();
-    const context = focusNav.m_ActiveContext || focusNav.m_LastActiveContext;
+    const context = focusNav?.m_ActiveContext || focusNav?.m_LastActiveContext;
     return context?.m_rgGamepadNavigationTrees;
 }

package/dist/utils/react/fc.js

@@ -25,6 +25,7 @@ export function injectFCTrampoline(component, customHooks) {
             applyHookStubs(customHooks);
             window.SP_REACT.createElement = () => {
                 loggingEnabled && logger.debug("createElement hook called");
+                loggingEnabled && console.trace("createElement trace");
                 return Object.create(component.prototype);
             };
         }
@@ -37,26 +38,36 @@ export function injectFCTrampoline(component, customHooks) {
             window.SP_REACT.createElement = oldCreateElement;
         }
     };
+    let renderHookStep = 0;
     Object.defineProperty(component, "contextType", {
         configurable: true,
         get: function () {
-            loggingEnabled && logger.debug("get contexttype", this, stubsApplied);
-            applyStubsIfNeeded();
+            loggingEnabled && logger.debug("get contexttype", this, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("contextType trace");
+            if (renderHookStep == 0)
+                renderHookStep = 1;
+            else if (renderHookStep == 3)
+                renderHookStep = 4;
             return this._contextType;
         },
         set: function (value) {
             this._contextType = value;
         }
     });
-    Object.defineProperty(component, "getDerivedStateFromProps", {
+    Object.defineProperty(component, "contextTypes", {
         configurable: true,
         get: function () {
-            loggingEnabled && logger.debug("get getDerivedStateFromProps", this, stubsApplied);
-            removeStubsIfNeeded();
-            return this._getDerivedStateFromProps;
+            loggingEnabled && logger.debug("get contexttypes", this, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("contextTypes trace");
+            if (renderHookStep == 1) {
+                renderHookStep = 2;
+                applyStubsIfNeeded();
+            }
+            ;
+            return this._contextTypes;
         },
         set: function (value) {
-            this._getDerivedStateFromProps = value;
+            this._contextTypes = value;
         }
     });
     Object.defineProperty(component.prototype, "updater", {
@@ -65,10 +76,29 @@ export function injectFCTrampoline(component, customHooks) {
             return this._updater;
         },
         set: function (value) {
-            loggingEnabled && logger.debug("set updater", this, value, stubsApplied);
-            removeStubsIfNeeded();
+            loggingEnabled && logger.debug("set updater", this, value, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("updater trace");
+            if (renderHookStep == 2) {
+                renderHookStep = 0;
+                removeStubsIfNeeded();
+            }
             return this._updater = value;
         }
     });
+    Object.defineProperty(component, "getDerivedStateFromProps", {
+        configurable: true,
+        get: function () {
+            loggingEnabled && logger.debug("get getDerivedStateFromProps", this, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("getDerivedStateFromProps trace");
+            if (renderHookStep == 2) {
+                renderHookStep = 0;
+                removeStubsIfNeeded();
+            }
+            return this._getDerivedStateFromProps;
+        },
+        set: function (value) {
+            this._getDerivedStateFromProps = value;
+        }
+    });
     return userComponent;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decky/ui",
-  "version": "4.7.0",
+  "version": "4.7.2",
   "description": "A library for interacting with the Steam frontend in Decky plugins and elsewhere.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/modules/Router.ts

@@ -126,6 +126,7 @@ export interface Navigation {
   OpenQuickAccessMenu(quickAccessTab?: QuickAccessTab): void;
   OpenMainMenu(): void;
   OpenPowerMenu(unknown?: any): void;
+  /** if calling this to perform navigation, call it after Navigate to prevent a race condition in desktop Big Picture mode that hides the overlay unintentionally */
   CloseSideMenus(): void;
 }
 

package/src/utils/index.ts

@@ -25,7 +25,7 @@ export function findSP(): Window {
   if (document.title == 'SP') return window;
   // new (SP as popup)
   const navTrees = getGamepadNavigationTrees();
-  return navTrees?.find((x: any) => x.m_ID == 'root_1_').Root.Element.ownerDocument.defaultView;
+  return navTrees?.find((x: any) => x.m_ID == 'root_1_')?.Root?.Element?.ownerDocument?.defaultView;
 }
 
 /**
@@ -40,6 +40,6 @@ export function getFocusNavController(): any {
  */
 export function getGamepadNavigationTrees(): any {
   const focusNav = getFocusNavController();
-  const context = focusNav.m_ActiveContext || focusNav.m_LastActiveContext;
+  const context = focusNav?.m_ActiveContext || focusNav?.m_LastActiveContext;
   return context?.m_rgGamepadNavigationTrees;
 }

package/src/utils/react/fc.ts

@@ -52,6 +52,7 @@ export function injectFCTrampoline(component: FC, customHooks?: any): FCTrampoli
             // we have to redirect this to return an object with component's prototype as a constructor returning a value overrides its prototype
             window.SP_REACT.createElement = () => {
                 loggingEnabled && logger.debug("createElement hook called");
+                loggingEnabled && console.trace("createElement trace");
                 return Object.create(component.prototype);
             };
         }
@@ -66,12 +67,16 @@ export function injectFCTrampoline(component: FC, customHooks?: any): FCTrampoli
         }
     }
 
+    let renderHookStep = 0;
+
     // Accessed two times, once directly before class instantiation, and again in some extra logic we don't need to worry about that we hanlde below just in case.
     Object.defineProperty(component, "contextType", {
         configurable: true,
         get: function () {
-            loggingEnabled && logger.debug("get contexttype", this, stubsApplied);
-            applyStubsIfNeeded();
+            loggingEnabled && logger.debug("get contexttype", this, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("contextType trace");
+            if (renderHookStep == 0) renderHookStep = 1;
+            else if (renderHookStep == 3) renderHookStep = 4;
             return this._contextType;
         },
         set: function (value) {
@@ -79,16 +84,20 @@ export function injectFCTrampoline(component: FC, customHooks?: any): FCTrampoli
         }
     });
 
-    // Undoes the second contextType access we can't detect shortly before render before it's able to cause any damage
-    Object.defineProperty(component, "getDerivedStateFromProps", {
+    // Always accessed directly after contextType for the path we want to catch.
+    Object.defineProperty(component, "contextTypes", {
         configurable: true,
         get: function () {
-            loggingEnabled && logger.debug("get getDerivedStateFromProps", this, stubsApplied);
-            removeStubsIfNeeded();
-            return this._getDerivedStateFromProps;
+            loggingEnabled && logger.debug("get contexttypes", this, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("contextTypes trace");
+            if (renderHookStep == 1) {
+                renderHookStep = 2;
+                applyStubsIfNeeded();
+            };
+            return this._contextTypes;
         },
         set: function (value) {
-            this._getDerivedStateFromProps = value;
+            this._contextTypes = value;
         }
     });
 
@@ -99,11 +108,32 @@ export function injectFCTrampoline(component: FC, customHooks?: any): FCTrampoli
             return this._updater;
         },
         set: function (value) {
-            loggingEnabled && logger.debug("set updater", this, value, stubsApplied);
-            removeStubsIfNeeded();
+            loggingEnabled && logger.debug("set updater", this, value, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("updater trace");
+            if (renderHookStep == 2) {
+                renderHookStep = 0;
+                removeStubsIfNeeded();
+            }
             return this._updater = value;
         }
     });
 
+    // Prevents the second contextType+contextTypes access from leaving its hooks around
+    Object.defineProperty(component, "getDerivedStateFromProps", {
+        configurable: true,
+        get: function () {
+            loggingEnabled && logger.debug("get getDerivedStateFromProps", this, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("getDerivedStateFromProps trace");
+            if (renderHookStep == 2) {
+                renderHookStep = 0;
+                removeStubsIfNeeded();
+            }
+            return this._getDerivedStateFromProps;
+        },
+        set: function (value) {
+            this._getDerivedStateFromProps = value;
+        }
+    });
+
     return userComponent;
 }

package/src/utils/react/react.ts

@@ -104,19 +104,15 @@ export function wrapReactClass(node: any, prop: any = 'type') {
 
 export function getReactRoot(o: HTMLElement | Element | Node) {
   return (
-    // @ts-expect-error 7053
-    o[Object.keys(o).find((k) => k.startsWith('__reactContainer$')) as string] ||
-    // @ts-expect-error 7053
-    o['_reactRootContainer']?._internalRoot?.current
+    (o as any)[Object.keys(o).find((k) => k.startsWith('__reactContainer$')) as string] ||
+    (o as any)['_reactRootContainer']?._internalRoot?.current
   );
 }
 
 export function getReactInstance(o: HTMLElement | Element | Node) {
   return (
-    // @ts-expect-error 7053
-    o[Object.keys(o).find((k) => k.startsWith('__reactFiber')) as string] ||
-    // @ts-expect-error 7053
-    o[Object.keys(o).find((k) => k.startsWith('__reactInternalInstance')) as string]
+    (o as any)[Object.keys(o).find((k) => k.startsWith('__reactFiber')) as string] ||
+    (o as any)[Object.keys(o).find((k) => k.startsWith('__reactInternalInstance')) as string]
   );
 }