chore(release): 3.18.1 [CI SKIP]

* feat(DialogCheckbox): Add DialogCheckbox component

* fix(DialogCheckbox): Better sibling match

* fix(DialogCheckbox): Extend FocusableProps

* fix(DialogCheckbox): Extend FooterLegendProps

i should have probably tested that

* feat(DialogCheckbox): add onClick() prop

* fix(DialogCheckbox): replace default export with named export

CHANGELOG.md

@@ -1,3 +1,31 @@
+## [3.18.1](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v3.18.0...v3.18.1) (2022-12-11)
+
+
+### Bug Fixes
+
+* **findSP:** fallback to last active context ([#53](https://github.com/SteamDeckHomebrew/decky-frontend-lib/issues/53)) ([6f14da1](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/6f14da152acc4757b814844f1b77bf83dd98d77e))
+
+# [3.18.0](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v3.17.0...v3.18.0) (2022-12-11)
+
+
+### Features
+
+* **DialogCheckbox:** Add DialogCheckbox component ([#58](https://github.com/SteamDeckHomebrew/decky-frontend-lib/issues/58)) ([88f245d](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/88f245d476a6477e9fc0cd35e9b675961ecbc26c))
+
+# [3.17.0](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v3.16.2...v3.17.0) (2022-12-11)
+
+
+### Features
+
+* **ControlsList:** Add ControlsList component ([#61](https://github.com/SteamDeckHomebrew/decky-frontend-lib/issues/61)) ([c586afb](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/c586afb97d59928ecb703b5a254ed1b9405e2c7e))
+
+## [3.16.2](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v3.16.1...v3.16.2) (2022-12-11)
+
+
+### Bug Fixes
+
+* **Marquee:** replace default export with named export ([cd0635e](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/cd0635e94f98499f9f5fc24a7fd4b93efe7dfc38))
+
 ## [3.16.1](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v3.16.0...v3.16.1) (2022-12-11)
 
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "decky-frontend-lib",
-  "version": "3.16.1",
+  "version": "3.18.1",
   "description": "A library for building decky plugins",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

src/custom-hooks/useQuickAccessVisible.tsx

@@ -6,7 +6,8 @@ declare global {
 
 function getQuickAccessWindow(): Window | null {
   try {
-    const navTrees = FocusNavController?.m_ActiveContext?.m_rgGamepadNavigationTrees || FocusNavController?.m_rgGamepadNavigationTrees;
+    const context = FocusNavController?.m_ActiveContext || FocusNavController?.m_LastActiveContext;
+    const navTrees = context?.m_ActiveContext?.m_rgGamepadNavigationTrees || FocusNavController?.m_rgGamepadNavigationTrees;
     return navTrees?.find((tree: any) => tree?.id === "QuickAccess-NA")?.m_Root?.m_element?.ownerDocument.defaultView ?? null;
   } catch (error) {
     console.error(error);

src/deck-components/ControlsList.tsx

@@ -0,0 +1,17 @@
+import { findModuleChild } from '../webpack';
+import { FC } from 'react';
+
+export interface ControlsListProps {
+  alignItems?: 'left' | 'right' | 'center';
+  spacing?: 'standard' | 'extra';
+}
+
+export const ControlsList: FC<ControlsListProps> = findModuleChild((m) => {
+  if (typeof m !== 'object') return;
+  for (const prop in m) {
+    if (m[prop]?.toString && m[prop].toString().includes('().ControlsListChild') && m[prop].toString().includes('().ControlsListOuterPanel')) {
+      return m[prop];
+    }
+  }
+  return;
+});

src/deck-components/DialogCheckbox.tsx

@@ -0,0 +1,33 @@
+import { FC, ReactNode } from 'react';
+
+import { findModule } from '../webpack';
+import { DialogCommonProps } from './Dialog';
+import { FooterLegendProps } from './FooterLegend';
+
+export interface DialogCheckboxProps extends DialogCommonProps, FooterLegendProps {
+  onChange?(checked: boolean): void;
+  label?: ReactNode;
+  description?: ReactNode;
+  disabled?: boolean;
+  tooltip?: string;
+  color?: string;
+  highlightColor?: string;
+  bottomSeparator?: 'standard' | 'thick' | 'none';
+  controlled?: boolean;
+  checked?: boolean;
+  onClick?(evt: Event): void;
+}
+
+export const DialogCheckbox = Object.values(findModule((m: any) => {
+  if (typeof m !== 'object') return false;
+  for (const prop in m) {
+    if (m[prop]?.prototype?.GetPanelElementProps) return true;
+  }
+  return false;
+})).find((m: any) =>
+  m.contextType &&
+  m.prototype?.render.toString().includes('fallback:') &&
+  m?.prototype?.SetChecked &&
+  m?.prototype?.Toggle &&
+  m?.prototype?.GetPanelElementProps
+) as FC<DialogCheckboxProps>;

src/deck-components/Marquee.tsx

@@ -1,4 +1,5 @@
-import { FC, CSSProperties } from 'react';
+import { CSSProperties, FC } from 'react';
+
 import { findModuleChild } from '../webpack';
 
 export interface MarqueeProps {
@@ -14,7 +15,7 @@ export interface MarqueeProps {
   children: React.ReactNode;
 }
 
-const Marquee: FC<MarqueeProps> = findModuleChild((m) => {
+export const Marquee: FC<MarqueeProps> = findModuleChild((m) => {
   if (typeof m !== 'object') return;
   for (const prop in m) {
     if (m[prop]?.toString && m[prop].toString().includes('.Marquee') && m[prop].toString().includes('--fade-length')) {
@@ -23,5 +24,3 @@ const Marquee: FC<MarqueeProps> = findModuleChild((m) => {
   }
   return;
 });
-
-export default Marquee;

src/deck-components/index.ts

@@ -1,7 +1,9 @@
 export * from './Button';
 export * from './ButtonItem';
 export * from './Carousel';
+export * from './ControlsList';
 export * from './Dialog';
+export * from './DialogCheckbox';
 export * from './Dropdown';
 export * from './Field';
 export * from './Focusable';

src/utils/index.ts

@@ -16,6 +16,7 @@ export function findSP(): Window {
   // old (SP as host)
   if (document.title == 'SP') return window;
   // new (SP as popup)
-  return FocusNavController.m_ActiveContext.m_rgGamepadNavigationTrees.find((x: any) => x.m_ID == 'root_1_').Root
+  const context = FocusNavController.m_ActiveContext || FocusNavController.m_LastActiveContext;
+  return context.m_rgGamepadNavigationTrees.find((x: any) => x.m_ID == 'root_1_').Root
     .Element.ownerDocument.defaultView;
 }