[SelectUnstyled] Improve exported types

packages/mui-base/src/ListboxUnstyled/types.ts

@@ -168,7 +168,5 @@ export type UseListboxProps<TOption> =
 export interface OptionState {
   disabled: boolean;
   highlighted: boolean;
-  index: number;
-  // option: TOption;
   selected: boolean;
 }

packages/mui-base/src/ListboxUnstyled/useListbox.ts

@@ -163,8 +163,6 @@ export default function useListbox<TOption>(props: UseListboxProps<TOption>) {
     const disabled = isOptionDisabled(option, index);
 
     return {
-      index,
-      option,
       selected,
       disabled,
       highlighted: highlightedIndex === index,

packages/mui-base/src/OptionUnstyled/OptionUnstyled.tsx

@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 import { unstable_useForkRef as useForkRef } from '@mui/utils';
 import { OptionState } from '../ListboxUnstyled';
 import composeClasses from '../composeClasses';
-import OptionUnstyledProps from './OptionUnstyledProps';
+import OptionUnstyledProps, { OptionUnstyledOwnerState } from './OptionUnstyledProps';
 import { SelectUnstyledContext } from '../SelectUnstyled/SelectUnstyledContext';
 import { getOptionUnstyledUtilityClass } from './optionUnstyledClasses';
 import appendOwnerState from '../utils/appendOwnerState';
@@ -53,7 +53,7 @@ const OptionUnstyled = React.forwardRef(function OptionUnstyled<TValue>(
   const optionState = selectContext.getOptionState(selectOption);
   const optionProps = selectContext.getOptionProps(selectOption);
 
-  const ownerState = {
+  const ownerState: OptionUnstyledOwnerState<TValue> = {
     ...props,
     ...optionState,
   };

packages/mui-base/src/OptionUnstyled/OptionUnstyledProps.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { OptionState } from '../ListboxUnstyled';
 
 export interface OptionUnstyledComponentsPropsOverrides {}
 
@@ -37,3 +38,5 @@ export default interface OptionUnstyledProps<TValue> {
     root?: React.ComponentPropsWithRef<'li'> & OptionUnstyledComponentsPropsOverrides;
   };
 }
+
+export type OptionUnstyledOwnerState<TValue> = OptionUnstyledProps<TValue> & OptionState;

packages/mui-base/src/SelectUnstyled/SelectUnstyled.spec.tsx

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { SelectUnstyled } from '@mui/base';
+
+const SelectUnstyledComponentsPropsOverridesTest = (
+  <SelectUnstyled
+    componentsProps={{
+      root: {
+        // @ts-expect-error - requires module augmentation
+        size: 'red',
+        className: 'test',
+      },
+      popper: {
+        className: 'popper',
+        disablePortal: true,
+      },
+      listbox: {
+        className: 'listbox',
+        onMouseOver: () => {},
+      },
+    }}
+  />
+);

packages/mui-base/src/SelectUnstyled/SelectUnstyledProps.ts

@@ -29,7 +29,7 @@ export interface SelectUnstyledCommonProps {
   componentsProps?: {
     root?: React.ComponentPropsWithRef<'button'> & SelectUnstyledComponentsPropsOverrides;
     listbox?: React.ComponentPropsWithRef<'ul'> & SelectUnstyledComponentsPropsOverrides;
-    popper?: React.ComponentPropsWithRef<typeof PopperUnstyled> &
+    popper?: Partial<React.ComponentPropsWithRef<typeof PopperUnstyled>> &
       SelectUnstyledComponentsPropsOverrides;
   };
   /**

packages/mui-base/test/typescript/moduleAugmentation/selectUnstyledComponentsProps.spec.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { SelectUnstyled } from '@mui/base';
+
+declare module '@mui/base' {
+  interface SelectUnstyledComponentsPropsOverrides {
+    variant?: 'one' | 'two';
+  }
+}
+
+<SelectUnstyled componentsProps={{ root: { variant: 'one' } }} />;
+
+// @ts-expect-error unknown variant
+<SelectUnstyled componentsProps={{ root: { variant: 'three' } }} />;

packages/mui-base/test/typescript/moduleAugmentation/selectUnstyledComponentsProps.tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": "../../../../../tsconfig",
+  "files": ["selectUnstyledComponentsProps.spec.tsx"]
+}