0.0.6

package-lock.json

@@ -1,26 +1,23 @@
 {
   "name": "decky-frontend-lib",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "decky-frontend-lib",
-      "version": "0.0.4",
+      "version": "0.0.6",
       "license": "GPL-2.0-or-later",
       "devDependencies": {
         "@types/jest": "^27.4.1",
         "@types/react": "16.14.0",
+        "@types/react-router": "5.1.18",
         "import-sort-style-module": "^6.0.0",
         "jest": "^27.5.1",
         "prettier-plugin-import-sort": "^0.0.7",
-        "react": "^16.14.0",
         "shx": "^0.3.4",
         "ts-jest": "^27.1.4",
         "typescript": "^4.6.3"
-      },
-      "peerDependencies": {
-        "react": "16.14.0"
       }
     },
     "node_modules/@ampproject/remapping": {
@@ -1255,6 +1252,12 @@
         "@types/node": "*"
       }
     },
+    "node_modules/@types/history": {
+      "version": "4.7.11",
+      "resolved": "https://registry.npmjs.org/@types/history/-/history-4.7.11.tgz",
+      "integrity": "sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==",
+      "dev": true
+    },
     "node_modules/@types/istanbul-lib-coverage": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz",
@@ -1317,6 +1320,16 @@
         "csstype": "^3.0.2"
       }
     },
+    "node_modules/@types/react-router": {
+      "version": "5.1.18",
+      "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.18.tgz",
+      "integrity": "sha512-YYknwy0D0iOwKQgz9v8nOzt2J6l4gouBmDnWqUUznltOTaon+r8US8ky8HvN0tXvc38U9m6z/t2RsVsnd1zM0g==",
+      "dev": true,
+      "dependencies": {
+        "@types/history": "^4.7.11",
+        "@types/react": "*"
+      }
+    },
     "node_modules/@types/stack-utils": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-2.0.1.tgz",
@@ -4695,18 +4708,6 @@
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=",
       "dev": true
     },
-    "node_modules/loose-envify": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
-      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
-      "dev": true,
-      "dependencies": {
-        "js-tokens": "^3.0.0 || ^4.0.0"
-      },
-      "bin": {
-        "loose-envify": "cli.js"
-      }
-    },
     "node_modules/lru-cache": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
@@ -4867,15 +4868,6 @@
       "integrity": "sha512-h2AatdwYH+JHiZpv7pt/gSX1XoRGb7L/qSIeuqA6GwYoF9w1vP1cw42TO0aI2pNyshRK5893hNSl+1//vHK7hQ==",
       "dev": true
     },
-    "node_modules/object-assign": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
-      "dev": true,
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/once": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
@@ -5129,17 +5121,6 @@
         "node": ">= 6"
       }
     },
-    "node_modules/prop-types": {
-      "version": "15.8.1",
-      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
-      "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
-      "dev": true,
-      "dependencies": {
-        "loose-envify": "^1.4.0",
-        "object-assign": "^4.1.1",
-        "react-is": "^16.13.1"
-      }
-    },
     "node_modules/psl": {
       "version": "1.8.0",
       "resolved": "https://registry.npmjs.org/psl/-/psl-1.8.0.tgz",
@@ -5155,26 +5136,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/react": {
-      "version": "16.14.0",
-      "resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz",
-      "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==",
-      "dev": true,
-      "dependencies": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1",
-        "prop-types": "^15.6.2"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/react-is": {
-      "version": "16.13.1",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
-      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
-      "dev": true
-    },
     "node_modules/rechoir": {
       "version": "0.6.2",
       "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
@@ -6978,6 +6939,12 @@
         "@types/node": "*"
       }
     },
+    "@types/history": {
+      "version": "4.7.11",
+      "resolved": "https://registry.npmjs.org/@types/history/-/history-4.7.11.tgz",
+      "integrity": "sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==",
+      "dev": true
+    },
     "@types/istanbul-lib-coverage": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz",
@@ -7040,6 +7007,16 @@
         "csstype": "^3.0.2"
       }
     },
+    "@types/react-router": {
+      "version": "5.1.18",
+      "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.18.tgz",
+      "integrity": "sha512-YYknwy0D0iOwKQgz9v8nOzt2J6l4gouBmDnWqUUznltOTaon+r8US8ky8HvN0tXvc38U9m6z/t2RsVsnd1zM0g==",
+      "dev": true,
+      "requires": {
+        "@types/history": "^4.7.11",
+        "@types/react": "*"
+      }
+    },
     "@types/stack-utils": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-2.0.1.tgz",
@@ -9599,15 +9576,6 @@
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=",
       "dev": true
     },
-    "loose-envify": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
-      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
-      "dev": true,
-      "requires": {
-        "js-tokens": "^3.0.0 || ^4.0.0"
-      }
-    },
     "lru-cache": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
@@ -9738,12 +9706,6 @@
       "integrity": "sha512-h2AatdwYH+JHiZpv7pt/gSX1XoRGb7L/qSIeuqA6GwYoF9w1vP1cw42TO0aI2pNyshRK5893hNSl+1//vHK7hQ==",
       "dev": true
     },
-    "object-assign": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
-      "dev": true
-    },
     "once": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
@@ -9927,17 +9889,6 @@
         "sisteransi": "^1.0.5"
       }
     },
