chore(release): 4.7.4 [CI SKIP]

.github/workflows/release.yaml

@@ -4,7 +4,7 @@ on:
   pull_request:
   push:
     branches:
-      - v4-dev
+      - main
 
 jobs:
   release:

CHANGELOG.md

@@ -1,3 +1,53 @@
+## [4.7.4](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v4.7.3...v4.7.4) (2024-10-04)
+
+
+### Bug Fixes
+
+* **DialogCheckbox:** don't access getters to prevent their side effects from breaking the component ([241b22c](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/241b22cad711621a1695dfd11da857f13c3fffdf))
+
+## [4.7.3](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v4.7.2...v4.7.3) (2024-10-03)
+
+
+### Bug Fixes
+
+* **components:** fix missing components on oct 2 2024 beta ([0f9fb5a](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/0f9fb5a3b8ef4f9978025a28323ab080fb0e7a4c))
+
+## [4.7.2](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v4.7.1...v4.7.2) (2024-09-16)
+
+
+### Bug Fixes
+
+* **utils:** fix potential race condition in findSP ([3aa07dc](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/3aa07dc9ce798ff8d1148424ee9e8a8bf2ba78c6))
+
+## [4.7.1](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v4.7.0...v4.7.1) (2024-08-08)
+
+
+### Bug Fixes
+
+* **utils/react:** fix potential race condition in injectFCTrampoline ([4c97097](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/4c97097757919580a380b70785e6c161de6b03cc))
+
+# [4.7.0](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v4.6.0...v4.7.0) (2024-07-28)
+
+
+### Features
+
+* **router:** support desktop bpm overlay ([7eb484d](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/7eb484d55c6be6e7844878eb47eda55591a6cf51))
+
+# [4.6.0](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v4.5.0...v4.6.0) (2024-07-26)
+
+
+### Features
+
+* **classMapper:** add findClassByName back ([2b8d2ae](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/2b8d2ae4dbd9a0c4a59a43be0101a0a8fe1c518f))
+
+# [4.5.0](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v4.4.0...v4.5.0) (2024-07-24)
+
+
+### Features
+
+* **classMapper:** add classModuleMap, make findClass require ID ([a370c1f](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/a370c1f7d3dca0db56a346c98c28ed9681a415e0))
+* **webpack:** refactor to prepare for classMapper changes ([d83bada](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/d83bada4af2d16c750955de9a52f94a0080a2c14))
+
 # [4.4.0](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v4.3.1...v4.4.0) (2024-07-18)
 
 

package.json

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

src/class-mapper.ts

@@ -1,10 +1,10 @@
-import { Module, findAllModules } from './webpack';
+import { Module, ModuleID, createModuleMapping } from './webpack';
 
 export interface ClassModule {
   [name: string]: string;
 }
 
