@decky/ui 4.0.1 → 4.0.2

package/dist/components/Carousel.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes, ReactNode, RefAttributes, VFC } from 'react';
+import { HTMLAttributes, ReactNode, RefAttributes, FC } from 'react';
 export interface CarouselProps extends HTMLAttributes<HTMLDivElement> {
     autoFocus?: boolean;
     enableBumperPaging?: boolean;
@@ -16,4 +16,4 @@ export interface CarouselProps extends HTMLAttributes<HTMLDivElement> {
     name?: string;
     scrollToAlignment?: 'center';
 }
-export declare const Carousel: VFC<CarouselProps & RefAttributes<HTMLDivElement>>;
+export declare const Carousel: FC<CarouselProps & RefAttributes<HTMLDivElement>>;

package/dist/components/ControlsList.d.ts

@@ -1,6 +1,7 @@
-import { FC } from 'react';
+import { FC, ReactNode } from 'react';
 export interface ControlsListProps {
     alignItems?: 'left' | 'right' | 'center';
     spacing?: 'standard' | 'extra';
+    children?: ReactNode;
 }
 export declare const ControlsList: FC<ControlsListProps>;

package/dist/components/Dialog.d.ts

@@ -1,8 +1,9 @@
-import { CSSProperties, FC, RefAttributes } from 'react';
+import { CSSProperties, FC, ReactNode, RefAttributes } from 'react';
 import { FooterLegendProps } from './FooterLegend';
 export interface DialogCommonProps extends RefAttributes<HTMLDivElement> {
     style?: CSSProperties;
     className?: string;
+    children?: ReactNode;
 }
 export interface DialogButtonProps extends DialogCommonProps, FooterLegendProps {
     noFocusRing?: boolean;

package/dist/components/Dropdown.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode, VFC } from 'react';
+import { ReactNode, FC } from 'react';
 import { ItemProps } from './Item';
 export interface SingleDropdownOption {
     data: any;
@@ -28,7 +28,7 @@ export interface DropdownProps {
     renderButtonValue?(element: ReactNode): ReactNode;
     focusable?: boolean;
 }
-export declare const Dropdown: VFC<DropdownProps>;
+export declare const Dropdown: FC<DropdownProps>;
 export interface DropdownItemProps extends DropdownProps, ItemProps {
 }
-export declare const DropdownItem: VFC<DropdownItemProps>;
+export declare const DropdownItem: FC<DropdownItemProps>;

package/dist/components/Field.d.ts

@@ -1,6 +1,7 @@
 import { FC, ReactNode, RefAttributes } from 'react';
 import { FooterLegendProps } from './FooterLegend';
 export interface FieldProps extends FooterLegendProps {
+    children?: ReactNode;
     label?: ReactNode;
     bottomSeparator?: 'standard' | 'thick' | 'none';
     description?: ReactNode;

package/dist/components/Focusable.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes, ReactNode, RefAttributes, VFC } from 'react';
+import { HTMLAttributes, ReactNode, RefAttributes, FC } from 'react';
 import { FooterLegendProps } from './FooterLegend';
 export interface FocusableProps extends HTMLAttributes<HTMLDivElement>, FooterLegendProps {
     children: ReactNode;
@@ -9,4 +9,4 @@ export interface FocusableProps extends HTMLAttributes<HTMLDivElement>, FooterLe
     onActivate?: (e: CustomEvent) => void;
     onCancel?: (e: CustomEvent) => void;
 }
-export declare const Focusable: VFC<FocusableProps & RefAttributes<HTMLDivElement>>;
+export declare const Focusable: FC<FocusableProps & RefAttributes<HTMLDivElement>>;

package/dist/components/Item.d.ts

@@ -2,6 +2,7 @@ import { ReactNode } from 'react';
 export interface ItemProps {
     label?: ReactNode;
     description?: ReactNode;
+    children?: ReactNode;
     layout?: 'below' | 'inline';
     icon?: ReactNode;
     bottomSeparator?: 'standard' | 'thick' | 'none';

package/dist/components/ProgressBar.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode, VFC } from 'react';
+import { ReactNode, FC } from 'react';
 import { ItemProps } from './Item';
 export interface ProgressBarItemProps extends ItemProps {
     indeterminate?: boolean;
@@ -16,6 +16,6 @@ export interface ProgressBarWithInfoProps extends ProgressBarItemProps {
     sTimeRemaining?: ReactNode;
     sOperationText?: ReactNode;
 }
-export declare const ProgressBar: VFC<ProgressBarProps>;
-export declare const ProgressBarWithInfo: VFC<ProgressBarWithInfoProps>;
-export declare const ProgressBarItem: VFC<ProgressBarItemProps>;
+export declare const ProgressBar: FC<ProgressBarProps>;
+export declare const ProgressBarWithInfo: FC<ProgressBarWithInfoProps>;
+export declare const ProgressBarItem: FC<ProgressBarItemProps>;

package/dist/components/SidebarNavigation.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode, VFC } from 'react';
+import { ReactNode, FC } from 'react';
 export interface SidebarNavigationPage {
     title: ReactNode;
     content: ReactNode;
@@ -18,4 +18,4 @@ export interface SidebarNavigationProps {
     page?: string;
     onPageRequested?: (page: string) => void;
 }
-export declare const SidebarNavigation: VFC<SidebarNavigationProps>;
+export declare const SidebarNavigation: FC<SidebarNavigationProps>;

package/dist/components/TextField.d.ts

@@ -1,4 +1,4 @@
-import { ChangeEventHandler, HTMLAttributes, ReactNode, VFC } from 'react';
+import { ChangeEventHandler, HTMLAttributes, ReactNode, FC } from 'react';
 export interface TextFieldProps extends HTMLAttributes<HTMLInputElement> {
     label?: ReactNode;
     requiredLabel?: ReactNode;
@@ -19,4 +19,4 @@ export interface TextFieldProps extends HTMLAttributes<HTMLInputElement> {
     onChange?: ChangeEventHandler<HTMLInputElement>;
     value?: string;
 }
-export declare const TextField: VFC<TextFieldProps>;
+export declare const TextField: FC<TextFieldProps>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decky/ui",
-  "version": "4.0.1",
+  "version": "4.0.2",
   "description": "A library for interacting with the Steam frontend in Decky plugins and elsewhere.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -47,7 +47,7 @@
     "@semantic-release/changelog": "^6.0.1",
     "@semantic-release/git": "^10.0.1",
     "@types/jest": "^27.4.1",
-    "@types/react": "16.14.0",
+    "@types/react": "18.2.0",
     "@types/react-router": "5.1.18",
     "commitizen": "^4.2.4",
     "husky": "^8.0.1",

package/src/components/Carousel.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes, ReactNode, RefAttributes, VFC } from 'react';
+import { HTMLAttributes, ReactNode, RefAttributes, FC } from 'react';
 
 import { Export, findModuleExport } from '../webpack';
 
@@ -20,6 +20,6 @@ export interface CarouselProps extends HTMLAttributes<HTMLDivElement> {
   scrollToAlignment?: 'center';
 }
 
-export const Carousel = findModuleExport((e: Export) => e.render?.toString().includes('setFocusedColumn:')) as VFC<
+export const Carousel = findModuleExport((e: Export) => e.render?.toString().includes('setFocusedColumn:')) as FC<
   CarouselProps & RefAttributes<HTMLDivElement>
 >;

package/src/components/{ControlsList.tsx → ControlsList.ts}

@@ -1,10 +1,11 @@
-import { FC } from 'react';
+import { FC, ReactNode } from 'react';
 
 import { Export, findModuleExport } from '../webpack';
 
 export interface ControlsListProps {
   alignItems?: 'left' | 'right' | 'center';
   spacing?: 'standard' | 'extra';
+  children?: ReactNode;
 }
 
 export const ControlsList: FC<ControlsListProps> = findModuleExport(

package/src/components/{Dialog.tsx → Dialog.ts}

@@ -1,4 +1,4 @@
-import { CSSProperties, FC, RefAttributes } from 'react';
+import { CSSProperties, FC, ReactNode, RefAttributes } from 'react';
 
 import { CommonUIModule } from '../webpack';
 import { FooterLegendProps } from './FooterLegend';
@@ -6,6 +6,7 @@ import { FooterLegendProps } from './FooterLegend';
 export interface DialogCommonProps extends RefAttributes<HTMLDivElement> {
   style?: CSSProperties;
   className?: string;
+  children?: ReactNode;
 }
 
 export interface DialogButtonProps extends DialogCommonProps, FooterLegendProps {

package/src/components/{Dropdown.tsx → Dropdown.ts}

@@ -1,4 +1,4 @@
-import { ReactNode, VFC } from 'react';
+import { ReactNode, FC } from 'react';
 
 import { CommonUIModule } from '../webpack';
 import { ItemProps } from './Item';
@@ -40,10 +40,10 @@ export interface DropdownProps {
 
 export const Dropdown = Object.values(CommonUIModule).find(
   (mod: any) => mod?.prototype?.SetSelectedOption && mod?.prototype?.BuildMenu,
-) as VFC<DropdownProps>;
+) as FC<DropdownProps>;
 
 export interface DropdownItemProps extends DropdownProps, ItemProps {}
 
 export const DropdownItem = Object.values(CommonUIModule).find((mod: any) =>
   mod?.toString()?.includes('"dropDownControlRef","description"'),
-) as VFC<DropdownItemProps>;
+) as FC<DropdownItemProps>;

package/src/components/{Field.tsx → Field.ts}

@@ -4,6 +4,7 @@ import { Export, findModuleExport } from '../webpack';
 import { FooterLegendProps } from './FooterLegend';
 
 export interface FieldProps extends FooterLegendProps {
+  children?: ReactNode;
   label?: ReactNode;
   bottomSeparator?: 'standard' | 'thick' | 'none';
   description?: ReactNode;

package/src/components/{Focusable.tsx → Focusable.ts}

@@ -1,4 +1,4 @@
-import { HTMLAttributes, ReactNode, RefAttributes, VFC } from 'react';
+import { HTMLAttributes, ReactNode, RefAttributes, FC } from 'react';
 
 import { Export, findModuleExport } from '../webpack';
 import { FooterLegendProps } from './FooterLegend';
@@ -15,4 +15,4 @@ export interface FocusableProps extends HTMLAttributes<HTMLDivElement>, FooterLe
 
 export const Focusable = findModuleExport((e: Export) =>
   e?.render?.toString()?.includes('["flow-children","onActivate","onCancel","focusClassName",'),
-) as VFC<FocusableProps & RefAttributes<HTMLDivElement>>;
+) as FC<FocusableProps & RefAttributes<HTMLDivElement>>;

package/src/components/{Item.tsx → Item.ts}

@@ -3,6 +3,7 @@ import { ReactNode } from 'react';
 export interface ItemProps {
   label?: ReactNode;
   description?: ReactNode;
+  children?: ReactNode;
   layout?: 'below' | 'inline';
   icon?: ReactNode;
   bottomSeparator?: 'standard' | 'thick' | 'none';

package/src/components/{ProgressBar.tsx → ProgressBar.ts}

@@ -1,4 +1,4 @@
-import { ReactNode, VFC } from 'react';
+import { ReactNode, FC } from 'react';
 
 import { Export, findModuleExport } from '../webpack';
 import { ItemProps } from './Item';
@@ -24,12 +24,12 @@ export interface ProgressBarWithInfoProps extends ProgressBarItemProps {
 
 export const ProgressBar = findModuleExport((e: Export) =>
   e?.toString()?.includes('.ProgressBar,"standard"=='),
-) as VFC<ProgressBarProps>;
+) as FC<ProgressBarProps>;
 
 export const ProgressBarWithInfo = findModuleExport((e: Export) =>
   e?.toString()?.includes('.ProgressBarFieldStatus},'),
-) as VFC<ProgressBarWithInfoProps>;
+) as FC<ProgressBarWithInfoProps>;
 
 export const ProgressBarItem = findModuleExport((e: Export) =>
   e?.toString()?.includes('"indeterminate","nTransitionSec"'),
-) as VFC<ProgressBarItemProps>;
+) as FC<ProgressBarItemProps>;

package/src/components/{SidebarNavigation.tsx → SidebarNavigation.ts}

@@ -1,4 +1,4 @@
-import { ReactNode, VFC } from 'react';
+import { ReactNode, FC } from 'react';
 
 import { Export, findModuleExport } from '../webpack';
 
@@ -25,4 +25,4 @@ export interface SidebarNavigationProps {
 
 export const SidebarNavigation = findModuleExport((e: Export) =>
   e?.toString()?.includes('"disableRouteReporting"'),
-) as VFC<SidebarNavigationProps>;
+) as FC<SidebarNavigationProps>;

package/src/components/{TextField.tsx → TextField.ts}

@@ -1,4 +1,4 @@
-import { ChangeEventHandler, HTMLAttributes, ReactNode, VFC } from 'react';
+import { ChangeEventHandler, HTMLAttributes, ReactNode, FC } from 'react';
 
 import { CommonUIModule, Module } from '../webpack';
 
@@ -25,4 +25,4 @@ export interface TextFieldProps extends HTMLAttributes<HTMLInputElement> {
 
 export const TextField = Object.values(CommonUIModule).find(
   (mod: Module) => mod?.validateUrl && mod?.validateEmail,
-) as VFC<TextFieldProps>;
+) as FC<TextFieldProps>;

package/src/custom-hooks/{useQuickAccessVisible.tsx → useQuickAccessVisible.ts}

@@ -15,10 +15,10 @@ function getQuickAccessWindow(): Window | null {
  * @returns `true` if quick access menu is visible and `false` otherwise.
  *
  * @example
- * import { VFC, useEffect } from "react";
+ * import { FC, useEffect } from "react";
  * import { useQuickAccessVisible } from "decky-frontend-lib";
  *
- * export const PluginPanelView: VFC<{}> = ({ }) => {
+ * export const PluginPanelView: FC<{}> = ({ }) => {
  *   const isVisible = useQuickAccessVisible();
  *
  *   useEffect(() => {

package/dist/plugin.d.ts

@@ -1,68 +0,0 @@
-import type { ComponentType, ReactNode } from 'react';
-import { RouteProps } from 'react-router';
-export interface Plugin {
-    title: JSX.Element;
-    icon: JSX.Element;
-    content?: JSX.Element;
-    onDismount?(): void;
-    alwaysRender?: boolean;
-}
-interface ServerResponseSuccess<TRes> {
-    success: true;
-    result: TRes;
-}
-interface ServerResponseError {
-    success: false;
-    result: string;
-}
-export type ServerResponse<TRes> = ServerResponseSuccess<TRes> | ServerResponseError;
-export type RoutePatch = (route: RouteProps) => RouteProps;
-export interface RouterHook {
-    addRoute(path: string, component: ComponentType, props?: Omit<RouteProps, 'path' | 'children'>): void;
-    addPatch(path: string, patch: RoutePatch): RoutePatch;
-    addGlobalComponent(name: string, component: ComponentType): void;
-    removeRoute(path: string): void;
-    removePatch(path: string, patch: RoutePatch): void;
-    removeGlobalComponent(name: string): void;
-}
-export interface ToastData {
-    title: ReactNode;
-    body: ReactNode;
-    onClick?: () => void;
-    logo?: ReactNode;
-    icon?: ReactNode;
-    className?: string;
-    contentClassName?: string;
-    duration?: number;
-    critical?: boolean;
-    eType?: number;
-    sound?: number;
-    playSound?: boolean;
-    showToast?: boolean;
-}
-export interface Toaster {
-    toast(toast: ToastData): void;
-}
-export interface FilePickerRes {
-    path: string;
-    realpath: string;
-}
-export declare const enum FileSelectionType {
-    FILE = 0,
-    FOLDER = 1
-}
-export interface ServerAPI {
-    routerHook: RouterHook;
-    toaster: Toaster;
-    openFilePicker(startPath: string, includeFiles?: boolean, regex?: RegExp): Promise<FilePickerRes>;
-    openFilePickerV2(select: FileSelectionType, startPath: string, includeFiles?: boolean, includeFolders?: boolean, filter?: RegExp | ((file: File) => boolean), extensions?: string[], showHiddenFiles?: boolean, allowAllFiles?: boolean, max?: number): Promise<FilePickerRes>;
-    callPluginMethod<TArgs = {}, TRes = {}>(methodName: string, args: TArgs): Promise<ServerResponse<TRes>>;
-    callServerMethod<TArgs = {}, TRes = {}>(methodName: string, args: TArgs): Promise<ServerResponse<TRes>>;
-    fetchNoCors<TRes = {}>(url: RequestInfo, request?: RequestInit): Promise<ServerResponse<TRes>>;
-    executeInTab(tab: string, runAsync: boolean, code: string): Promise<unknown>;
-    injectCssIntoTab<TRes = string>(tab: string, style: string): Promise<ServerResponse<TRes>>;
-    removeCssFromTab(tab: string, cssId: string): Promise<unknown>;
-}
-type DefinePluginFn = (serverAPI: ServerAPI) => Plugin;
-export declare const definePlugin: (fn: DefinePluginFn) => DefinePluginFn;
-export {};

package/dist/plugin.js

@@ -1,5 +0,0 @@
-export const definePlugin = (fn) => {
-    return (...args) => {
-        return fn(...args);
-    };
-};