-    "prop-types": {
-      "version": "15.8.1",
-      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
-      "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
-      "dev": true,
-      "requires": {
-        "loose-envify": "^1.4.0",
-        "object-assign": "^4.1.1",
-        "react-is": "^16.13.1"
-      }
-    },
     "psl": {
       "version": "1.8.0",
       "resolved": "https://registry.npmjs.org/psl/-/psl-1.8.0.tgz",
@@ -9950,23 +9901,6 @@
       "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==",
       "dev": true
     },
-    "react": {
-      "version": "16.14.0",
-      "resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz",
-      "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==",
-      "dev": true,
-      "requires": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1",
-        "prop-types": "^15.6.2"
-      }
-    },
-    "react-is": {
-      "version": "16.13.1",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
-      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
-      "dev": true
-    },
     "rechoir": {
       "version": "0.6.2",
       "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "decky-frontend-lib",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "description": "A library for building decky plugins",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -35,6 +35,7 @@
   "devDependencies": {
     "@types/jest": "^27.4.1",
     "@types/react": "16.14.0",
+    "@types/react-router": "5.1.18",
     "import-sort-style-module": "^6.0.0",
     "jest": "^27.5.1",
     "prettier-plugin-import-sort": "^0.0.7",

src/deck-components/Menu.tsx

@@ -1,7 +1,16 @@
-import { FC } from 'react';
+import { FC, ReactNode } from 'react';
 
 import { findModuleChild } from '../webpack';
 
+export const showContextMenu: (children: ReactNode, parent?: EventTarget) => void = findModuleChild((m) => {
+  if (typeof m !== 'object') return undefined;
+  for (let prop in m) {
+    if (typeof m[prop] === 'function' && m[prop].toString().includes('stopPropagation))')) {
+      return m[prop];
+    }
+  }
+});
+
 interface MenuProps {
   label: string;
   onCancel?(): void;

src/deck-components/Modal.tsx

@@ -1,12 +1,28 @@
-import { ReactNode } from 'react';
-
+import { FC, ReactNode } from 'react';
 import { findModuleChild } from '../webpack';
 
-export const showModal: (children: ReactNode, parent: EventTarget) => void = findModuleChild((m) => {
+// TODO: there is another argument, figure out what it does
+export const showModal: (children: ReactNode, parent?: EventTarget) => void = findModuleChild((m) => {
   if (typeof m !== 'object') return undefined;
   for (let prop in m) {
-    if (typeof m[prop] === 'function' && m[prop].toString().includes('stopPropagation))')) {
+    if (typeof m[prop] === 'function' && m[prop].toString().includes('bHideMainWindowForPopouts:!0')) {
       return m[prop];
     }
   }
 });
+
+interface ModalRootProps {
+  onMiddleButton?(): void,
+  onCancel?(): void;
+  onOK?(): void;
+  bAllowFullSize?: boolean;
+}
+
+export const ModalRoot = findModuleChild(m => {
+  if (typeof m !== "object") return undefined;
+  for (let prop in m) {
+    if (!m[prop]?.prototype?.OK && m[prop]?.prototype?.Cancel && m[prop]?.prototype?.render) {
+      return m[prop];
+    }
+  }
+}) as FC<ModalRootProps>;

src/deck-components/Spinner.tsx

@@ -2,15 +2,7 @@ import { FC } from 'react';
 
 import { IconsModule } from '../webpack';
 
-// interface ButtonProps {
-//   label?: string;
-//   description?: string;
-//   layout?: 'below';
-//   onClick?(e: MouseEvent): void;
-//   disabled?: boolean;
-//   bottomSeparator?: boolean;
-// }
-
+// TODO type this and other icons?
 export const Spinner = Object.values(IconsModule).find((mod: any) =>
     mod?.toString && /Spinner\)}\),.\.createElement\(\"path\",{d:\"M18 /.test(mod.toString())
 ) as FC<{}>;

src/deck-components/SteamSpinner.tsx

@@ -0,0 +1,9 @@
+import { FC } from 'react';
+import { findModuleChild } from '../webpack';
+
+export const SteamSpinner = findModuleChild((m) => {
+    if (typeof m !== "object") return undefined;
+    for (let prop in m) {
+      if (m[prop]?.toString()?.includes("Steam Spinner") && m[prop].toString().includes("PreloadThrobber")) return m[prop]
+    }
+}) as FC<{}>;

src/deck-components/index.ts

@@ -4,6 +4,7 @@ export * from './Menu';
 export * from './Modal';
 export * from './Panel';
 export * from './Slider';
+export * from './SteamSpinner';
 export * from './Spinner';
 export * from './static-classes';
 export * from './Toggle';

src/plugin.tsx

@@ -1,3 +1,6 @@
+import type { ComponentType } from 'react';
+import { RouteProps } from 'react-router';
+
 export interface Plugin {
   title: JSX.Element;
   icon: JSX.Element;
@@ -17,7 +20,13 @@ interface ServerResponseError {
 
 type ServerResponse<TRes> = ServerResponseSuccess<TRes> | ServerResponseError;
 
+interface RouterHook {
+  addRoute(path: string, component: ComponentType, props?: Omit<RouteProps, 'path' | 'children'>): void;
+  removeRoute(path: string): void;
+}
+
 export interface ServerAPI {
+  routerHook: RouterHook;
   callPluginMethod<TArgs = {}, TRes = {}>(methodName: string, args: TArgs): Promise<ServerResponse<TRes>>;
   callServerMethod<TArgs = {}, TRes = {}>(methodName: string, args: TArgs): Promise<ServerResponse<TRes>>;
   fetchNoCors<TRes = {}>(url: string, request: RequestInfo): Promise<ServerResponse<TRes>>;