@asgardeo/react 0.3.0 → 0.5.0

package/dist/contexts/User/UserProvider.d.ts

@@ -0,0 +1,56 @@
+/**
+ * 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 { UserProfile } from '@asgardeo/browser';
+import { FC, PropsWithChildren } from 'react';
+/**
+ * Props interface of {@link UserProvider}
+ */
+export interface UserProviderProps {
+    profile: UserProfile;
+    revalidateProfile?: () => Promise<void>;
+}
+/**
+ * UserProvider component that manages user profile data and provides it through UserContext.
+ *
+ * This provider:
+ * - Fetches user profile data from the ME endpoint
+ * - Retrieves SCIM2 schemas for profile structure
+ * - Generates both nested and flattened user profiles
+ * - Provides functions for refreshing and updating user data
+ * - Handles loading states and errors
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <UserProvider>
+ *   <App />
+ * </UserProvider>
+ *
+ * // With custom error handling
+ * <UserProvider onError={(error) => console.error('User error:', error)}>
+ *   <App />
+ * </UserProvider>
+ *
+ * // Disable auto-fetch (fetch manually using refreshUser)
+ * <UserProvider autoFetch={false}>
+ *   <App />
+ * </UserProvider>
+ * ```
+ */
+declare const UserProvider: FC<PropsWithChildren<UserProviderProps>>;
+export default UserProvider;

package/dist/contexts/User/useUser.d.ts

@@ -0,0 +1,94 @@
+/**
+ * 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 { UserContextProps } from './UserContext';
+/**
+ * Hook to access the User context.
+ *
+ * This hook provides access to user profile data including:
+ * - Raw profile API response
+ * - SCIM2 schemas
+ * - Nested user object
+ * - Flattened user profile
+ * - Functions to refresh and update user data
+ * - Loading states and error handling
+ *
+ * @returns {UserContextProps} The user context value containing all user-related data and functions
+ * @throws {Error} Throws an error if used outside of UserProvider
+ *
+ * @example
+ * ```tsx
+ * import {useUser} from '@asgardeo/react';
+ *
+ * function ProfileComponent() {
+ *   const {
+ *     isLoading,
+ *     profile,
+ *     schemas,
+ *     user,
+ *     flattenedUser,
+ *     refreshUser,
+ *     updateUser,
+ *     error
+ *   } = useUser();
+ *
+ *   if (isLoading) {
+ *     return <div>Loading user data...</div>;
+ *   }
+ *
+ *   if (error) {
+ *     return <div>Error: {error.message}</div>;
+ *   }
+ *
+ *   return (
+ *     <div>
+ *       <h1>Welcome {user?.name?.givenName}!</h1>
+ *       <p>Email: {flattenedUser?.emails}</p>
+ *       <button onClick={refreshUser}>Refresh Profile</button>
+ *     </div>
+ *   );
+ * }
+ *
+ * // Access specific user properties
+ * function UserEmail() {
+ *   const {flattenedUser} = useUser();
+ *   return <span>{flattenedUser?.emails?.[0]}</span>;
+ * }
+ *
+ * // Update user profile
+ * function EditProfile() {
+ *   const {updateUser, user} = useUser();
+ *
+ *   const handleUpdate = async () => {
+ *     try {
+ *       await updateUser({
+ *         name: {
+ *           givenName: 'John',
+ *           familyName: 'Doe'
+ *         }
+ *       });
+ *     } catch (error) {
+ *       console.error('Update failed:', error);
+ *     }
+ *   };
+ *
+ *   return <button onClick={handleUpdate}>Update Name</button>;
+ * }
+ * ```
+ */
+declare const useUser: () => UserContextProps;
+export default useUser;

package/dist/hooks/useForm.d.ts

