change implementation

Author: sai6855

packages/mui-material/src/Select/Select.d.ts

@@ -177,15 +177,10 @@ export interface OutlinedSelectProps extends Omit<OutlinedInputProps, 'value' |
 
 export type SelectVariants = 'outlined' | 'standard' | 'filled';
 
-export type SelectProps<
-  Value = unknown,
-  Variant extends SelectVariants = SelectVariants,
-> = BaseSelectProps<Value> &
-  (Variant extends 'filled'
-    ? FilledSelectProps
-    : Variant extends 'standard'
-      ? StandardSelectProps
-      : OutlinedSelectProps);
+export type SelectProps<Value = unknown> =
+  | (FilledSelectProps & BaseSelectProps<Value>)
+  | (StandardSelectProps & BaseSelectProps<Value>)
+  | (OutlinedSelectProps & BaseSelectProps<Value>);
 
 /**
  *
@@ -198,14 +193,8 @@ export type SelectProps<
  * - [Select API](https://mui.com/material-ui/api/select/)
  * - inherits [OutlinedInput API](https://mui.com/material-ui/api/outlined-input/)
  */
-export default function Select<Value = unknown, Variant extends SelectVariants = 'outlined'>(
-  props: {
-    /**
-     * The variant to use.
-     * @default 'outlined'
-     */
-    variant?: Variant;
-  } & SelectProps<Value, Variant>,
+export default function Select<Value = unknown>(
+  props: SelectProps<Value>,
 ): JSX.Element & {
   muiName: string;
 };

packages/mui-material/src/Select/Select.spec.tsx

@@ -76,26 +76,19 @@ function genericValueTest() {
     }}
   />;
 
-  // @ts-expect-error
-  <Select<number, 'filled'> />;
-  // @ts-expect-error
-  <Select<number, 'standard'> />;
-  // @ts-expect-error
-  <Select<number, 'standard'> variant="filled" />;
-  // @ts-expect-error
-  <Select<number, 'filled'> variant="standard" />;
-
-  <Select<number, 'outlined'> />;
-
-  <Select<number, 'filled'> variant="filled" />;
-  <Select<number, 'outlined'> variant="outlined" />;
-  <Select<number, 'standard'> variant="standard" />;
-
   <Select variant="filled" />;
   <Select variant="standard" />;
   <Select variant="outlined" />;
   <Select />;
 
+  <Select variant="filled" hiddenLabel />;
+  // @ts-expect-error hiddenLabel is not present in standard variant
+  <Select variant="standard" hiddenLabel />;
+  // @ts-expect-error hiddenLabel is not present in outlined variant
+  <Select variant="outlined" hiddenLabel />;
+  // @ts-expect-error hiddenLabel is not present in outlined variant
+  <Select hiddenLabel />;
+
   const defaultProps: SelectProps<number> = {};
   const outlinedProps: SelectProps<number> = {
     variant: 'outlined',
@@ -113,13 +106,7 @@ function genericValueTest() {
   <Select {...standardProps} />;
   <Select<number> {...outlinedProps} />;
   <Select<number> {...defaultProps} />;
-  <Select<number, 'standard'> {...standardProps} />;
-  // @ts-expect-error variant type mismatch
   <Select<number> {...filledProps} />;
-  // @ts-expect-error variant type mismatch
-  <Select<number, 'outlined'> {...filledProps} />;
-  // @ts-expect-error variant type mismatch
-  <Select<number, 'standard'> {...filledProps} />;
 
   const rawDefaultProps: SelectProps = {};
   const rawOutlinedProps: SelectProps = {
@@ -140,6 +127,23 @@ function genericValueTest() {
   <Select {...filledProps} hiddenLabel />;
   // @ts-expect-error hiddenLabel is not present in standard variant
   <Select {...standardProps} hiddenLabel />;
+
+  interface OtherProps {
+    otherProp?: number;
+  }
+
+  const SelectWrapper1 = <Value = unknown,>(props: SelectProps<Value> & OtherProps) => {
+    const { otherProp, ...materialSelectProps } = props;
+
+    return (
+      // how to solve this:
+      <Select<Value> {...materialSelectProps} />
+    );
+  };
+
+  <SelectWrapper1 />;
+  <SelectWrapper1<number> variant="filled" hiddenLabel />;
+  <SelectWrapper1 variant="filled" hiddenLabel />;
 }
 
 type Options<T> = { text: string; value: T } | T;