chore(release): 3.5.1 [CI SKIP]

CHANGELOG.md

@@ -1,3 +1,31 @@
+## [3.5.1](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v3.5.0...v3.5.1) (2022-10-08)
+
+
+### Bug Fixes
+
+* **Tabs:** actually export it lmao ([0e0e0d2](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/0e0e0d204adc8d888f05e98edb6c1a1a171d00bb))
+
+# [3.5.0](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v3.4.0...v3.5.0) (2022-10-08)
+
+
+### Features
+
+* **Tabs:** initial tabs component, props, docs ([abbd3cd](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/abbd3cddae24039cbc9b7d955924431e8fbacf94))
+
+# [3.4.0](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v3.3.5...v3.4.0) (2022-10-06)
+
+
+### Features
+
+* **hooks:** Added useParams hook ([#36](https://github.com/SteamDeckHomebrew/decky-frontend-lib/issues/36)) ([e2920dd](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/e2920dd91e81d915a2319280d8473df71a4e4232))
+
+## [3.3.5](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v3.3.4...v3.3.5) (2022-10-02)
+
+
+### Bug Fixes
+
+* **docs:** set categorizeByGroup to true ([0f205e8](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/0f205e891694e2cee211b0c2db74a6dda2432507))
+
 ## [3.3.4](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v3.3.3...v3.3.4) (2022-10-02)
 
 

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "decky-frontend-lib",
-  "version": "3.3.4",
+  "version": "3.5.1",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "decky-frontend-lib",
-      "version": "3.3.4",
+      "version": "3.5.1",
       "license": "LGPL-2.1",
       "dependencies": {
         "minimist": "^1.2.6"

package.json

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

src/deck-components/Tabs.tsx

@@ -0,0 +1,47 @@
+import { FC, ReactNode } from 'react';
+import { findModule } from '../webpack';
+import { FooterLegendProps } from './FooterLegend';
+
+/**
+ * Individual tab objects for the Tabs component
+ * 
+ * @property id ID of this tab, can be used with activeTab to auto-focus a given tab
+ * @property title Title shown in the header bar
+ * @property renderTabAddon Return a {@link ReactNode} to render it next to the tab title, i.e. the counts for each tab on the Media page
+ * @property content Content of the tab
+ * @property footer Sets up button handlers and labels
+ */
+export interface Tab {
+    id: string;
+    title: string;
+    renderTabAddon?: () => ReactNode;
+    content: ReactNode;
+    footer?: FooterLegendProps;
+}
+
+/**
+ * Props for the {@link Tabs}
+ * 
+ * @property tabs array of {@link Tab}
+ * @property activeTab tab to automatically focus, {@link Tab.id}
+ * @property onShowTab Currently unknown.
+ * @property autoFocusContents Whether to automatically focus the tab contents or not.
+ * @property footer Sets up button handlers and labels
+ */
+export interface TabsProps {
+    tabs: Tab[];
+    activeTab?: string;
+    onShowTab?: (...args: unknown[]) => void;
+    autoFocusContents?: boolean;
+}
+
+/**
+ * Tabs component as used in the library and media tabs. See {@link TabsProps}
+ */
+export const Tabs = Object.values(findModule((m) => {
+    if (typeof m !== 'object') return false;
+    for (let prop in m) {
+        if (m[prop]?.Unbleed) return true;
+    }
+    return false;
+})).find((x: any) => x?.type?.toString()?.includes("((function(){")) as FC<TabsProps>;

src/deck-components/index.ts

@@ -17,6 +17,7 @@ export * from './SliderField';
 export * from './Spinner';
 export * from './static-classes';
 export * from './SteamSpinner';
+export * from './Tabs';
 export * from './TextField';
 export * from './Toggle';
 export * from './ToggleField';

src/deck-hooks/index.ts

@@ -0,0 +1 @@
+export * from './useParams'

src/deck-hooks/useParams.ts

@@ -0,0 +1,15 @@
+import { ReactRouter } from "../webpack";
+
+/**
+ * Get the current params from ReactRouter
+ * 
+ * @returns an object with the current ReactRouter params
+ * 
+ * @example
+ * import { useParams } from "decky-frontend-lib";
+ * 
+ * const { appid } = useParams<{ appid: string }>()
+ */
+export const useParams = Object.values(ReactRouter).find((val) =>
+  /return (\w)\?\1\.params:{}/.test(`${val}`)
+) as <T>() => T

src/index.ts

@@ -2,6 +2,7 @@
 export * from './custom-components';
 export * from './custom-hooks';
 export * from './deck-components';
+export * from './deck-hooks'
 export * from './plugin';
 export * from './webpack';
 export * from './utils';

typedoc.json

@@ -1,5 +1,5 @@
 {
     "githubPages": false,
-    "categorizeByGroup": true,
+    "categorizeByGroup": false,
     "excludeExternals": true
 }