@@ -0,0 +1,192 @@
+/**
+ * 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.
+ */
+/**
+ * Generic form field configuration
+ */
+export interface FormField {
+    initialValue?: string;
+    name: string;
+    required?: boolean;
+    validator?: (value: string) => string | null;
+}
+/**
+ * Form validation result
+ */
+export interface ValidationResult {
+    errors: Record<string, string>;
+    isValid: boolean;
+}
+/**
+ * Configuration for the useForm hook
+ */
+export interface UseFormConfig<T extends Record<string, string>> {
+    /**
+     * Form field definitions
+     */
+    fields?: FormField[];
+    /**
+     * Initial form values
+     */
+    initialValues?: Partial<T>;
+    /**
+     * Custom required field validation message
+     */
+    requiredMessage?: string;
+    /**
+     * Whether to validate on blur (default: true)
+     */
+    validateOnBlur?: boolean;
+    /**
+     * Whether to validate on change (default: false)
+     */
+    validateOnChange?: boolean;
+    /**
+     * Global form validator function
+     */
+    validator?: (values: T) => Record<string, string>;
+}
+/**
+ * Return type for the useForm hook
+ */
+export interface UseFormReturn<T extends Record<string, string>> {
+    /**
+     * Clear all errors
+     */
+    clearErrors: () => void;
+    /**
+     * Current validation errors
+     */
+    errors: Record<keyof T, string>;
+    /**
+     * Get field props for easy integration with form components
+     */
+    getFieldProps: (name: keyof T) => {
+        error: string | undefined;
+        name: keyof T;
+        onBlur: () => void;
+        onChange: (value: string) => void;
+        required: boolean;
+        touched: boolean;
+        value: string;
+    };
+    /**
+     * Handle form submission
+     */
+    handleSubmit: (onSubmit: (values: T) => void | Promise<void>) => (e?: React.FormEvent) => Promise<void>;
+    /**
+     * Whether the form has been submitted
+     */
+    isSubmitted: boolean;
+    /**
+     * Whether the form is currently valid
+     */
+    isValid: boolean;
+    /**
+     * Reset the form to initial values
+     */
+    reset: () => void;
+    /**
+     * Set a field error
+     */
+    setError: (name: keyof T, error: string) => void;
+    /**
+     * Set multiple field errors
+     */
+    setErrors: (errors: Partial<Record<keyof T, string>>) => void;
+    /**
+     * Mark a field as touched
+     */
+    setTouched: (name: keyof T, touched?: boolean) => void;
+    /**
+     * Mark multiple fields as touched
+     */
+    setTouchedFields: (touched: Partial<Record<keyof T, boolean>>) => void;
+    /**
+     * Set a single field value
+     */
+    setValue: (name: keyof T, value: string) => void;
+    /**
+     * Set multiple field values
+     */
+    setValues: (values: Partial<T>) => void;
+    /**
+     * Mark all fields as touched
+     */
+    touchAllFields: () => void;
+    /**
+     * Validate all fields
+     */
+    validateForm: () => ValidationResult;
+    /**
+     * Current form values
+     */
+    values: T;
+    /**
+     * Validate a single field
+     */
+    validateField: (name: keyof T) => string | null;
+    /**
+     * Fields that have been touched by the user
+     */
+    touched: Record<keyof T, boolean>;
+}
+/**
+ * Generic form hook that provides comprehensive form state management and validation.
+ *
+ * @template T - The type of form values (must extend Record<string, string>)
+ * @param config - Configuration options for the form
+ * @returns Form state and methods
+ *
+ * @example
+ * ```tsx
+ * interface LoginForm {
+ *   username: string;
+ *   password: string;
+ * }
+ *
+ * const {
+ *   values,
+ *   touched,
+ *   errors,
+ *   isValid,
+ *   setValue,
+ *   handleSubmit,
+ *   getFieldProps
+ * } = useForm<LoginForm>({
+ *   initialValues: { username: '', password: '' },
+ *   fields: [
+ *     { name: 'username', required: true },
+ *     { name: 'password', required: true }
+ *   ]
+ * });
+ *
+ * const onSubmit = handleSubmit((values) => {
+ *   console.log('Form submitted:', values);
+ * });
+ *
+ * return (
+ *   <form onSubmit={onSubmit}>
+ *     <input {...getFieldProps('username')} />
+ *     <input {...getFieldProps('password')} type="password" />
+ *     <button type="submit" disabled={!isValid}>Submit</button>
+ *   </form>
+ * );
+ * ```
+ */
+export declare const useForm: <T extends Record<string, string>>(config?: UseFormConfig<T>) => UseFormReturn<T>;
+export default useForm;

