feat: accept classname on loginview (and login) for consumer styling (#954) (#957)

Co-authored-by: Fran McDade <18710366+frano-m@users.noreply.github.com>
Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: frano-m

src/components/Login/login.tsx

@@ -19,6 +19,7 @@ import {
 import { Props } from "./types";
 
 export const Login = ({
+  className,
   providers = [],
   termsOfService,
   text,
@@ -50,7 +51,7 @@ export const Login = ({
   };
 
   return (
-    <LoginWrapper>
+    <LoginWrapper className={className}>
       <RoundedPaper>
         <LoginSection>
           <SectionContent>

src/components/Login/types.ts

@@ -1,7 +1,8 @@
 import { ReactNode } from "react";
 import { LoginProvider } from "../../auth/types/loginProvider";
+import { BaseComponentProps } from "../types";
 
-export interface Props {
+export interface Props extends BaseComponentProps {
   providers?: LoginProvider[];
   termsOfService?: ReactNode;
   text?: ReactNode;

src/views/LoginView/loginView.tsx

@@ -1,19 +1,22 @@
 import { JSX } from "react";
 import { LoginProvider } from "../../auth/types/loginProvider";
 import { Login } from "../../components/Login/login";
+import { BaseComponentProps } from "../../components/types";
 import { useAuthenticationConfig } from "../../hooks/authentication/config/useAuthenticationConfig";
 
-export interface LoginViewProps {
+export interface LoginViewProps extends BaseComponentProps {
   providers?: LoginProvider[];
 }
 
 export const LoginView = ({
+  className,
   providers,
 }: LoginViewProps): JSX.Element | null => {
   const authConfig = useAuthenticationConfig();
   if (!authConfig) return null;
   return (
     <Login
+      className={className}
       providers={providers || authConfig.providers}
       termsOfService={authConfig.termsOfService}
       text={authConfig.text}