chore(react): toggle BaseSignIn component based on platform version

Author: brionmario

packages/react/src/components/presentation/SignIn/BaseSignIn.tsx

@@ -0,0 +1,47 @@
+/**
+ * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import {
+  EmbeddedSignInFlowInitiateResponse,
+  EmbeddedSignInFlowHandleResponse,
+  EmbeddedSignInFlowHandleRequestPayload,
+  Platform,
+} from '@asgardeo/browser';
+import {FC, ReactElement} from 'react';
+import BaseSignInV1, {BaseSignInProps as BaseSignInV1Props} from './non-component-driven/BaseSignIn';
+import BaseSignInV2, {BaseSignInProps as BaseSignInV2Props} from './component-driven/BaseSignIn';
+import ComponentDrivenSignIn, {SignInRenderProps} from './component-driven/SignIn';
+import useAsgardeo from '../../../contexts/Asgardeo/useAsgardeo';
+
+/**
+ * Props for the BaseSignIn component.
+ * Extends BaseSignInV1Props & BaseSignInV2Props for full compatibility with both React BaseSignIn components.
+ */
+export type BaseSignInProps = BaseSignInV1Props | BaseSignInV2Props;
+
+const BaseSignIn: FC<BaseSignInProps> = (props: BaseSignInProps) => {
+  const {platform} = useAsgardeo();
+
+  if (platform === Platform.AsgardeoV2) {
+    return <BaseSignInV2 {...props as BaseSignInV2Props} />;
+  }
+
+  return <BaseSignInV1 {...props as BaseSignInV1Props} />;
+};
+
+export default BaseSignIn;

packages/react/src/components/presentation/SignIn/SignIn.tsx

@@ -23,15 +23,15 @@ import {
   Platform,
 } from '@asgardeo/browser';
 import {FC, ReactElement} from 'react';
-import BaseSignIn, {BaseSignInProps} from './non-component-driven/BaseSignIn';
-import ComponentDrivenSignIn, {SignInRenderProps} from './component-driven/SignIn';
+import BaseSignInV1, {BaseSignInProps as BaseSignInV1Props} from './non-component-driven/BaseSignIn';
+import SignInV2, {SignInRenderProps} from './component-driven/SignIn';
 import useAsgardeo from '../../../contexts/Asgardeo/useAsgardeo';
 
 /**
  * Props for the SignIn component.
  * Extends BaseSignInProps for full compatibility with the React BaseSignIn component
  */
-export type SignInProps = Pick<BaseSignInProps, 'className' | 'onSuccess' | 'onError' | 'variant' | 'size'> & {
+export type SignInProps = Pick<BaseSignInV1Props, 'className' | 'onSuccess' | 'onError' | 'variant' | 'size'> & {
   /**
    * Render function for custom UI (render props pattern).
    */
@@ -102,20 +102,20 @@ const SignIn: FC<SignInProps> = ({className, size = 'medium', children, ...rest}
 
   if (platform === Platform.AsgardeoV2) {
     return (
-      <ComponentDrivenSignIn
+      <SignInV2
         className={className}
         size={size}
         variant={rest.variant}
         onSuccess={rest.onSuccess}
         onError={rest.onError}
       >
         {children}
-      </ComponentDrivenSignIn>
+      </SignInV2>
     );
   }
 
   return (
-    <BaseSignIn
+    <BaseSignInV1
       isLoading={isLoading || !isInitialized}
       afterSignInUrl={afterSignInUrl}
       onInitialize={handleInitialize}

packages/react/src/index.ts

@@ -118,8 +118,8 @@ export * from './components/control/SignedOut';
 export {default as Loading} from './components/control/Loading';
 export * from './components/control/Loading';
 
-export {default as BaseSignIn} from './components/presentation/SignIn/non-component-driven/BaseSignIn';
-export * from './components/presentation/SignIn/non-component-driven/BaseSignIn';
+export {default as BaseSignIn} from './components/presentation/SignIn/BaseSignIn';
+export * from './components/presentation/SignIn/BaseSignIn';
 
 export {default as SignIn} from './components/presentation/SignIn/SignIn';
 export * from './components/presentation/SignIn/SignIn';