package/dist/hooks/useTranslation.d.ts

@@ -0,0 +1,52 @@
+/**
+ * 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 { I18nPreferences } from '@asgardeo/browser';
+export interface UseTranslation {
+    /**
+     * Translation function that returns a translated string for the given key
+     */
+    t: (key: string, params?: Record<string, string | number>) => string;
+    /**
+     * The current language code
+     */
+    currentLanguage: string;
+    /**
+     * Function to change the current language
+     */
+    setLanguage: (language: string) => void;
+    /**
+     * All available language codes
+     */
+    availableLanguages: string[];
+}
+export interface UseTranslationWithPreferences extends UseTranslation {
+    /**
+     * Enhanced translation function that merges component-level preferences
+     */
+    t: (key: string, params?: Record<string, string | number>) => string;
+}
+/**
+ * Hook for accessing translation functions and language management.
+ * Must be used within an I18nProvider context.
+ *
+ * @param componentPreferences - Optional component-level i18n preferences to merge with global ones
+ * @returns An object containing translation function and language management utilities
+ * @throws Error if used outside of I18nProvider context
+ */
+declare const useTranslation: (componentPreferences?: I18nPreferences) => UseTranslationWithPreferences;
+export default useTranslation;

package/dist/index.d.ts

@@ -15,14 +15,48 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-export { default as AsgardeoProvider } from './providers/AsgardeoProvider';
-export * from './providers/AsgardeoProvider';
-export { default as AsgardeoContext } from './contexts/AsgardeoContext';
-export * from './contexts/AsgardeoContext';
-export { default as useAsgardeo } from './hooks/useAsgardeo';
-export * from './hooks/useAsgardeo';
+export { default as AsgardeoProvider } from './contexts/Asgardeo/AsgardeoProvider';
+export * from './contexts/Asgardeo/AsgardeoProvider';
+export { default as AsgardeoContext } from './contexts/Asgardeo/AsgardeoContext';
+export * from './contexts/Asgardeo/AsgardeoContext';
+export { default as useAsgardeo } from './contexts/Asgardeo/useAsgardeo';
+export * from './contexts/Asgardeo/useAsgardeo';
+export { default as UserContext } from './contexts/User/UserContext';
+export * from './contexts/User/UserContext';
+export { default as UserProvider } from './contexts/User/UserProvider';
+export * from './contexts/User/UserProvider';
+export { default as useUser } from './contexts/User/useUser';
+export * from './contexts/User/useUser';
+export { default as OrganizationContext } from './contexts/Organization/OrganizationContext';
+export * from './contexts/Organization/OrganizationContext';
+export { default as OrganizationProvider } from './contexts/Organization/OrganizationProvider';
+export * from './contexts/Organization/OrganizationProvider';
+export { default as useOrganization } from './contexts/Organization/useOrganization';
+export * from './contexts/Organization/useOrganization';
+export { default as FlowContext } from './contexts/Flow/FlowContext';
+export * from './contexts/Flow/FlowContext';
+export { default as FlowProvider } from './contexts/Flow/FlowProvider';
+export * from './contexts/Flow/FlowProvider';
+export { default as useFlow } from './contexts/Flow/useFlow';
+export * from './contexts/Flow/useFlow';
+export { default as I18nContext } from './contexts/I18n/I18nContext';
+export * from './contexts/I18n/I18nContext';
+export { default as I18nProvider } from './contexts/I18n/I18nProvider';
+export * from './contexts/I18n/I18nProvider';
+export { default as useI18n } from './contexts/I18n/useI18n';
+export * from './contexts/I18n/useI18n';
+export { default as ThemeContext } from './contexts/Theme/ThemeContext';
+export * from './contexts/Theme/ThemeContext';
+export { default as ThemeProvider } from './contexts/Theme/ThemeProvider';
+export * from './contexts/Theme/ThemeProvider';
+export { default as useTheme } from './contexts/Theme/useTheme';
+export * from './contexts/Theme/useTheme';
 export { default as useBrowserUrl } from './hooks/useBrowserUrl';
 export * from './hooks/useBrowserUrl';
