@asgardeo/react/dist/components/presentation/SignIn/BaseSignIn.d.ts

React implementation of Asgardeo JavaScript SDK.

/**
 * 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 { ApplicationNativeAuthenticationInitiateResponse, ApplicationNativeAuthenticationHandleResponse } from '@asgardeo/browser';
import { FC } from 'react';
/**
 * Props for the BaseSignIn component.
 */
export interface BaseSignInProps {
    /**
     * Function to initialize authentication flow.
     * @returns Promise resolving to the initial authentication response.
     */
    onInitialize: () => Promise<ApplicationNativeAuthenticationInitiateResponse>;
    /**
     * Function to handle authentication steps.
     * @param payload - The authentication payload.
     * @returns Promise resolving to the authentication response.
     */
    onSubmit: (flow: {
        requestConfig?: {
            method: string;
            url: string;
        };
        payload: {
            flowId: string;
            selectedAuthenticator: {
                authenticatorId: string;
                params: Record<string, string>;
            };
        };
    }) => Promise<ApplicationNativeAuthenticationHandleResponse>;
    /**
     * Callback function called when authentication is successful.
     * @param authData - The authentication data returned upon successful completion.
     */
    onSuccess?: (authData: Record<string, any>) => void;
    /**
     * Callback function called when authentication fails.
     * @param error - The error that occurred during authentication.
     */
    onError?: (error: Error) => void;
    /**
     * Callback function called when authentication flow status changes.
     * @param response - The current authentication response.
     */
    onFlowChange?: (response: ApplicationNativeAuthenticationInitiateResponse | ApplicationNativeAuthenticationHandleResponse) => void;
    /**
     * Custom CSS class name for the form container.
     */
    className?: string;
    /**
     * Custom CSS class name for form inputs.
     */
    inputClassName?: string;
    /**
     * Custom CSS class name for the submit button.
     */
    buttonClassName?: string;
    /**
     * Custom CSS class name for error messages.
     */
    errorClassName?: string;
    /**
     * Custom CSS class name for info messages.
     */
    messageClassName?: string;
    /**
     * Size variant for the component.
     */
    size?: 'small' | 'medium' | 'large';
    /**
     * Theme variant for the component.
     */
    variant?: 'default' | 'outlined' | 'filled';
    afterSignInUrl?: string;
}
/**
 * Base SignIn component that provides native authentication flow.
 * This component handles both the presentation layer and authentication flow logic.
 * It accepts API functions as props to maintain framework independence.
 *
 * @example
 * ```tsx
 * import { BaseSignIn } from '@asgardeo/react';
 *
 * const MySignIn = () => {
 *   return (
 *     <BaseSignIn
 *       onInitialize={async () => {
 *         // Your API call to initialize authentication
 *         return await initializeAuth();
 *       }}
 *       onSubmit={async (payload) => {
 *         // Your API call to handle authentication
 *         return await handleAuth(payload);
 *       }}
 *       onSuccess={(authData) => {
 *         console.log('Success:', authData);
 *       }}
 *       onError={(error) => {
 *         console.error('Error:', error);
 *       }}
 *       className="max-w-md mx-auto"
 *     />
 *   );
 * };
 * ```
 */
declare const BaseSignIn: FC<BaseSignInProps>;
export default BaseSignIn;