[useTabs] Add explicit return type

docs/pages/base/api/use-tabs.json

@@ -36,7 +36,15 @@
       }
     }
   },
-  "returnValue": {},
+  "returnValue": {
+    "tabsContextValue": {
+      "type": {
+        "name": "{\n  /**\n   * Id used as a prefix for the current Tabs.\n   */\n  idPrefix: string | undefined\n  /**\n   * The value of the currently selected `Tab`.\n   * If you don't want any selected `Tab`, you can set this prop to `false`.\n   */\n  value: string | number | false\n  /**\n   * Callback for setting new value.\n   */\n  onSelected: (e: React.SyntheticEvent, newValue: string | number | false) => void\n  /**\n   * The component orientation (layout flow direction).\n   */\n  orientation?: 'horizontal' | 'vertical'\n  /**\n   * The direction of the text.\n   */\n  direction: 'ltr' | 'rtl' | undefined\n  /**\n   * If `true` the selected tab changes on focus. Otherwise it only\n   * changes on activation.\n   */\n  selectionFollowsFocus: boolean | undefined\n}",
+        "description": ""
+      },
+      "required": true
+    }
+  },
   "name": "useTabs",
   "filename": "/packages/mui-base/src/TabsUnstyled/useTabs.ts",
   "demos": "<ul><li><a href=\"/base/react-tabs/#hooks\">Unstyled Tabs</a></li></ul>"

packages/mui-base/src/TabsUnstyled/index.ts

@@ -9,4 +9,5 @@ export * from './tabsUnstyledClasses';
 export * from './TabsUnstyled.types';
 
 export { default as useTabs } from './useTabs';
-export * from './useTabs';
+
+export * from './useTabs.types';

packages/mui-base/src/TabsUnstyled/useTabs.ts

@@ -1,36 +1,7 @@
 import * as React from 'react';
 import { unstable_useControlled as useControlled, unstable_useId as useId } from '@mui/utils';
+import { UseTabsParameters, UseTabsReturnValue } from './useTabs.types';
 
-export interface UseTabsParameters {
-  /**
-   * The value of the currently selected `Tab`.
-   * If you don't want any selected `Tab`, you can set this prop to `false`.
-   */
-  value?: string | number | false;
-  /**
-   * The default value. Use when the component is not controlled.
-   */
-  defaultValue?: string | number | false;
-  /**
-   * The component orientation (layout flow direction).
-   * @default 'horizontal'
-   */
-  orientation?: 'horizontal' | 'vertical';
-  /**
-   * The direction of the text.
-   * @default 'ltr'
-   */
-  direction?: 'ltr' | 'rtl';
-  /**
-   * Callback invoked when new value is being set.
-   */
-  onChange?: (event: React.SyntheticEvent, value: number | string | boolean) => void;
-  /**
-   * If `true` the selected tab changes on focus. Otherwise it only
-   * changes on activation.
-   */
-  selectionFollowsFocus?: boolean;
-}
 /**
  *
  * Demos:
@@ -41,7 +12,7 @@ export interface UseTabsParameters {
  *
  * - [useTabs API](https://mui.com/base/api/use-tabs/)
  */
-function useTabs(parameters: UseTabsParameters) {
+function useTabs(parameters: UseTabsParameters): UseTabsReturnValue {
   const {
     value: valueProp,
     defaultValue,

packages/mui-base/src/TabsUnstyled/useTabs.types.ts

@@ -0,0 +1,61 @@
+export interface UseTabsParameters {
+  /**
+   * The value of the currently selected `Tab`.
+   * If you don't want any selected `Tab`, you can set this prop to `false`.
+   */
+  value?: string | number | false;
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue?: string | number | false;
+  /**
+   * The component orientation (layout flow direction).
+   * @default 'horizontal'
+   */
+  orientation?: 'horizontal' | 'vertical';
+  /**
+   * The direction of the text.
+   * @default 'ltr'
+   */
+  direction?: 'ltr' | 'rtl';
+  /**
+   * Callback invoked when new value is being set.
+   */
+  onChange?: (event: React.SyntheticEvent, value: number | string | boolean) => void;
+  /**
+   * If `true` the selected tab changes on focus. Otherwise it only
+   * changes on activation.
+   */
+  selectionFollowsFocus?: boolean;
+}
+
+export interface UseTabsReturnValue {
+  tabsContextValue: {
+    /**
+     * Id used as a prefix for the current Tabs.
+     */
+    idPrefix: string | undefined;
+    /**
+     * The value of the currently selected `Tab`.
+     * If you don't want any selected `Tab`, you can set this prop to `false`.
+     */
+    value: string | number | false;
+    /**
+     * Callback for setting new value.
+     */
+    onSelected: (e: React.SyntheticEvent, newValue: string | number | false) => void;
+    /**
+     * The component orientation (layout flow direction).
+     */
+    orientation?: 'horizontal' | 'vertical';
+    /**
+     * The direction of the text.
+     */
+    direction: 'ltr' | 'rtl' | undefined;
+    /**
+     * If `true` the selected tab changes on focus. Otherwise it only
+     * changes on activation.
+     */
+    selectionFollowsFocus: boolean | undefined;
+  };
+}