-export const classMap: ClassModule[] = findAllModules((m: Module) => {
+export const classModuleMap: Map<ModuleID, ClassModule> = createModuleMapping((m: Module) => {
   if (typeof m == 'object' && !m.__esModule) {
     const keys = Object.keys(m);
     // special case some libraries
@@ -17,8 +17,14 @@ export const classMap: ClassModule[] = findAllModules((m: Module) => {
   return false;
 });
 
-export function findClass(name: string): string | void {
+export const classMap = [...classModuleMap.values()];
-  return classMap.find((m) => m?.[name])?.[name];
+
+export function findClass(id: string, name: string): string | void {
+  return classModuleMap.get(id)?.[name];
+}
+
+export function findClassByName(name: string): string | void {
+  return classMap.find((m) => m[name])?.[name];
 }
 
 export function findClassModule(filter: (module: any) => boolean): ClassModule | void {
@@ -26,7 +32,7 @@ export function findClassModule(filter: (module: any) => boolean): ClassModule |
 }
 
 export function unminifyClass(minifiedClass: string): string | void {
-  for (let m of classMap) {
+  for (let m of classModuleMap.values()) {
     for (let className of Object.keys(m)) {
       if (m[className] == minifiedClass) return className;
     }

src/components/DialogCheckbox.ts

@@ -1,6 +1,6 @@
 import { FC, ReactNode } from 'react';
 
-import { findModule } from '../webpack';
+import { findModuleExport } from '../webpack';
 import { DialogCommonProps } from './Dialog';
 import { FooterLegendProps } from './FooterLegend';
 
@@ -18,19 +18,15 @@ export interface DialogCheckboxProps extends DialogCommonProps, FooterLegendProp
   onClick?(evt: Event): void;
 }
 
-export const DialogCheckbox = Object.values(
+// Do not access KeyDown, SetChecked, Toggle here as they are getters and accessing them outside of a render breaks them globally
-  findModule((m: any) => {
+export const DialogCheckbox = findModuleExport(e =>
-    if (typeof m !== 'object') return false;
+  e.prototype &&
-    for (const prop in m) {
+  "GetPanelElementProps" in e?.prototype &&
-      if (m[prop]?.prototype?.GetPanelElementProps) return true;
+  "SetChecked" in e?.prototype &&
-    }
+  "Toggle" in e?.prototype &&
-    return false;
+  // beta || stable as of oct 2 2024
-  }),
+  (e?.prototype?.render?.toString().includes('="DialogCheckbox"') || (
-).find(
+    e.contextType &&
-  (m: any) =>
+    e.prototype?.render?.toString().includes('fallback:')
-    m.contextType &&
+  ))
-    m.prototype?.render.toString().includes('fallback:') &&
-    m?.prototype?.SetChecked &&
-    m?.prototype?.Toggle &&
-    m?.prototype?.GetPanelElementProps,
 ) as FC<DialogCheckboxProps>;

src/components/Modal.ts

@@ -1,7 +1,7 @@
 import { FC, ReactNode } from 'react';
 
 import { findSP } from '../utils';
-import { Export, findModule, findModuleByExport, findModuleExport } from '../webpack';
+import { Export, findModule, findModuleDetailsByExport, findModuleExport } from '../webpack';
 
 // All of the popout options + strTitle are related. Proper usage is not yet known...
 export interface ShowModalProps {
@@ -105,7 +105,7 @@ interface SimpleModalProps {
   children: ReactNode;
 }
 
-const ModalModule = findModuleByExport((e: Export) => e?.toString().includes('.ModalPosition,fallback:'), 5);
+const [ModalModule, _ModalPosition] = findModuleDetailsByExport((e: Export) => e?.toString().includes('.ModalPosition'), 5)
 
 const ModalModuleProps = ModalModule ? Object.values(ModalModule) : [];
 
@@ -114,6 +114,4 @@ export const SimpleModal = ModalModuleProps.find((prop) => {
   return string?.includes('.ShowPortalModal()') && string?.includes('.OnElementReadyCallbacks.Register(');
 }) as FC<SimpleModalProps>;
 
-export const ModalPosition = ModalModuleProps.find((prop) =>
+export const ModalPosition = _ModalPosition as FC<SimpleModalProps>;
-  prop?.toString().includes('.ModalPosition,fallback:'),
-) as FC<SimpleModalProps>;

src/components/SliderField.ts

@@ -29,5 +29,6 @@ export interface SliderFieldProps extends ItemProps {
 }
 
 export const SliderField = Object.values(CommonUIModule).find((mod: any) =>
-  mod?.toString()?.includes('SliderField,fallback'),
+  // stable || beta as of oct 2 2024
+  mod?.toString()?.includes('SliderField,fallback') || mod?.toString()?.includes("SliderField\",")
 ) as FC<SliderFieldProps>;

src/components/Tabs.tsx

@@ -1,9 +1,6 @@
-import { FC, ReactNode, createElement, useEffect, useState } from 'react';
+import { FC, ReactNode } from 'react';
-
+import { findModuleByExport } from '../webpack';
-import { fakeRenderComponent, findInReactTree, sleep } from '../utils';
-import { Export, findModuleByExport } from '../webpack';
 import { FooterLegendProps } from './FooterLegend';
-import { SteamSpinner } from './SteamSpinner';
 
 /**
  * Individual tab objects for the Tabs component
@@ -65,63 +62,9 @@ export interface TabsProps {
   autoFocusContents?: boolean;
 }
 
-let tabsComponent: any;
+const tabsModule = findModuleByExport(e => e?.toString()?.includes(".TabRowTabs") && e?.toString()?.includes("activeTab:"));
-
-const getTabs = async () => {
-  if (tabsComponent) return tabsComponent;
-  // @ts-ignore
-  while (!window?.DeckyPluginLoader?.routerHook?.routes) {
-    console.debug('[DFL:Tabs]: Waiting for Decky router...');
-    await sleep(500);
-  }
-  return (tabsComponent = fakeRenderComponent(
-    () => {
-      return findInReactTree(
-        findInReactTree(
-          // @ts-ignore
-          window.DeckyPluginLoader.routerHook.routes
-            .find((x: any) => x.props.path == '/library/app/:appid/achievements')
-            .props.children.type(),
-          (x) => x?.props?.scrollTabsTop,
-        ).type({ appid: 1 }),
-        (x) => x?.props?.tabs,
-      ).type;
-    },
-    {
-      useRef: () => ({ current: { reaction: { track: () => {} } } }),
-      useContext: () => ({ match: { params: { appid: 1 } } }),
-      useMemo: () => ({ data: {} }),
-    },
-  ));
-};
-
-let oldTabs: any;
-
-try {
-  const oldTabsModule = findModuleByExport((e: Export) => e.Unbleed);
-  if (oldTabsModule)
-    oldTabs = Object.values(oldTabsModule).find((x: any) => x?.type?.toString()?.includes('((function(){'));
-} catch (e) {
-  console.error('Error finding oldTabs:', e);
-}
 
 /**
  * Tabs component as used in the library and media tabs. See {@link TabsProps}.
- * Unlike other components in `decky-frontend-lib`, this requires Decky Loader to be running.
  */
-export const Tabs = (oldTabs ||
+export const Tabs = tabsModule && Object.values(tabsModule).find((e: any) => e?.type?.toString()?.includes("((function()")) as FC<TabsProps>;
-  ((props: TabsProps) => {
-    const found = tabsComponent;
-    const [tc, setTC] = useState<FC<TabsProps>>(found);
-    useEffect(() => {
-      if (found) return;
-      (async () => {
-        console.debug('[DFL:Tabs]: Finding component...');
-        const t = await getTabs();
-        console.debug('[DFL:Tabs]: Found!');
-        setTC(t);
-      })();
-    }, []);
-    console.log('tc', tc);
-    return tc ? createElement(tc, props) : <SteamSpinner />;
-  })) as FC<TabsProps>;

src/components/ToggleField.ts

@@ -11,5 +11,6 @@ export interface ToggleFieldProps extends ItemProps {
 }
 
 export const ToggleField = Object.values(CommonUIModule).find((mod: any) =>
-  mod?.render?.toString()?.includes('ToggleField,fallback'),
+  // stable || beta as of oct 2 2024
+  mod?.render?.toString()?.includes('ToggleField,fallback') || mod?.render?.toString()?.includes("ToggleField\",")
 ) as FC<ToggleFieldProps>;

src/custom-hooks/useQuickAccessVisible.ts

@@ -11,12 +11,14 @@ function getQuickAccessWindow(): Window | null {
 
 /**
  * Returns state indicating the visibility of quick access menu.
+ * 
+ * @deprecated moved to @decky/api
  *
  * @returns `true` if quick access menu is visible and `false` otherwise.
  *
  * @example
  * import { FC, useEffect } from "react";
- * import { useQuickAccessVisible } from "decky-frontend-lib";
+ * import { useQuickAccessVisible } from "@decky/ui";
  *
  * export const PluginPanelView: FC<{}> = ({ }) => {
  *   const isVisible = useQuickAccessVisible();

src/globals/stores.ts

@@ -1,3 +1,4 @@
+import { WindowRouter } from '../modules/Router';
 import { AppDetails, LogoPosition, SteamAppOverview } from './SteamClient';
 declare global {
   interface Window {
@@ -46,5 +47,11 @@ declare global {
       GetCustomLogoPosition: (app: SteamAppOverview) => LogoPosition | null;
       SaveCustomLogoPosition: (app: SteamAppOverview, logoPositions: LogoPosition) => any;
     };
+    SteamUIStore: {
+      GetFocusedWindowInstance: () => WindowRouter;
+    };
+    securitystore: {
+      IsLockScreenActive: () => boolean;
+    };
   }
 }

src/modules/Router.ts

@@ -1,4 +1,4 @@
-import { sleep } from '../utils';
+import Logger from '../logger';
 import { Export, findModuleExport } from '../webpack';
 
 export enum SideMenu {
@@ -88,14 +88,23 @@ export interface WindowStore {
 
 export interface Router {
   WindowStore?: WindowStore;
+  /** @deprecated use {@link Navigation} instead */
   CloseSideMenus(): void;
+  /** @deprecated use {@link Navigation} instead */
   Navigate(path: string): void;
+  /** @deprecated use {@link Navigation} instead */
   NavigateToAppProperties(): void;
+  /** @deprecated use {@link Navigation} instead */
   NavigateToExternalWeb(url: string): void;
+  /** @deprecated use {@link Navigation} instead */
   NavigateToInvites(): void;
+  /** @deprecated use {@link Navigation} instead */
   NavigateToChat(): void;
+  /** @deprecated use {@link Navigation} instead */
   NavigateToLibraryTab(): void;
+  /** @deprecated use {@link Navigation} instead */
   NavigateToLayoutPreview(e: unknown): void;
+  /** @deprecated use {@link Navigation} instead */
   OpenPowerMenu(unknown?: any): void;
   get RunningApps(): AppOverview[];
   get MainRunningApp(): AppOverview | undefined;
@@ -117,58 +126,58 @@ 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;
 }
 
 export let Navigation = {} as Navigation;
 
+const logger = new Logger("Navigation");
+
 try {
-  (async () => {
+  function createNavigationFunction(fncName: string, handler?: (win: any) => any) {
-    let InternalNavigators: any = {};
+    return (...args: any) => {
-    if (!Router.NavigateToAppProperties || (Router as unknown as any).deckyShim) {
+      let win: WindowRouter | undefined;
-      function initInternalNavigators() {
+      try {
-        try {
+        win = window.SteamUIStore.GetFocusedWindowInstance();
-          InternalNavigators = findModuleExport((e: Export) => e.GetNavigator && e.SetNavigator)?.GetNavigator();
+      } catch (e) {
-        } catch (e) {
+        logger.warn("Navigation interface failed to call GetFocusedWindowInstance", e);
-          console.error('[DFL:Router]: Failed to init internal navigators, trying again');
-        }
       }
-      initInternalNavigators();
+      if (!win) {
-      while (!InternalNavigators?.AppProperties) {
+        logger.warn("Navigation interface could not find any focused window. Falling back to GamepadUIMainWindowInstance");
-        console.log('[DFL:Router]: Trying to init internal navigators again');
+        win = Router.WindowStore?.GamepadUIMainWindowInstance;
-        await sleep(2000);
+      }
-        initInternalNavigators();
+
+      if (win) {
+        try {
+          const thisObj = handler && handler(win);
+          (thisObj || win)[fncName](...args);
+        } catch (e) {
+          logger.error("Navigation handler failed", e);
+        }
+      } else {
+        logger.error("Navigation interface could not find a window to navigate");
       }
     }
-    const newNavigation = {
+  }
-      Navigate: Router.Navigate?.bind(Router),
+  const newNavigation = {
-      NavigateBack: Router.WindowStore?.GamepadUIMainWindowInstance?.NavigateBack?.bind(
+    Navigate: createNavigationFunction("Navigate"),
-        Router.WindowStore.GamepadUIMainWindowInstance,
+    NavigateBack: createNavigationFunction("NavigateBack"),
-      ),
+    NavigateToAppProperties: createNavigationFunction("AppProperties", win => win.Navigator),
-      NavigateToAppProperties: InternalNavigators?.AppProperties || Router.NavigateToAppProperties?.bind(Router),
+    NavigateToExternalWeb: createNavigationFunction("ExternalWeb", win => win.Navigator),
-      NavigateToExternalWeb: InternalNavigators?.ExternalWeb || Router.NavigateToExternalWeb?.bind(Router),
+    NavigateToInvites: createNavigationFunction("Invites", win => win.Navigator),
-      NavigateToInvites: InternalNavigators?.Invites || Router.NavigateToInvites?.bind(Router),
+    NavigateToChat: createNavigationFunction("Chat", win => win.Navigator),
-      NavigateToChat: InternalNavigators?.Chat || Router.NavigateToChat?.bind(Router),
+    NavigateToLibraryTab: createNavigationFunction("LibraryTab", win => win.Navigator),
-      NavigateToLibraryTab: InternalNavigators?.LibraryTab || Router.NavigateToLibraryTab?.bind(Router),
+    NavigateToLayoutPreview: Router.NavigateToLayoutPreview?.bind(Router),
-      NavigateToLayoutPreview: Router.NavigateToLayoutPreview?.bind(Router),
+    NavigateToSteamWeb: createNavigationFunction("NavigateToSteamWeb"),
-      NavigateToSteamWeb: Router.WindowStore?.GamepadUIMainWindowInstance?.NavigateToSteamWeb?.bind(
+    OpenSideMenu: createNavigationFunction("OpenSideMenu", win => win.MenuStore),
-        Router.WindowStore.GamepadUIMainWindowInstance,
+    OpenQuickAccessMenu: createNavigationFunction("OpenQuickAccessMenu", win => win.MenuStore),
-      ),
+    OpenMainMenu: createNavigationFunction("OpenMainMenu", win => win.MenuStore),
-      OpenSideMenu: Router.WindowStore?.GamepadUIMainWindowInstance?.MenuStore.OpenSideMenu?.bind(
+    CloseSideMenus: createNavigationFunction("CloseSideMenus", win => win.MenuStore),
-        Router.WindowStore.GamepadUIMainWindowInstance.MenuStore,
+    OpenPowerMenu: Router.OpenPowerMenu?.bind(Router),
-      ),
+  } as Navigation;
-      OpenQuickAccessMenu: Router.WindowStore?.GamepadUIMainWindowInstance?.MenuStore.OpenQuickAccessMenu?.bind(
-        Router.WindowStore.GamepadUIMainWindowInstance.MenuStore,
-      ),
-      OpenMainMenu: Router.WindowStore?.GamepadUIMainWindowInstance?.MenuStore.OpenMainMenu?.bind(
-        Router.WindowStore.GamepadUIMainWindowInstance.MenuStore,
-      ),
-      CloseSideMenus: Router.CloseSideMenus?.bind(Router),
-      OpenPowerMenu: Router.OpenPowerMenu?.bind(Router),
-    } as Navigation;
 
-    Object.assign(Navigation, newNavigation);
+  Object.assign(Navigation, newNavigation);
-  })();
 } catch (e) {
-  console.error('[DFL:Router]: Error initializing Navigation interface', e);
+  logger.error('Error initializing Navigation interface', e);
 }

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;
 }

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);
+            loggingEnabled && logger.debug("get contexttype", this, stubsApplied, renderHookStep);
-            applyStubsIfNeeded();
+            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
+    // Always accessed directly after contextType for the path we want to catch.
-    Object.defineProperty(component, "getDerivedStateFromProps", {
+    Object.defineProperty(component, "contextTypes", {
         configurable: true,
         get: function () {
-            loggingEnabled && logger.debug("get getDerivedStateFromProps", this, stubsApplied);
+            loggingEnabled && logger.debug("get contexttypes", this, stubsApplied, renderHookStep);
-            removeStubsIfNeeded();
+            loggingEnabled && console.trace("contextTypes trace");
-            return this._getDerivedStateFromProps;
+            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);
+            loggingEnabled && logger.debug("set updater", this, value, stubsApplied, renderHookStep);
-            removeStubsIfNeeded();
+            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;
 }

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 as any)[Object.keys(o).find((k) => k.startsWith('__reactContainer$')) as string] ||
-    o[Object.keys(o).find((k) => k.startsWith('__reactContainer$')) as string] ||
+    (o as any)['_reactRootContainer']?._internalRoot?.current
-    // @ts-expect-error 7053
-    o['_reactRootContainer']?._internalRoot?.current
   );
 }
 
 export function getReactInstance(o: HTMLElement | Element | Node) {
   return (
-    // @ts-expect-error 7053
+    (o as any)[Object.keys(o).find((k) => k.startsWith('__reactFiber')) as string] ||
-    o[Object.keys(o).find((k) => k.startsWith('__reactFiber')) as string] ||
+    (o as any)[Object.keys(o).find((k) => k.startsWith('__reactInternalInstance')) as string]
-    // @ts-expect-error 7053
-    o[Object.keys(o).find((k) => k.startsWith('__reactInternalInstance')) as string]
   );
 }
 

src/webpack.ts

@@ -9,20 +9,21 @@ declare global {
 const logger = new Logger('Webpack');
 
 // In most case an object with getters for each property. Look for the first call to r.d in the module, usually near or at the top.
+export type ModuleID = string; // number string
 export type Module = any;
 export type Export = any;
 type FilterFn = (module: any) => boolean;
 type ExportFilterFn = (moduleExport: any, exportName?: any) => boolean;
 type FindFn = (module: any) => any;
 
-export let modules: any = [];
+export let modules = new Map<ModuleID, Module>();
 
 function initModuleCache() {
   const startTime = performance.now();
   logger.group('Webpack Module Init');
   // Webpack 5, currently on beta
   // Generate a fake module ID
-  const id = Math.random(); // really should be an int and not a float but who cares
+  const id = Symbol("@decky/ui");
   let webpackRequire!: ((id: any) => Module) & { m: object };
   // Insert our module in a new chunk.
   // The module will then be called with webpack's internal require function as its first argument
@@ -39,14 +40,14 @@ function initModuleCache() {
   );
 
   // Loop over every module ID
-  for (let i of Object.keys(webpackRequire.m)) {
+  for (let id of Object.keys(webpackRequire.m)) {
     try {
-      const module = webpackRequire(i);
+      const module = webpackRequire(id);
       if (module) {
-        modules.push(module);
+        modules.set(id, module);
       }
     } catch (e) {
-      logger.debug('Ignoring require error for module', i, e);
+      logger.debug('Ignoring require error for module', id, e);
     }
   }
 
@@ -56,7 +57,7 @@ function initModuleCache() {
 initModuleCache();
 
 export const findModule = (filter: FilterFn) => {
-  for (const m of modules) {
+  for (const m of modules.values()) {
     if (m.default && filter(m.default)) return m.default;
     if (filter(m)) return m;
   }
@@ -65,8 +66,8 @@ export const findModule = (filter: FilterFn) => {
 export const findModuleDetailsByExport = (
   filter: ExportFilterFn,
   minExports?: number,
-): [module: Module | undefined, moduleExport: any, exportName: any] => {
+): [module: Module | undefined, moduleExport: any, exportName: any, moduleID: string | undefined] => {
-  for (const m of modules) {
+  for (const [id, m] of modules) {
     if (!m) continue;
     for (const mod of [m.default, m]) {
       if (typeof mod !== 'object') continue;
@@ -75,7 +76,7 @@ export const findModuleDetailsByExport = (
         if (mod?.[exportName]) {
           const filterRes = filter(mod[exportName], exportName);
           if (filterRes) {
-            return [mod, mod[exportName], exportName];
+            return [mod, mod[exportName], exportName, id];
           } else {
             continue;
           }
@@ -83,7 +84,7 @@ export const findModuleDetailsByExport = (
       }
     }
   }
-  return [undefined, undefined, undefined];
+  return [undefined, undefined, undefined, undefined];
 };
 
 export const findModuleByExport = (filter: ExportFilterFn, minExports?: number) => {
@@ -98,7 +99,7 @@ export const findModuleExport = (filter: ExportFilterFn, minExports?: number) =>
  * @deprecated use findModuleExport instead
  */
 export const findModuleChild = (filter: FindFn) => {
-  for (const m of modules) {
+  for (const m of modules.values()) {
     for (const mod of [m.default, m]) {
       const filterRes = filter(mod);
       if (filterRes) {
@@ -110,10 +111,13 @@ export const findModuleChild = (filter: FindFn) => {
   }
 };
 
+/**
+ * @deprecated use createModuleMapping instead
+ */
 export const findAllModules = (filter: FilterFn) => {
   const out = [];
 
-  for (const m of modules) {
+  for (const m of modules.values()) {
     if (m.default && filter(m.default)) out.push(m.default);
     if (filter(m)) out.push(m);
   }
@@ -121,7 +125,18 @@ export const findAllModules = (filter: FilterFn) => {
   return out;
 };
 
-export const CommonUIModule = modules.find((m: Module) => {
+export const createModuleMapping = (filter: FilterFn) => {
+  const mapping = new Map<ModuleID, Module>();
+
+  for (const [id, m] of modules) {
+    if (m.default && filter(m.default)) mapping.set(id, m.default);
+    if (filter(m)) mapping.set(id, m);
+  }
+
+  return mapping;
+};
+
+export const CommonUIModule = findModule((m: Module) => {
   if (typeof m !== 'object') return false;
   for (let prop in m) {
     if (m[prop]?.contextType?._currentValue && Object.keys(m).length > 60) return true;