fix: Move out of mui#4574

bharatkashyap · Feb 12, 2025 · 223fa80 · 223fa80
1 parent 27a2434
commit 223fa80
Show file tree

Hide file tree

Showing 7 changed files with 13 additions and 5 deletions.
diff --git a/docs/data/toolpad/core/components/sign-in-page/BrandingSignInPage.tsx b/docs/data/toolpad/core/components/sign-in-page/BrandingSignInPage.tsx
@@ -35,7 +35,7 @@ export default function BrandingSignInPage() {
       <SignInPage
         signIn={signIn}
         providers={providers}
-        slotProps={{ emailField: { autoFocus: false } }}
+        slotProps={{ emailField: { autoFocus: false }, form: { noValidate: true } }}
       />
     </AppProvider>
     // preview-end

diff --git a/docs/data/toolpad/core/components/sign-in-page/CredentialsSignInPage.tsx b/docs/data/toolpad/core/components/sign-in-page/CredentialsSignInPage.tsx
@@ -30,7 +30,7 @@ export default function CredentialsSignInPage() {
       <SignInPage
         signIn={signIn}
         providers={providers}
-        slotProps={{ emailField: { autoFocus: false } }}
+        slotProps={{ emailField: { autoFocus: false }, form: { noValidate: true } }}
       />
     </AppProvider>
     // preview-end

diff --git a/docs/data/toolpad/core/components/sign-in-page/MagicLinkAlertSignInPage.tsx b/docs/data/toolpad/core/components/sign-in-page/MagicLinkAlertSignInPage.tsx
@@ -36,7 +36,7 @@ export default function MagicLinkAlertSignInPage() {
       <SignInPage
         signIn={signIn}
         providers={providers}
-        slotProps={{ emailField: { autoFocus: false } }}
+        slotProps={{ emailField: { autoFocus: false }, form: { noValidate: true } }}
       />
     </AppProvider>
     // preview-end

diff --git a/docs/data/toolpad/core/components/sign-in-page/NotificationsSignInPageError.tsx b/docs/data/toolpad/core/components/sign-in-page/NotificationsSignInPageError.tsx
@@ -39,7 +39,7 @@ export default function NotificationsSignInPageError() {
       <SignInPage
         signIn={signIn}
         providers={providers}
-        slotProps={{ emailField: { autoFocus: false } }}
+        slotProps={{ emailField: { autoFocus: false }, form: { noValidate: true } }}
       />
     </AppProvider>
     // preview-end

diff --git a/docs/data/toolpad/core/components/sign-in-page/PasskeySignInPage.tsx b/docs/data/toolpad/core/components/sign-in-page/PasskeySignInPage.tsx
@@ -24,7 +24,7 @@ export default function PasskeySignInPage() {
       <SignInPage
         signIn={signIn}
         providers={providers}
-        slotProps={{ emailField: { autoFocus: false } }}
+        slotProps={{ emailField: { autoFocus: false }, form: { noValidate: true } }}
       />
     </AppProvider>
     // preview-end

diff --git a/docs/data/toolpad/core/components/sign-in-page/ThemeSignInPage.tsx b/docs/data/toolpad/core/components/sign-in-page/ThemeSignInPage.tsx
@@ -50,6 +50,7 @@ export default function ThemeSignInPage() {
       <SignInPage
         signIn={signIn}
         providers={providers}
+        slotProps={{ form: { noValidate: true } }}
         sx={{
           '& form > .MuiStack-root': {
             marginTop: '2rem',

diff --git a/packages/toolpad-core/src/SignInPage/SignInPage.tsx b/packages/toolpad-core/src/SignInPage/SignInPage.tsx
@@ -255,6 +255,8 @@ export interface SignInPageProps {
     forgotPasswordLink?: LinkProps;
     signUpLink?: LinkProps;
     rememberMe?: Partial<FormControlLabelProps>;
+    form?: Partial<React.FormHTMLAttributes<HTMLFormElement>>;
+    oAuthButton?: LoadingButtonProps;
   };
   /**
    * The prop used to customize the styles on the `SignInPage` container
@@ -375,6 +377,7 @@ function SignInPage(props: SignInPageProps) {
                           error: oauthResponse?.error,
                         }));
                       }}
+                      {...slotProps?.form}
                     >
                       <LoadingButton
                         key={provider.id}
@@ -391,6 +394,7 @@ function SignInPage(props: SignInPageProps) {
                         sx={{
                           textTransform: 'capitalize',
                         }}
+                        {...slotProps?.oAuthButton}
                       >
                         <span>Sign in with {provider.name}</span>
                       </LoadingButton>
@@ -424,6 +428,7 @@ function SignInPage(props: SignInPageProps) {
                       error: passkeyResponse?.error,
                     }));
                   }}
+                  {...slotProps?.form}
                 >
                   {slots?.emailField ? (
                     <slots.emailField {...slotProps?.emailField} />
@@ -498,6 +503,7 @@ function SignInPage(props: SignInPageProps) {
                       success: emailResponse?.success,
                     }));
                   }}
+                  {...slotProps?.form}
                 >
                   {slots?.emailField ? (
                     <slots.emailField {...slotProps?.emailField} />
@@ -570,6 +576,7 @@ function SignInPage(props: SignInPageProps) {
                       error: credentialsResponse?.error,
                     }));
                   }}
+                  {...slotProps?.form}
                 >
                   <Stack direction="column" spacing={2} sx={{ mb: 2 }}>
                     {slots?.emailField ? (