port to @decky/ui

TODO: update package.json to match once @decky/ui is on NPM

35 files changed, 50 insertions, 83 deletions

diff --git a/frontend/src/components/DeckyToaster.tsx b/frontend/src/components/DeckyToaster.tsx
index 6faece09..00b7b4db 100644
--- a/frontend/src/components/DeckyToaster.tsx
+++ b/frontend/src/components/DeckyToaster.tsx
@@ -1,4 +1,4 @@
-import { ToastData, joinClassNames } from 'decky-frontend-lib';
+import { ToastData, joinClassNames } from '@decky/ui';
 import { FC, useEffect, useState } from 'react';
 import { ReactElement } from 'react-markdown/lib/react-markdown';
 
diff --git a/frontend/src/components/DeckyToasterState.tsx b/frontend/src/components/DeckyToasterState.tsx
index 8732d7f8..d6c3871f 100644
--- a/frontend/src/components/DeckyToasterState.tsx
+++ b/frontend/src/components/DeckyToasterState.tsx
@@ -1,4 +1,4 @@
-import { ToastData } from 'decky-frontend-lib';
+import { ToastData } from '@decky/ui';
 import { FC, createContext, useContext, useEffect, useState } from 'react';
 
 interface PublicDeckyToasterState {
diff --git a/frontend/src/components/Markdown.tsx b/frontend/src/components/Markdown.tsx
index 91776599..bd43fffa 100644
--- a/frontend/src/components/Markdown.tsx
+++ b/frontend/src/components/Markdown.tsx
@@ -1,4 +1,4 @@
-import { Focusable, Navigation } from 'decky-frontend-lib';
+import { Focusable, Navigation } from '@decky/ui';
 import { FunctionComponent, useRef } from 'react';
 import ReactMarkdown, { Options as ReactMarkdownOptions } from 'react-markdown';
 import remarkGfm from 'remark-gfm';
diff --git a/frontend/src/components/PluginView.tsx b/frontend/src/components/PluginView.tsx
index a31053fe..ce20ac4a 100644
--- a/frontend/src/components/PluginView.tsx
+++ b/frontend/src/components/PluginView.tsx
@@ -1,4 +1,4 @@
-import { ButtonItem, Focusable, PanelSection, PanelSectionRow } from 'decky-frontend-lib';
+import { ButtonItem, Focusable, PanelSection, PanelSectionRow } from '@decky/ui';
 import { VFC, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { FaEyeSlash } from 'react-icons/fa';
diff --git a/frontend/src/components/TitleView.tsx b/frontend/src/components/TitleView.tsx
index 357656fa..c49e6df6 100644
--- a/frontend/src/components/TitleView.tsx
+++ b/frontend/src/components/TitleView.tsx
@@ -1,4 +1,4 @@
-import { DialogButton, Focusable, Router, staticClasses } from 'decky-frontend-lib';
+import { DialogButton, Focusable, Router, staticClasses } from '@decky/ui';
 import { CSSProperties, VFC } from 'react';
 import { useTranslation } from 'react-i18next';
 import { BsGearFill } from 'react-icons/bs';
diff --git a/frontend/src/components/Toast.tsx b/frontend/src/components/Toast.tsx
index 78fb60aa..ab01671a 100644
--- a/frontend/src/components/Toast.tsx
+++ b/frontend/src/components/Toast.tsx
@@ -1,4 +1,4 @@
-import { ToastData, findModule, joinClassNames } from 'decky-frontend-lib';
+import { ToastData, findModule, joinClassNames } from '@decky/ui';
 import { FunctionComponent } from 'react';
 
 interface ToastProps {
diff --git a/frontend/src/components/WithSuspense.tsx b/frontend/src/components/WithSuspense.tsx
index 402f5e5b..91236291 100644
--- a/frontend/src/components/WithSuspense.tsx
+++ b/frontend/src/components/WithSuspense.tsx
@@ -1,4 +1,4 @@
-import { Focusable, SteamSpinner } from 'decky-frontend-lib';
+import { Focusable, SteamSpinner } from '@decky/ui';
 import { FunctionComponent, ReactElement, ReactNode, Suspense } from 'react';
 
 interface WithSuspenseProps {
diff --git a/frontend/src/components/modals/DropdownMultiselect.tsx b/frontend/src/components/modals/DropdownMultiselect.tsx
index 5defbfa4..4c5cf7b1 100644
--- a/frontend/src/components/modals/DropdownMultiselect.tsx
+++ b/frontend/src/components/modals/DropdownMultiselect.tsx
@@ -2,24 +2,21 @@ import {
   DialogButton,
   DialogCheckbox,
   DialogCheckboxProps,
+  Export,
   Marquee,
   Menu,
   MenuItem,
-  findModuleChild,
+  findModuleExport,
   showContextMenu,
-} from 'decky-frontend-lib';
+} from '@decky/ui';
 import { FC, useCallback, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { FaChevronDown } from 'react-icons/fa';
 
-const dropDownControlButtonClass = findModuleChild((m) => {
-  if (typeof m !== 'object') return undefined;
-  for (const prop in m) {
-    if (m[prop]?.toString()?.includes('gamepaddropdown_DropDownControlButton')) {
-      return m[prop];
-    }
-  }
-});
+// TODO add to dfl
+const dropDownControlButtonClass = findModuleExport((e: Export) =>
+  e?.toString()?.includes('gamepaddropdown_DropDownControlButton'),
+);
 
 const DropdownMultiselectItem: FC<
   {
diff --git a/frontend/src/components/modals/MultiplePluginsInstallModal.tsx b/frontend/src/components/modals/MultiplePluginsInstallModal.tsx
index bfbff08c..73b8acb1 100644
--- a/frontend/src/components/modals/MultiplePluginsInstallModal.tsx
+++ b/frontend/src/components/modals/MultiplePluginsInstallModal.tsx
@@ -1,4 +1,4 @@
-import { ConfirmModal, Navigation, QuickAccessTab } from 'decky-frontend-lib';
+import { ConfirmModal, Navigation, QuickAccessTab } from '@decky/ui';
 import { FC, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
diff --git a/frontend/src/components/modals/PluginInstallModal.tsx b/frontend/src/components/modals/PluginInstallModal.tsx
index bf263b6d..1d149b2a 100644
--- a/frontend/src/components/modals/PluginInstallModal.tsx
+++ b/frontend/src/components/modals/PluginInstallModal.tsx
@@ -1,4 +1,4 @@
-import { ConfirmModal, Navigation, QuickAccessTab } from 'decky-frontend-lib';
+import { ConfirmModal, Navigation, QuickAccessTab } from '@decky/ui';
 import { FC, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
diff --git a/frontend/src/components/modals/PluginUninstallModal.tsx b/frontend/src/components/modals/PluginUninstallModal.tsx
index 087b634c..a1b745e9 100644
--- a/frontend/src/components/modals/PluginUninstallModal.tsx
+++ b/frontend/src/components/modals/PluginUninstallModal.tsx
@@ -1,4 +1,4 @@
-import { ConfirmModal } from 'decky-frontend-lib';
+import { ConfirmModal } from '@decky/ui';
 import { FC } from 'react';
 
 import { uninstallPlugin } from '../../plugin';
diff --git a/frontend/src/components/modals/filepicker/index.tsx b/frontend/src/components/modals/filepicker/index.tsx
index 2fbc800b..dc57b2c9 100644
--- a/frontend/src/components/modals/filepicker/index.tsx
+++ b/frontend/src/components/modals/filepicker/index.tsx
@@ -10,7 +10,7 @@ import {
   SteamSpinner,
   TextField,
   ToggleField,
-} from 'decky-frontend-lib';
+} from '@decky/ui';
 import { filesize } from 'filesize';
 import { FunctionComponent, useCallback, useEffect, useMemo, useState } from 'react';
 import { DefaultExtensionType, FileIcon, defaultStyles } from 'react-file-icon';
diff --git a/frontend/src/components/modals/filepicker/patches/library.ts b/frontend/src/components/modals/filepicker/patches/library.ts
index 71eb9541..3b7fa679 100644
--- a/frontend/src/components/modals/filepicker/patches/library.ts
+++ b/frontend/src/components/modals/filepicker/patches/library.ts
@@ -1,4 +1,4 @@
-import { Patch, findModuleChild, replacePatch, sleep } from 'decky-frontend-lib';
+import { Export, Patch, findModuleExport, replacePatch, sleep } from '@decky/ui';
 
 import Logger from '../../../../logger';
 import { FileSelectionType } from '..';
@@ -39,12 +39,7 @@ export default async function libraryPatch() {
     let History: any;
 
     while (!History) {
-      History = findModuleChild((m) => {
-        if (typeof m !== 'object') return undefined;
-        for (let prop in m) {
-          if (m[prop]?.m_history) return m[prop].m_history;
-        }
-      });
+      History = findModuleExport((e: Export) => e.m_history)?.m_history;
       if (!History) {
         logger.debug('Waiting 5s for history to become available.');
         await sleep(5000);
diff --git a/frontend/src/components/patchnotes/InlinePatchNotes.tsx b/frontend/src/components/patchnotes/InlinePatchNotes.tsx
index 84861c04..cf25efcb 100644
--- a/frontend/src/components/patchnotes/InlinePatchNotes.tsx
+++ b/frontend/src/components/patchnotes/InlinePatchNotes.tsx
@@ -1,4 +1,4 @@
-import { Focusable, updaterFieldClasses } from 'decky-frontend-lib';
+import { Focusable, updaterFieldClasses } from '@decky/ui';
 import { FunctionComponent, ReactNode } from 'react';
 
 interface InlinePatchNotesProps {
diff --git a/frontend/src/components/settings/index.tsx b/frontend/src/components/settings/index.tsx
index 80400058..d6d98645 100644
--- a/frontend/src/components/settings/index.tsx
+++ b/frontend/src/components/settings/index.tsx
@@ -1,4 +1,4 @@
-import { SidebarNavigation } from 'decky-frontend-lib';
+import { SidebarNavigation } from '@decky/ui';
 import { lazy } from 'react';
 import { useTranslation } from 'react-i18next';
 import { FaCode, FaFlask, FaPlug } from 'react-icons/fa';
diff --git a/frontend/src/components/settings/pages/developer/index.tsx b/frontend/src/components/settings/pages/developer/index.tsx
index 091e367e..099f2610 100644
--- a/frontend/src/components/settings/pages/developer/index.tsx
+++ b/frontend/src/components/settings/pages/developer/index.tsx
@@ -7,7 +7,7 @@ import {
   Navigation,
   TextField,
   Toggle,
-} from 'decky-frontend-lib';
+} from '@decky/ui';
 import { useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { FaFileArchive, FaLink, FaReact, FaSteamSymbol, FaTerminal } from 'react-icons/fa';
diff --git a/frontend/src/components/settings/pages/general/BranchSelect.tsx b/frontend/src/components/settings/pages/general/BranchSelect.tsx
index d51f1db8..0b3177d1 100644
--- a/frontend/src/components/settings/pages/general/BranchSelect.tsx
+++ b/frontend/src/components/settings/pages/general/BranchSelect.tsx
@@ -1,4 +1,4 @@
-import { Dropdown, Field } from 'decky-frontend-lib';
+import { Dropdown, Field } from '@decky/ui';
 import { FunctionComponent } from 'react';
 import { useTranslation } from 'react-i18next';
 
diff --git a/frontend/src/components/settings/pages/general/NotificationSettings.tsx b/frontend/src/components/settings/pages/general/NotificationSettings.tsx
index 82f42e3b..693fa62f 100644
--- a/frontend/src/components/settings/pages/general/NotificationSettings.tsx
+++ b/frontend/src/components/settings/pages/general/NotificationSettings.tsx
@@ -1,4 +1,4 @@
-import { Field, Toggle } from 'decky-frontend-lib';
+import { Field, Toggle } from '@decky/ui';
 import { FC } from 'react';
 import { useTranslation } from 'react-i18next';
 
diff --git a/frontend/src/components/settings/pages/general/RemoteDebugging.tsx b/frontend/src/components/settings/pages/general/RemoteDebugging.tsx
index 187f1cf4..85102511 100644
--- a/frontend/src/components/settings/pages/general/RemoteDebugging.tsx
+++ b/frontend/src/components/settings/pages/general/RemoteDebugging.tsx
@@ -1,4 +1,4 @@
-import { Field, Toggle } from 'decky-frontend-lib';
+import { Field, Toggle } from '@decky/ui';
 import { useTranslation } from 'react-i18next';
 import { FaChrome } from 'react-icons/fa';
 
diff --git a/frontend/src/components/settings/pages/general/StoreSelect.tsx b/frontend/src/components/settings/pages/general/StoreSelect.tsx
index 3cb80303..9cc7d5c9 100644
--- a/frontend/src/components/settings/pages/general/StoreSelect.tsx
+++ b/frontend/src/components/settings/pages/general/StoreSelect.tsx
@@ -1,4 +1,4 @@
-import { Dropdown, Field, TextField } from 'decky-frontend-lib';
+import { Dropdown, Field, TextField } from '@decky/ui';
 import { FunctionComponent } from 'react';
 import { useTranslation } from 'react-i18next';
 import { FaShapes } from 'react-icons/fa';
diff --git a/frontend/src/components/settings/pages/general/Updater.tsx b/frontend/src/components/settings/pages/general/Updater.tsx
index 9fcc2dd3..59756a57 100644
--- a/frontend/src/components/settings/pages/general/Updater.tsx
+++ b/frontend/src/components/settings/pages/general/Updater.tsx
@@ -8,7 +8,7 @@ import {
   Spinner,
   findSP,
   showModal,
-} from 'decky-frontend-lib';
+} from '@decky/ui';
 import { Suspense, lazy, useCallback, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { FaExclamation } from 'react-icons/fa';
diff --git a/frontend/src/components/settings/pages/general/index.tsx b/frontend/src/components/settings/pages/general/index.tsx
index 6fc62a46..84ad88f1 100644
--- a/frontend/src/components/settings/pages/general/index.tsx
+++ b/frontend/src/components/settings/pages/general/index.tsx
@@ -1,4 +1,4 @@
-import { DialogBody, DialogControlsSection, DialogControlsSectionHeader, Field, Toggle } from 'decky-frontend-lib';
+import { DialogBody, DialogControlsSection, DialogControlsSectionHeader, Field, Toggle } from '@decky/ui';
 import { useTranslation } from 'react-i18next';
 
 import { useDeckyState } from '../../../DeckyState';
diff --git a/frontend/src/components/settings/pages/plugin_list/index.tsx b/frontend/src/components/settings/pages/plugin_list/index.tsx
index d8a268ae..ff6e49f7 100644
--- a/frontend/src/components/settings/pages/plugin_list/index.tsx
+++ b/frontend/src/components/settings/pages/plugin_list/index.tsx
@@ -8,7 +8,7 @@ import {
   ReorderableEntry,
   ReorderableList,
   showContextMenu,
-} from 'decky-frontend-lib';
+} from '@decky/ui';
 import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { FaDownload, FaEllipsisH, FaRecycle } from 'react-icons/fa';
diff --git a/frontend/src/components/settings/pages/testing/index.tsx b/frontend/src/components/settings/pages/testing/index.tsx
index 2467f3c5..4be6569c 100644
--- a/frontend/src/components/settings/pages/testing/index.tsx
+++ b/frontend/src/components/settings/pages/testing/index.tsx
@@ -7,7 +7,7 @@ import {
   Navigation,
   ProgressBar,
   SteamSpinner,
-} from 'decky-frontend-lib';
+} from '@decky/ui';
 import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { FaDownload, FaInfo } from 'react-icons/fa';
diff --git a/frontend/src/components/store/PluginCard.tsx b/frontend/src/components/store/PluginCard.tsx
index da144605..dd54aa65 100644
--- a/frontend/src/components/store/PluginCard.tsx
+++ b/frontend/src/components/store/PluginCard.tsx
@@ -1,11 +1,4 @@
-import {
-  ButtonItem,
-  Dropdown,
-  Focusable,
-  PanelSectionRow,
-  SingleDropdownOption,
-  SuspensefulImage,
-} from 'decky-frontend-lib';
+import { ButtonItem, Dropdown, Focusable, PanelSectionRow, SingleDropdownOption, SuspensefulImage } from '@decky/ui';
 import { CSSProperties, FC, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
diff --git a/frontend/src/components/store/Store.tsx b/frontend/src/components/store/Store.tsx
index fdb871b0..51dbecef 100644
--- a/frontend/src/components/store/Store.tsx
+++ b/frontend/src/components/store/Store.tsx
@@ -7,7 +7,7 @@ import {
   Tabs,
   TextField,
   findModule,
-} from 'decky-frontend-lib';
+} from '@decky/ui';
 import { Dispatch, FC, SetStateAction, useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
diff --git a/frontend/src/developer.tsx b/frontend/src/developer.tsx
index 99e9890b..576dd73d 100644
--- a/frontend/src/developer.tsx
+++ b/frontend/src/developer.tsx
@@ -1,4 +1,4 @@
-import { sleep } from 'decky-frontend-lib';
+import { sleep } from '@decky/ui';
 import { FaReact } from 'react-icons/fa';
 
 import Logger from './logger';
diff --git a/frontend/src/index.ts b/frontend/src/index.ts
index 91324b4f..a108df66 100644
--- a/frontend/src/index.ts
+++ b/frontend/src/index.ts
@@ -1,7 +1,7 @@
 // Sets up DFL, then loads start.ts which starts up the loader
 (async () => {
-  console.debug('Setting up decky-frontend-lib...');
-  window.DFL = await import('decky-frontend-lib');
+  console.debug('Setting up @decky/ui...');
+  window.DFL = await import('@decky/ui');
   console.debug('Authenticating with Decky backend...');
   window.deckyAuthToken = await fetch('http://127.0.0.1:1337/auth/token').then((r) => r.text());
   console.debug('Connecting to Decky backend...');
diff --git a/frontend/src/plugin-loader.tsx b/frontend/src/plugin-loader.tsx
index bb6fa6dd..1ddc0fa2 100644
--- a/frontend/src/plugin-loader.tsx
+++ b/frontend/src/plugin-loader.tsx
@@ -8,7 +8,7 @@ import {
   quickAccessMenuClasses,
   showModal,
   sleep,
-} from 'decky-frontend-lib';
+} from '@decky/ui';
 import { FC, lazy } from 'react';
 import { FaExclamationCircle, FaPlug } from 'react-icons/fa';
 
diff --git a/frontend/src/router-hook.tsx b/frontend/src/router-hook.tsx
index 28f6923c..7c52e581 100644
--- a/frontend/src/router-hook.tsx
+++ b/frontend/src/router-hook.tsx
@@ -1,4 +1,4 @@
-import { Patch, afterPatch, findModuleChild } from 'decky-frontend-lib';
+import { Export, Patch, afterPatch, findModuleExport } from '@decky/ui';
 import { FC, ReactElement, ReactNode, cloneElement, createElement, memo } from 'react';
 import type { Route } from 'react-router';
 
@@ -41,13 +41,9 @@ class RouterHook extends Logger {
     window.__ROUTER_HOOK_INSTANCE?.deinit?.();
     window.__ROUTER_HOOK_INSTANCE = this;
 
-    this.gamepadWrapper = findModuleChild((m) => {
-      if (typeof m !== 'object') return undefined;
-      for (let prop in m) {
-        if (m[prop]?.render?.toString()?.includes('["flow-children","onActivate","onCancel","focusClassName",'))
-          return m[prop];
-      }
-    });
+    this.gamepadWrapper = findModuleExport((e: Export) =>
+      e?.render?.toString()?.includes('["flow-children","onActivate","onCancel","focusClassName",'),
+    );
 
     let Route: new () => Route;
     // Used to store the new replicated routes we create to allow routes to be unpatched.
diff --git a/frontend/src/steamfixes/reload.ts b/frontend/src/steamfixes/reload.ts
index 8635abdc..a986cc17 100644
--- a/frontend/src/steamfixes/reload.ts
+++ b/frontend/src/steamfixes/reload.ts
@@ -1,4 +1,4 @@
-import { getFocusNavController, sleep } from 'decky-frontend-lib';
+import { getFocusNavController, sleep } from '@decky/ui';
 
 import Logger from '../logger';
 
diff --git a/frontend/src/steamfixes/restart.ts b/frontend/src/steamfixes/restart.ts
index 93fc08f7..acfea3a0 100644
--- a/frontend/src/steamfixes/restart.ts
+++ b/frontend/src/steamfixes/restart.ts
@@ -1,4 +1,4 @@
-import { Patch, findModuleChild, replacePatch, sleep } from 'decky-frontend-lib';
+import { Export, Patch, findModuleExport, replacePatch, sleep } from '@decky/ui';
 
 import Logger from '../logger';
 
@@ -18,12 +18,7 @@ export default async function restartFix() {
     let History: any;
 
     while (!History) {
-      History = findModuleChild((m) => {
-        if (typeof m !== 'object') return undefined;
-        for (let prop in m) {
-          if (m[prop]?.m_history) return m[prop].m_history;
-        }
-      });
+      History = findModuleExport((e: Export) => e.m_history)?.m_history;
       if (!History) {
         logger.debug('Waiting 5s for history to become available.');
         await sleep(5000);
diff --git a/frontend/src/tabs-hook.tsx b/frontend/src/tabs-hook.tsx
index b180953f..f42a4aea 100644
--- a/frontend/src/tabs-hook.tsx
+++ b/frontend/src/tabs-hook.tsx
@@ -1,5 +1,5 @@
 // TabsHook for versions after the Desktop merge
-import { Patch, QuickAccessTab, afterPatch, findInReactTree, getReactRoot, sleep } from 'decky-frontend-lib';
+import { Patch, QuickAccessTab, afterPatch, findInReactTree, getReactRoot, sleep } from '@decky/ui';
 
 import { QuickAccessVisibleStateProvider } from './components/QuickAccessVisibleState';
 import Logger from './logger';
diff --git a/frontend/src/toaster.tsx b/frontend/src/toaster.tsx
index 8f274ff2..c6b15347 100644
--- a/frontend/src/toaster.tsx
+++ b/frontend/src/toaster.tsx
@@ -1,14 +1,14 @@
 import {
-  Module,
+  Export,
   Patch,
   ToastData,
   afterPatch,
   findClass,
   findInReactTree,
-  findModuleChild,
+  findModuleExport,
   getReactRoot,
   sleep,
-} from 'decky-frontend-lib';
+} from '@decky/ui';
 import { ReactNode } from 'react';
 
 import Toast from './components/Toast';
@@ -150,16 +150,7 @@ class Toaster extends Logger {
     this.rNode.stateNode.forceUpdate();
     delete this.rNode.stateNode.shouldComponentUpdate;
 
-    this.audioModule = findModuleChild((m: Module) => {
-      if (typeof m !== 'object') return undefined;
-      for (let prop in m) {
-        try {
-          if (m[prop].PlayNavSound && m[prop].RegisterCallbackOnPlaySound) return m[prop];
-        } catch {
-          return undefined;
-        }
-      }
-    });
+    this.audioModule = findModuleExport((e: Export) => e.PlayNavSound && e.RegisterCallbackOnPlaySound);
 
     this.log('Initialized');
     this.finishStartup?.();
diff --git a/frontend/src/wsrouter.ts b/frontend/src/wsrouter.ts
index 643d24f5..75d74cde 100644
--- a/frontend/src/wsrouter.ts
+++ b/frontend/src/wsrouter.ts
@@ -1,4 +1,4 @@
-import { sleep } from 'decky-frontend-lib';
+import { sleep } from '@decky/ui';
 
 import Logger from './logger';