From c46bec6382d0ba23f3a24e5e8b196b35d047db60 Mon Sep 17 00:00:00 2001
From: Gildas Garcia <1122076+djhi@users.noreply.github.com>
Date: Wed, 21 Jul 2021 17:34:46 +0200
Subject: [PATCH] Fix TS definition of SelectInput classes

---
 .../src/input/ResettableTextField.tsx         | 49 ++++++++++---------
 .../src/input/SelectInput.tsx                 |  8 ++-
 2 files changed, 32 insertions(+), 25 deletions(-)

diff --git a/packages/ra-ui-materialui/src/input/ResettableTextField.tsx b/packages/ra-ui-materialui/src/input/ResettableTextField.tsx
index fd114f8a1da..5f3afb02669 100644
--- a/packages/ra-ui-materialui/src/input/ResettableTextField.tsx
+++ b/packages/ra-ui-materialui/src/input/ResettableTextField.tsx
@@ -7,11 +7,13 @@ import {
     IconButton,
     TextField as MuiTextField,
     TextFieldProps,
+    Theme,
 } from '@material-ui/core';
 import { makeStyles } from '@material-ui/core/styles';
 import ClearIcon from '@material-ui/icons/Clear';
 import { InputProps, useTranslate } from 'ra-core';
 import { ClassesOverride } from '../types';
+import { Styles } from '@material-ui/styles';
 
 /**
  * An override of the default Material-UI TextField which is resettable
@@ -170,30 +172,31 @@ function ResettableTextField(props: ResettableTextFieldProps) {
     );
 }
 
-const useStyles = makeStyles(
-    {
-        clearIcon: {
-            height: 16,
-            width: 0,
-        },
-        visibleClearIcon: {
-            width: 16,
-        },
-        clearButton: {
-            height: 24,
-            width: 24,
-            padding: 0,
-        },
-        selectAdornment: {
-            position: 'absolute',
-            right: 24,
-        },
-        inputAdornedEnd: {
-            paddingRight: 0,
-        },
+export const resettableStyles: Styles<Theme, ResettableTextFieldProps> = {
+    clearIcon: {
+        height: 16,
+        width: 0,
+    },
+    visibleClearIcon: {
+        width: 16,
     },
-    { name: 'RaResettableTextField' }
-);
+    clearButton: {
+        height: 24,
+        width: 24,
+        padding: 0,
+    },
+    selectAdornment: {
+        position: 'absolute',
+        right: 24,
+    },
+    inputAdornedEnd: {
+        paddingRight: 0,
+    },
+};
+
+const useStyles = makeStyles(resettableStyles, {
+    name: 'RaResettableTextField',
+});
 
 const handleMouseDownClearButton = event => {
     event.preventDefault();
diff --git a/packages/ra-ui-materialui/src/input/SelectInput.tsx b/packages/ra-ui-materialui/src/input/SelectInput.tsx
index 17a1ed07ce4..5e9cf110a48 100644
--- a/packages/ra-ui-materialui/src/input/SelectInput.tsx
+++ b/packages/ra-ui-materialui/src/input/SelectInput.tsx
@@ -14,7 +14,7 @@ import {
     warning,
 } from 'ra-core';
 
-import ResettableTextField from './ResettableTextField';
+import ResettableTextField, { resettableStyles } from './ResettableTextField';
 import InputHelperText from './InputHelperText';
 import sanitizeInputRestProps from './sanitizeInputRestProps';
 import Labeled from './Labeled';
@@ -23,6 +23,7 @@ import {
     useSupportCreateSuggestion,
     SupportCreateSuggestionOptions,
 } from './useSupportCreateSuggestion';
+import { ClassesOverride } from '../types';
 
 /**
  * An Input component for a select box, using an array of objects for the options
@@ -350,6 +351,7 @@ const sanitizeRestProps = ({
 
 const useStyles = makeStyles(
     theme => ({
+        ...resettableStyles,
         input: {
             minWidth: theme.spacing(20),
         },
@@ -360,4 +362,6 @@ const useStyles = makeStyles(
 export interface SelectInputProps
     extends ChoicesInputProps<TextFieldProps>,
         Omit<SupportCreateSuggestionOptions, 'handleChange'>,
-        Omit<TextFieldProps, 'label' | 'helperText'> {}
+        Omit<TextFieldProps, 'label' | 'helperText' | 'classes'> {
+    classes?: ClassesOverride<typeof useStyles>;
+}