+export { default as useTranslation } from './hooks/useTranslation';
+export * from './hooks/useTranslation';
+export { default as useForm } from './hooks/useForm';
+export * from './hooks/useForm';
 export { default as BaseSignInButton } from './components/actions/SignInButton/BaseSignInButton';
 export * from './components/actions/SignInButton/BaseSignInButton';
 export { default as SignInButton } from './components/actions/SignInButton/SignInButton';
@@ -39,8 +73,38 @@ export { default as SignedIn } from './components/control/SignedIn';
 export * from './components/control/SignedIn';
 export { default as SignedOut } from './components/control/SignedOut';
 export * from './components/control/SignedOut';
-export { default as User } from './components/presentation/User';
-export * from './components/presentation/User';
+export { default as AsgardeoLoading } from './components/control/AsgardeoLoading';
+export * from './components/control/AsgardeoLoading';
+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';
+export { default as BaseSignUp } from './components/presentation/SignUp/BaseSignUp';
+export * from './components/presentation/SignUp/BaseSignUp';
+export { default as SignUp } from './components/presentation/SignUp/SignUp';
+export * from './components/presentation/SignUp/SignUp';
+export { default as IdentifierFirst } from './components/presentation/SignIn/options/IdentifierFirst';
+export { default as UsernamePassword } from './components/presentation/SignIn/options/UsernamePassword';
+export { default as GoogleButton } from './components/presentation/SignIn/options/GoogleButton';
+export { default as GitHubButton } from './components/presentation/SignIn/options/GitHubButton';
+export { default as MicrosoftButton } from './components/presentation/SignIn/options/MicrosoftButton';
+export { default as FacebookButton } from './components/presentation/SignIn/options/FacebookButton';
+export { default as LinkedInButton } from './components/presentation/SignIn/options/LinkedInButton';
+export { default as SignInWithEthereumButton } from './components/presentation/SignIn/options/SignInWithEthereumButton';
+export { default as EmailOtp } from './components/presentation/SignIn/options/EmailOtp';
+export { default as Totp } from './components/presentation/SignIn/options/Totp';
+export { default as SmsOtp } from './components/presentation/SignIn/options/SmsOtp';
+export { default as SocialButton } from './components/presentation/SignIn/options/SocialButton';
+export { default as MultiOptionButton } from './components/presentation/SignIn/options/MultiOptionButton';
+export * from './components/presentation/SignIn/options/SignInOptionFactory';
+export { default as BaseUser } from './components/presentation/User/BaseUser';
+export * from './components/presentation/User/BaseUser';
+export { default as User } from './components/presentation/User/User';
+export * from './components/presentation/User/User';
+export { default as BaseOrganization } from './components/presentation/Organization/BaseOrganization';
+export * from './components/presentation/Organization/BaseOrganization';
+export { default as Organization } from './components/presentation/Organization/Organization';
+export * from './components/presentation/Organization/Organization';
 export { default as BaseUserProfile } from './components/presentation/UserProfile/BaseUserProfile';
 export * from './components/presentation/UserProfile/BaseUserProfile';
 export { default as UserProfile } from './components/presentation/UserProfile/UserProfile';
@@ -49,4 +113,64 @@ export { default as BaseUserDropdown } from './components/presentation/UserDropd
 export * from './components/presentation/UserDropdown/BaseUserDropdown';
 export { default as UserDropdown } from './components/presentation/UserDropdown/UserDropdown';
 export * from './components/presentation/UserDropdown/UserDropdown';
