From 9713d33afe9a9716a202134e869ed5fc7fbdd5a6 Mon Sep 17 00:00:00 2001
From: MUI bot <2109932+Janpot@users.noreply.github.com>
Date: Thu, 28 Sep 2023 17:47:06 +0200
Subject: [PATCH 1/5] Labels are not necessarily strings

---
 packages/toolpad-components/src/Autocomplete.tsx | 1 -
 packages/toolpad-components/src/DatePicker.tsx   | 1 -
 packages/toolpad-components/src/FilePicker.tsx   | 1 -
 packages/toolpad-components/src/Form.tsx         | 4 +---
 packages/toolpad-components/src/Select.tsx       | 1 -
 packages/toolpad-components/src/TextField.tsx    | 1 -
 6 files changed, 1 insertion(+), 8 deletions(-)

diff --git a/packages/toolpad-components/src/Autocomplete.tsx b/packages/toolpad-components/src/Autocomplete.tsx
index fc1376c41dc..928b656790f 100644
--- a/packages/toolpad-components/src/Autocomplete.tsx
+++ b/packages/toolpad-components/src/Autocomplete.tsx
@@ -45,7 +45,6 @@ function Autocomplete({
 
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<string | null>({
     name: rest.name,
-    label,
     value,
     onChange,
     emptyValue: null,
diff --git a/packages/toolpad-components/src/DatePicker.tsx b/packages/toolpad-components/src/DatePicker.tsx
index cbad076e974..ef307bdbbbd 100644
--- a/packages/toolpad-components/src/DatePicker.tsx
+++ b/packages/toolpad-components/src/DatePicker.tsx
@@ -91,7 +91,6 @@ function DatePicker({
 }: DatePickerProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<string | null>({
     name: rest.name,
-    label: rest.label as string,
     value: valueProp,
     onChange,
     defaultValue: defaultValueProp,
diff --git a/packages/toolpad-components/src/FilePicker.tsx b/packages/toolpad-components/src/FilePicker.tsx
index 2cbcee49635..8ab4a2410ed 100644
--- a/packages/toolpad-components/src/FilePicker.tsx
+++ b/packages/toolpad-components/src/FilePicker.tsx
@@ -49,7 +49,6 @@ function FilePicker({
 }: FilePickerProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<FullFile[]>({
     name: rest.name,
-    label: rest.label as string,
     value,
     onChange,
     validationProps: { isRequired, isInvalid },
diff --git a/packages/toolpad-components/src/Form.tsx b/packages/toolpad-components/src/Form.tsx
index feb5e26efcc..860d1a17112 100644
--- a/packages/toolpad-components/src/Form.tsx
+++ b/packages/toolpad-components/src/Form.tsx
@@ -184,7 +184,6 @@ export interface FormInputComponentProps {
 
 interface UseFormInputInput<V> {
   name: string;
-  label?: string;
   value?: V;
   onChange: (newValue: V) => void;
   emptyValue?: V;
@@ -202,7 +201,6 @@ interface UseFormInputPayload<V> {
 
 export function useFormInput<V>({
   name,
-  label,
   value,
   onChange,
   emptyValue,
@@ -219,7 +217,7 @@ export function useFormInput<V>({
 
   const formInputName = fieldName || fallbackName;
 
-  const formInputDisplayName = label || name || 'Field';
+  const formInputDisplayName: string = name || 'Field';
 
   const formInputError = formInputName
     ? (form?.formState.errors[formInputName] as FieldError)
diff --git a/packages/toolpad-components/src/Select.tsx b/packages/toolpad-components/src/Select.tsx
index 12c298f68be..33b7ed4bcea 100644
--- a/packages/toolpad-components/src/Select.tsx
+++ b/packages/toolpad-components/src/Select.tsx
@@ -34,7 +34,6 @@ function Select({
 }: SelectProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<string>({
     name: rest.name,
-    label: rest.label as string,
     value,
     onChange,
     defaultValue,
diff --git a/packages/toolpad-components/src/TextField.tsx b/packages/toolpad-components/src/TextField.tsx
index dd498f9a128..4e5d933b316 100644
--- a/packages/toolpad-components/src/TextField.tsx
+++ b/packages/toolpad-components/src/TextField.tsx
@@ -34,7 +34,6 @@ function TextField({
 }: TextFieldProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<string>({
     name: rest.name,
-    label: rest.label as string,
     value,
     onChange,
     emptyValue: '',

From f6aa4dce07d89a316d962b33d4e92ffca1135a76 Mon Sep 17 00:00:00 2001
From: MUI bot <2109932+Janpot@users.noreply.github.com>
Date: Thu, 28 Sep 2023 17:50:40 +0200
Subject: [PATCH 2/5] Revert "Labels are not necessarily strings"

This reverts commit 9713d33afe9a9716a202134e869ed5fc7fbdd5a6.
---
 packages/toolpad-components/src/Autocomplete.tsx | 1 +
 packages/toolpad-components/src/DatePicker.tsx   | 1 +
 packages/toolpad-components/src/FilePicker.tsx   | 1 +
 packages/toolpad-components/src/Form.tsx         | 4 +++-
 packages/toolpad-components/src/Select.tsx       | 1 +
 packages/toolpad-components/src/TextField.tsx    | 1 +
 6 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/toolpad-components/src/Autocomplete.tsx b/packages/toolpad-components/src/Autocomplete.tsx
index 928b656790f..fc1376c41dc 100644
--- a/packages/toolpad-components/src/Autocomplete.tsx
+++ b/packages/toolpad-components/src/Autocomplete.tsx
@@ -45,6 +45,7 @@ function Autocomplete({
 
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<string | null>({
     name: rest.name,
+    label,
     value,
     onChange,
     emptyValue: null,
diff --git a/packages/toolpad-components/src/DatePicker.tsx b/packages/toolpad-components/src/DatePicker.tsx
index ef307bdbbbd..cbad076e974 100644
--- a/packages/toolpad-components/src/DatePicker.tsx
+++ b/packages/toolpad-components/src/DatePicker.tsx
@@ -91,6 +91,7 @@ function DatePicker({
 }: DatePickerProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<string | null>({
     name: rest.name,
+    label: rest.label as string,
     value: valueProp,
     onChange,
     defaultValue: defaultValueProp,
diff --git a/packages/toolpad-components/src/FilePicker.tsx b/packages/toolpad-components/src/FilePicker.tsx
index 8ab4a2410ed..2cbcee49635 100644
--- a/packages/toolpad-components/src/FilePicker.tsx
+++ b/packages/toolpad-components/src/FilePicker.tsx
@@ -49,6 +49,7 @@ function FilePicker({
 }: FilePickerProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<FullFile[]>({
     name: rest.name,
+    label: rest.label as string,
     value,
     onChange,
     validationProps: { isRequired, isInvalid },
diff --git a/packages/toolpad-components/src/Form.tsx b/packages/toolpad-components/src/Form.tsx
index 860d1a17112..feb5e26efcc 100644
--- a/packages/toolpad-components/src/Form.tsx
+++ b/packages/toolpad-components/src/Form.tsx
@@ -184,6 +184,7 @@ export interface FormInputComponentProps {
 
 interface UseFormInputInput<V> {
   name: string;
+  label?: string;
   value?: V;
   onChange: (newValue: V) => void;
   emptyValue?: V;
@@ -201,6 +202,7 @@ interface UseFormInputPayload<V> {
 
 export function useFormInput<V>({
   name,
+  label,
   value,
   onChange,
   emptyValue,
@@ -217,7 +219,7 @@ export function useFormInput<V>({
 
   const formInputName = fieldName || fallbackName;
 
-  const formInputDisplayName: string = name || 'Field';
+  const formInputDisplayName = label || name || 'Field';
 
   const formInputError = formInputName
     ? (form?.formState.errors[formInputName] as FieldError)
diff --git a/packages/toolpad-components/src/Select.tsx b/packages/toolpad-components/src/Select.tsx
index 33b7ed4bcea..12c298f68be 100644
--- a/packages/toolpad-components/src/Select.tsx
+++ b/packages/toolpad-components/src/Select.tsx
@@ -34,6 +34,7 @@ function Select({
 }: SelectProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<string>({
     name: rest.name,
+    label: rest.label as string,
     value,
     onChange,
     defaultValue,
diff --git a/packages/toolpad-components/src/TextField.tsx b/packages/toolpad-components/src/TextField.tsx
index 4e5d933b316..dd498f9a128 100644
--- a/packages/toolpad-components/src/TextField.tsx
+++ b/packages/toolpad-components/src/TextField.tsx
@@ -34,6 +34,7 @@ function TextField({
 }: TextFieldProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<string>({
     name: rest.name,
+    label: rest.label as string,
     value,
     onChange,
     emptyValue: '',

From 1b605bf2708698fcda59633ca3bb5549a1666a25 Mon Sep 17 00:00:00 2001
From: MUI bot <2109932+Janpot@users.noreply.github.com>
Date: Thu, 28 Sep 2023 17:52:13 +0200
Subject: [PATCH 3/5] fix

---
 packages/toolpad-components/src/Autocomplete.tsx | 2 +-
 packages/toolpad-components/src/Checkbox.tsx     | 3 ++-
 packages/toolpad-components/src/DatePicker.tsx   | 3 ++-
 packages/toolpad-components/src/FilePicker.tsx   | 3 ++-
 packages/toolpad-components/src/Select.tsx       | 3 ++-
 packages/toolpad-components/src/TextField.tsx    | 3 ++-
 6 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/packages/toolpad-components/src/Autocomplete.tsx b/packages/toolpad-components/src/Autocomplete.tsx
index fc1376c41dc..8ded2269dcc 100644
--- a/packages/toolpad-components/src/Autocomplete.tsx
+++ b/packages/toolpad-components/src/Autocomplete.tsx
@@ -25,8 +25,8 @@ interface AutocompleteProps
     Pick<FormInputComponentProps, 'name' | 'isRequired' | 'minLength' | 'maxLength' | 'isInvalid'> {
   value: AutocompleteValue;
   onChange: (newValue: AutocompleteValue) => void;
-  options: AutocompleteOption[];
   label: string;
+  options: AutocompleteOption[];
 }
 
 function Autocomplete({
diff --git a/packages/toolpad-components/src/Checkbox.tsx b/packages/toolpad-components/src/Checkbox.tsx
index 03e32354ff0..0d7c5f8720e 100644
--- a/packages/toolpad-components/src/Checkbox.tsx
+++ b/packages/toolpad-components/src/Checkbox.tsx
@@ -19,6 +19,7 @@ import {
 
 export type FormControlLabelOptions = {
   onChange: (newValue: boolean) => void;
+  label: string;
   defaultValue: string;
   fullWidth: boolean;
 } & Omit<FormControlLabelProps, 'control' | 'onChange'> &
@@ -29,7 +30,7 @@ function Checkbox({ ...rest }: FormControlLabelOptions) {
   rest.checked = rest.checked ?? false;
   const { onFormInputChange, renderFormInput, formInputError } = useFormInput<boolean>({
     name: rest.name,
-    label: rest.label as string,
+    label: rest.label,
     onChange: rest.onChange,
     validationProps: { isRequired: rest.isRequired, isInvalid: rest.isInvalid },
   });
diff --git a/packages/toolpad-components/src/DatePicker.tsx b/packages/toolpad-components/src/DatePicker.tsx
index cbad076e974..abeb4c0804e 100644
--- a/packages/toolpad-components/src/DatePicker.tsx
+++ b/packages/toolpad-components/src/DatePicker.tsx
@@ -72,6 +72,7 @@ export interface DatePickerProps
     Pick<FormInputComponentProps, 'name' | 'isRequired' | 'isInvalid'> {
   value?: string;
   onChange: (newValue: string | null) => void;
+  label: string;
   format: string;
   fullWidth: boolean;
   variant: 'outlined' | 'filled' | 'standard';
@@ -91,7 +92,7 @@ function DatePicker({
 }: DatePickerProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<string | null>({
     name: rest.name,
-    label: rest.label as string,
+    label: rest.label,
     value: valueProp,
     onChange,
     defaultValue: defaultValueProp,
diff --git a/packages/toolpad-components/src/FilePicker.tsx b/packages/toolpad-components/src/FilePicker.tsx
index 2cbcee49635..6f094aae117 100644
--- a/packages/toolpad-components/src/FilePicker.tsx
+++ b/packages/toolpad-components/src/FilePicker.tsx
@@ -20,6 +20,7 @@ export type FilePickerProps = MuiTextFieldProps & {
   multiple: boolean;
   value: FullFile[];
   onChange: (files: FullFile[]) => void;
+  label: string;
 } & Pick<FormInputComponentProps, 'name' | 'isRequired' | 'isInvalid'>;
 
 const readFile = async (file: Blob): Promise<string> => {
@@ -49,7 +50,7 @@ function FilePicker({
 }: FilePickerProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<FullFile[]>({
     name: rest.name,
-    label: rest.label as string,
+    label: rest.label,
     value,
     onChange,
     validationProps: { isRequired, isInvalid },
diff --git a/packages/toolpad-components/src/Select.tsx b/packages/toolpad-components/src/Select.tsx
index 12c298f68be..b11e8b2b900 100644
--- a/packages/toolpad-components/src/Select.tsx
+++ b/packages/toolpad-components/src/Select.tsx
@@ -17,6 +17,7 @@ export interface SelectOption {
 export type SelectProps = Omit<TextFieldProps, 'value' | 'onChange'> & {
   value: string;
   onChange: (newValue: string) => void;
+  label: string;
   defaultValue: string;
   options: (string | SelectOption)[];
 } & Pick<FormInputComponentProps, 'name' | 'isRequired' | 'isInvalid'>;
@@ -34,7 +35,7 @@ function Select({
 }: SelectProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<string>({
     name: rest.name,
-    label: rest.label as string,
+    label: rest.label,
     value,
     onChange,
     defaultValue,
diff --git a/packages/toolpad-components/src/TextField.tsx b/packages/toolpad-components/src/TextField.tsx
index dd498f9a128..9841a865118 100644
--- a/packages/toolpad-components/src/TextField.tsx
+++ b/packages/toolpad-components/src/TextField.tsx
@@ -17,6 +17,7 @@ import { SX_PROP_HELPER_TEXT } from './constants';
 export type TextFieldProps = Omit<MuiTextFieldProps, 'value' | 'onChange'> & {
   value: string;
   onChange: (newValue: string) => void;
+  label: string;
   defaultValue: string;
   alignItems?: BoxProps['alignItems'];
   justifyContent?: BoxProps['justifyContent'];
@@ -34,7 +35,7 @@ function TextField({
 }: TextFieldProps) {
   const { onFormInputChange, formInputError, renderFormInput } = useFormInput<string>({
     name: rest.name,
-    label: rest.label as string,
+    label: rest.label,
     value,
     onChange,
     emptyValue: '',

From 9214559efe1052098a25fd1e79a29160cdc14266 Mon Sep 17 00:00:00 2001
From: MUI bot <2109932+Janpot@users.noreply.github.com>
Date: Thu, 28 Sep 2023 17:57:23 +0200
Subject: [PATCH 4/5] fwr

---
 .../toolpad-components/src/Autocomplete.tsx   |  2 +-
 packages/toolpad-components/src/Checkbox.tsx  | 19 +++++++++----------
 .../toolpad-components/src/DatePicker.tsx     |  2 +-
 .../toolpad-components/src/FilePicker.tsx     |  2 +-
 packages/toolpad-components/src/Select.tsx    |  2 +-
 packages/toolpad-components/src/TextField.tsx |  2 +-
 6 files changed, 14 insertions(+), 15 deletions(-)

diff --git a/packages/toolpad-components/src/Autocomplete.tsx b/packages/toolpad-components/src/Autocomplete.tsx
index 8ded2269dcc..5aa00503dc6 100644
--- a/packages/toolpad-components/src/Autocomplete.tsx
+++ b/packages/toolpad-components/src/Autocomplete.tsx
@@ -25,7 +25,7 @@ interface AutocompleteProps
     Pick<FormInputComponentProps, 'name' | 'isRequired' | 'minLength' | 'maxLength' | 'isInvalid'> {
   value: AutocompleteValue;
   onChange: (newValue: AutocompleteValue) => void;
-  label: string;
+  label?: string;
   options: AutocompleteOption[];
 }
 
diff --git a/packages/toolpad-components/src/Checkbox.tsx b/packages/toolpad-components/src/Checkbox.tsx
index 0d7c5f8720e..b072e46a9a5 100644
--- a/packages/toolpad-components/src/Checkbox.tsx
+++ b/packages/toolpad-components/src/Checkbox.tsx
@@ -7,7 +7,7 @@ import {
   FormHelperText,
   FormControl,
 } from '@mui/material';
-import type { CheckboxProps } from '@mui/material/Checkbox';
+import type { CheckboxProps as MuiCheckBocProps } from '@mui/material/Checkbox';
 import type { FormControlLabelProps } from '@mui/material/FormControlLabel';
 import { SX_PROP_HELPER_TEXT } from './constants';
 import {
@@ -17,16 +17,15 @@ import {
   FORM_INPUT_ARG_TYPES,
 } from './Form';
 
-export type FormControlLabelOptions = {
-  onChange: (newValue: boolean) => void;
-  label: string;
-  defaultValue: string;
-  fullWidth: boolean;
-} & Omit<FormControlLabelProps, 'control' | 'onChange'> &
-  Omit<CheckboxProps, 'onChange'> &
-  Pick<FormInputComponentProps, 'name' | 'isRequired' | 'isInvalid'>;
+export type CheckboxProps = Omit<FormControlLabelProps, 'control' | 'onChange'> &
+  Omit<MuiCheckBocProps, 'onChange'> & {
+    onChange: (newValue: boolean) => void;
+    label?: string;
+    defaultValue: string;
+    fullWidth: boolean;
+  } & Pick<FormInputComponentProps, 'name' | 'isRequired' | 'isInvalid'>;
 
-function Checkbox({ ...rest }: FormControlLabelOptions) {
+function Checkbox({ ...rest }: CheckboxProps) {
   rest.checked = rest.checked ?? false;
   const { onFormInputChange, renderFormInput, formInputError } = useFormInput<boolean>({
     name: rest.name,
diff --git a/packages/toolpad-components/src/DatePicker.tsx b/packages/toolpad-components/src/DatePicker.tsx
index abeb4c0804e..cbb74654da4 100644
--- a/packages/toolpad-components/src/DatePicker.tsx
+++ b/packages/toolpad-components/src/DatePicker.tsx
@@ -72,7 +72,7 @@ export interface DatePickerProps
     Pick<FormInputComponentProps, 'name' | 'isRequired' | 'isInvalid'> {
   value?: string;
   onChange: (newValue: string | null) => void;
-  label: string;
+  label?: string;
   format: string;
   fullWidth: boolean;
   variant: 'outlined' | 'filled' | 'standard';
diff --git a/packages/toolpad-components/src/FilePicker.tsx b/packages/toolpad-components/src/FilePicker.tsx
index 6f094aae117..690ea38d5f4 100644
--- a/packages/toolpad-components/src/FilePicker.tsx
+++ b/packages/toolpad-components/src/FilePicker.tsx
@@ -20,7 +20,7 @@ export type FilePickerProps = MuiTextFieldProps & {
   multiple: boolean;
   value: FullFile[];
   onChange: (files: FullFile[]) => void;
-  label: string;
+  label?: string;
 } & Pick<FormInputComponentProps, 'name' | 'isRequired' | 'isInvalid'>;
 
 const readFile = async (file: Blob): Promise<string> => {
diff --git a/packages/toolpad-components/src/Select.tsx b/packages/toolpad-components/src/Select.tsx
index b11e8b2b900..784be339fe6 100644
--- a/packages/toolpad-components/src/Select.tsx
+++ b/packages/toolpad-components/src/Select.tsx
@@ -17,7 +17,7 @@ export interface SelectOption {
 export type SelectProps = Omit<TextFieldProps, 'value' | 'onChange'> & {
   value: string;
   onChange: (newValue: string) => void;
-  label: string;
+  label?: string;
   defaultValue: string;
   options: (string | SelectOption)[];
 } & Pick<FormInputComponentProps, 'name' | 'isRequired' | 'isInvalid'>;
diff --git a/packages/toolpad-components/src/TextField.tsx b/packages/toolpad-components/src/TextField.tsx
index 9841a865118..499fa6728c0 100644
--- a/packages/toolpad-components/src/TextField.tsx
+++ b/packages/toolpad-components/src/TextField.tsx
@@ -17,7 +17,7 @@ import { SX_PROP_HELPER_TEXT } from './constants';
 export type TextFieldProps = Omit<MuiTextFieldProps, 'value' | 'onChange'> & {
   value: string;
   onChange: (newValue: string) => void;
-  label: string;
+  label?: string;
   defaultValue: string;
   alignItems?: BoxProps['alignItems'];
   justifyContent?: BoxProps['justifyContent'];

From ace76c39fc0193b3cee3319a56bd04a356800095 Mon Sep 17 00:00:00 2001
From: MUI bot <2109932+Janpot@users.noreply.github.com>
Date: Thu, 28 Sep 2023 17:59:16 +0200
Subject: [PATCH 5/5] typo

---
 packages/toolpad-components/src/Checkbox.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/toolpad-components/src/Checkbox.tsx b/packages/toolpad-components/src/Checkbox.tsx
index b072e46a9a5..4a6b78fd4ed 100644
--- a/packages/toolpad-components/src/Checkbox.tsx
+++ b/packages/toolpad-components/src/Checkbox.tsx
@@ -7,7 +7,7 @@ import {
   FormHelperText,
   FormControl,
 } from '@mui/material';
-import type { CheckboxProps as MuiCheckBocProps } from '@mui/material/Checkbox';
+import type { CheckboxProps as MuiCheckBoxProps } from '@mui/material/Checkbox';
 import type { FormControlLabelProps } from '@mui/material/FormControlLabel';
 import { SX_PROP_HELPER_TEXT } from './constants';
 import {
@@ -18,7 +18,7 @@ import {
 } from './Form';
 
 export type CheckboxProps = Omit<FormControlLabelProps, 'control' | 'onChange'> &
-  Omit<MuiCheckBocProps, 'onChange'> & {
+  Omit<MuiCheckBoxProps, 'onChange'> & {
     onChange: (newValue: boolean) => void;
     label?: string;
     defaultValue: string;