-export * from '@asgardeo/browser';
+export { default as BaseOrganizationSwitcher } from './components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher';
+export * from './components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher';
+export { default as OrganizationSwitcher } from './components/presentation/OrganizationSwitcher/OrganizationSwitcher';
+export * from './components/presentation/OrganizationSwitcher/OrganizationSwitcher';
+export { default as BaseOrganizationList } from './components/presentation/OrganizationList/BaseOrganizationList';
+export * from './components/presentation/OrganizationList/BaseOrganizationList';
+export { default as OrganizationList } from './components/presentation/OrganizationList/OrganizationList';
+export * from './components/presentation/OrganizationList/OrganizationList';
+export { default as BaseOrganizationProfile } from './components/presentation/OrganizationProfile/BaseOrganizationProfile';
+export * from './components/presentation/OrganizationProfile/BaseOrganizationProfile';
+export { default as OrganizationProfile } from './components/presentation/OrganizationProfile/OrganizationProfile';
+export * from './components/presentation/OrganizationProfile/OrganizationProfile';
+export { BaseCreateOrganization } from './components/presentation/CreateOrganization/BaseCreateOrganization';
+export * from './components/presentation/CreateOrganization/BaseCreateOrganization';
+export { CreateOrganization } from './components/presentation/CreateOrganization/CreateOrganization';
+export * from './components/presentation/CreateOrganization/CreateOrganization';
+export { default as Button } from './components/primitives/Button/Button';
+export * from './components/primitives/Button/Button';
+export { default as Card } from './components/primitives/Card/Card';
+export * from './components/primitives/Card/Card';
+export { default as Alert } from './components/primitives/Alert/Alert';
+export * from './components/primitives/Alert/Alert';
+export { default as OtpField } from './components/primitives/OtpField/OtpField';
+export * from './components/primitives/OtpField/OtpField';
+export { default as TextField } from './components/primitives/TextField/TextField';
+export * from './components/primitives/TextField/TextField';
+export { default as PasswordField } from './components/primitives/PasswordField/PasswordField';
+export * from './components/primitives/PasswordField/PasswordField';
+export { default as Select } from './components/primitives/Select/Select';
+export * from './components/primitives/Select/Select';
+export { default as DatePicker } from './components/primitives/DatePicker/DatePicker';
+export * from './components/primitives/DatePicker/DatePicker';
+export { default as Checkbox } from './components/primitives/Checkbox/Checkbox';
+export * from './components/primitives/Checkbox/Checkbox';
+export { default as FormControl } from './components/primitives/FormControl/FormControl';
+export * from './components/primitives/FormControl/FormControl';
+export { default as InputLabel } from './components/primitives/InputLabel/InputLabel';
+export * from './components/primitives/InputLabel/InputLabel';
+export { default as KeyValueInput } from './components/primitives/KeyValueInput/KeyValueInput';
+export * from './components/primitives/KeyValueInput/KeyValueInput';
+export { default as Typography } from './components/primitives/Typography/Typography';
+export * from './components/primitives/Typography/Typography';
+export { default as Divider } from './components/primitives/Divider/Divider';
+export * from './components/primitives/Divider/Divider';
+export { default as Spinner } from './components/primitives/Spinner/Spinner';
+export * from './components/primitives/Spinner/Spinner';
+export { default as Eye } from './components/primitives/Icons/Eye';
+export { default as EyeOff } from './components/primitives/Icons/EyeOff';
+export { default as CircleCheck } from './components/primitives/Icons/CircleCheck';
+export { default as CircleAlert } from './components/primitives/Icons/CircleAlert';
+export { default as TriangleAlert } from './components/primitives/Icons/TriangleAlert';
+export { default as Info } from './components/primitives/Icons/Info';
+export { default as UserIcon } from './components/primitives/Icons/User';
+export { default as LogOut } from './components/primitives/Icons/LogOut';
+export { createField, FieldFactory, parseMultiValuedString, formatMultiValuedString, validateFieldValue, } from './components/factories/FieldFactory';
+export * from './components/factories/FieldFactory';
+export type { FlowStep, FlowMessage, FlowContextValue } from './contexts/Flow/FlowContext';
+export type { FlowProviderProps } from './contexts/Flow/FlowProvider';
+export { default as createOrganization } from './api/scim2/createOrganization';
+export * from './api/scim2/createOrganization';
+export { default as getMeOrganizations } from './api/scim2/getMeOrganizations';