@asgardeo/react 0.11.2 → 0.11.3

package/dist/components/presentation/auth/SignUp/v2/BaseSignUp.d.ts

@@ -23,63 +23,63 @@ import { CardProps } from '../../../../primitives/Card/Card';
  */
 export interface BaseSignUpRenderProps {
     /**
-     * Form values
+     * Flow components
      */
-    values: Record<string, string>;
+    components: any[];
+    /**
+     * API error (if any)
+     */
+    error?: Error | null;
     /**
      * Field validation errors
      */
     fieldErrors: Record<string, string>;
     /**
-     * API error (if any)
+     * Function to handle input changes
      */
-    error?: Error | null;
+    handleInputChange: (name: string, value: string) => void;
     /**
-     * Touched fields
+     * Function to handle form submission
      */
-    touched: Record<string, boolean>;
+    handleSubmit: (component: any, data?: Record<string, any>) => Promise<void>;
+    /**
+     * Loading state
+     */
+    isLoading: boolean;
     /**
      * Whether the form is valid
      */
     isValid: boolean;
     /**
-     * Loading state
+     * Flow messages
      */
-    isLoading: boolean;
+    messages: Array<{
+        message: string;
+        type: string;
+    }>;
     /**
-     * Flow components
+     * Flow subtitle
      */
-    components: any[];
+    subtitle: string;
     /**
-     * Function to handle input changes
+     * Flow title
      */
-    handleInputChange: (name: string, value: string) => void;
+    title: string;
     /**
-     * Function to handle form submission
+     * Touched fields
      */
-    handleSubmit: (component: any, data?: Record<string, any>) => Promise<void>;
+    touched: Record<string, boolean>;
     /**
      * Function to validate the form
      */
     validateForm: () => {
-        isValid: boolean;
         fieldErrors: Record<string, string>;
+        isValid: boolean;
     };
     /**
-     * Flow title
-     */
-    title: string;
-    /**
-     * Flow subtitle
-     */
-    subtitle: string;
-    /**
-     * Flow messages
+     * Form values
      */
-    messages: Array<{
-        message: string;
-        type: string;
-    }>;
+    values: Record<string, string>;
 }
 /**
  * Props for the BaseSignUp component.
@@ -94,17 +94,21 @@ export interface BaseSignUpProps {
      */
     buttonClassName?: string;
     /**
-     * Custom CSS class name for the form container.
+     * Render props function for custom UI
      */
-    className?: string;
+    children?: (props: BaseSignUpRenderProps) => ReactNode;
     /**
-     * Custom CSS class name for error messages.
+     * Custom CSS class name for the form container.
      */
-    errorClassName?: string;
+    className?: string;
     /**
      * Error object to display
      */
     error?: Error | null;
+    /**
+     * Custom CSS class name for error messages.
+     */
+    errorClassName?: string;
     /**
      * Custom CSS class name for form inputs.
      */
@@ -141,34 +145,30 @@ export interface BaseSignUpProps {
      * @returns Promise resolving to the sign-up response.
      */
     onSubmit?: (payload: EmbeddedFlowExecuteRequestPayload) => Promise<EmbeddedFlowExecuteResponse>;
-    /**
-     * Size variant for the component.
-     */
-    size?: 'small' | 'medium' | 'large';
-    /**
-     * Theme variant for the component.
-     */
-    variant?: CardProps['variant'];
     /**
      *  Whether to redirect after sign-up.
      */
     shouldRedirectAfterSignUp?: boolean;
     /**
-     * Render props function for custom UI
+     * Whether to show the logo.
      */
-    children?: (props: BaseSignUpRenderProps) => ReactNode;
+    showLogo?: boolean;
+    /**
+     * Whether to show the subtitle.
+     */
+    showSubtitle?: boolean;
     /**
      * Whether to show the title.
      */
     showTitle?: boolean;
     /**
-     * Whether to show the subtitle.
+     * Size variant for the component.
      */
-    showSubtitle?: boolean;
+    size?: 'small' | 'medium' | 'large';
     /**
-     * Whether to show the logo.
+     * Theme variant for the component.
      */
-    showLogo?: boolean;
+    variant?: CardProps['variant'];
 }
 /**
  * BaseSignUp component that provides embedded sign-up flow for AsgardeoV2.

package/dist/components/primitives/Alert/Alert.d.ts

@@ -15,21 +15,21 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { HTMLAttributes, ReactNode, RefAttributes, ForwardRefExoticComponent } from 'react';
+import { HTMLAttributes, ReactNode, RefAttributes, ForwardRefExoticComponent, FC } from 'react';
 export type AlertVariant = 'success' | 'error' | 'warning' | 'info';
 export interface AlertProps extends HTMLAttributes<HTMLDivElement> {
     /**
-     * The visual variant of the alert that determines color scheme and icon
+     * Alert content
      */
-    variant?: AlertVariant;
+    children?: ReactNode;
     /**
      * Whether to show the default icon for the variant
      */
     showIcon?: boolean;
     /**
-     * Alert content
+     * The visual variant of the alert that determines color scheme and icon
      */
-    children?: ReactNode;
+    variant?: AlertVariant;
 }
 export interface AlertTitleProps extends HTMLAttributes<HTMLHeadingElement> {
     /**
@@ -61,14 +61,14 @@ declare const Alert: ForwardRefExoticComponent<AlertProps & RefAttributes<HTMLDi
 /**
  * Alert title component.
  */
-declare const AlertTitle: ForwardRefExoticComponent<AlertTitleProps & RefAttributes<HTMLHeadingElement>>;
+declare const AlertTitle: FC<AlertTitleProps>;
 /**
  * Alert description component.
  */
-declare const AlertDescription: ForwardRefExoticComponent<AlertDescriptionProps & RefAttributes<HTMLParagraphElement>>;
+declare const AlertDescription: FC<AlertDescriptionProps>;
 export interface AlertComponent extends ForwardRefExoticComponent<AlertProps & RefAttributes<HTMLDivElement>> {
-    Title: typeof AlertTitle;
     Description: typeof AlertDescription;
+    Title: typeof AlertTitle;
 }
 declare const _default: AlertComponent;
 export default _default;

package/dist/components/primitives/Alert/Alert.styles.d.ts

@@ -24,12 +24,5 @@ export type AlertVariant = 'success' | 'error' | 'warning' | 'info';
  * @param variant - The alert variant
  * @returns Object containing CSS class names for component styling
  */
-declare const useStyles: (theme: Theme, colorScheme: string, variant: AlertVariant) => {
-    alert: string;
-    variant: string;
-    icon: string;
-    content: string;
-    title: string;
-    description: string;
-};
+declare const useStyles: (theme: Theme, colorScheme: string, variant: AlertVariant) => Record<string, string>;
 export default useStyles;

package/dist/components/primitives/Avatar/Avatar.d.ts

@@ -37,6 +37,10 @@ export interface AvatarProps {
      * The URL of the avatar image
      */
     imageUrl?: string;
+    /**
+     * Loading state of the avatar
+     */
+    isLoading?: boolean;
     /**
      * The name to use for generating initials when no image is provided
      */
@@ -50,10 +54,6 @@ export interface AvatarProps {
      * @default 'circular'
      */
     variant?: 'circular' | 'square';
-    /**
-     * Loading state of the avatar
-     */
-    isLoading?: boolean;
 }
 export declare const Avatar: FC<AvatarProps>;
 export default Avatar;

package/dist/components/primitives/Avatar/Avatar.styles.d.ts

@@ -26,11 +26,5 @@ export type AvatarVariant = 'circular' | 'square';
  * @param backgroundColor - The background color for the avatar
  * @returns Object containing CSS class names for component styling
  */
-declare const useStyles: (theme: Theme, colorScheme: string, size: number, variant: AvatarVariant, backgroundColor?: string) => {
-    avatar: string;
-    variant: string;
-    image: string;
-    skeleton: string;
-    icon: string;
-};
+declare const useStyles: (theme: Theme, colorScheme: string, size: number, variant: AvatarVariant, backgroundColor?: string) => Record<string, string>;
 export default useStyles;

package/dist/components/primitives/Button/Button.d.ts

@@ -15,7 +15,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { ButtonHTMLAttributes } from 'react';
+import { ButtonHTMLAttributes, ReactNode, ForwardRefExoticComponent, RefAttributes } from 'react';
 export type ButtonColor = 'primary' | 'secondary' | 'tertiary' | string;
 export type ButtonVariant = 'solid' | 'outline' | 'text' | 'icon';
 export type ButtonSize = 'small' | 'medium' | 'large';
@@ -25,13 +25,9 @@ export interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement
      */
     color?: ButtonColor;
     /**
-     * The button variant that determines the visual style
-     */
-    variant?: ButtonVariant;
-    /**
-     * The size of the button
+     * Icon to display after the button text
      */
-    size?: ButtonSize;
+    endIcon?: ReactNode;
     /**
      * Whether the button should take the full width of its container
      */
@@ -41,17 +37,21 @@ export interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement
      */
     loading?: boolean;
     /**
-     * Icon to display before the button text
+     * The shape of the button: square or round
+     */
+    shape?: 'square' | 'round';
+    /**
+     * The size of the button
      */
-    startIcon?: React.ReactNode;
+    size?: ButtonSize;
     /**
-     * Icon to display after the button text
+     * Icon to display before the button text
      */
-    endIcon?: React.ReactNode;
+    startIcon?: ReactNode;
     /**
-     * The shape of the button: square or round
+     * The button variant that determines the visual style
      */
-    shape?: 'square' | 'round';
+    variant?: ButtonVariant;
 }
 /**
  * Button component with multiple variants and types.
@@ -83,5 +83,5 @@ export interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement
  * </Button>
  * ```
  */
-declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+declare const Button: ForwardRefExoticComponent<ButtonProps & RefAttributes<HTMLButtonElement>>;
 export default Button;

package/dist/components/primitives/Button/Button.styles.d.ts

@@ -31,17 +31,5 @@ export type ButtonSize = 'small' | 'medium' | 'large';
  * @param loading - Whether the button is in loading state
  * @returns Object containing CSS class names for component styling
  */
-declare const useStyles: (theme: Theme, colorScheme: string, color: ButtonColor, variant: ButtonVariant, size: ButtonSize, fullWidth: boolean, disabled: boolean, loading: boolean, shape?: "square" | "round") => {
-    button: string;
-    size: string;
-    variant: string;
-    fullWidth: string;
-    loading: string;
-    shape: string;
-    spinner: string;
-    icon: string;
-    startIcon: string;
-    endIcon: string;
-    content: string;
-};
+declare const useStyles: (theme: Theme, colorScheme: string, color: ButtonColor, variant: ButtonVariant, size: ButtonSize, fullWidth: boolean, disabled: boolean, loading: boolean, shape?: "square" | "round") => Record<string, string | null>;
 export default useStyles;

package/dist/components/primitives/Card/Card.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) {{year}}, WSO2 LLC. (https://www.wso2.com).
+ * 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
@@ -15,7 +15,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { HTMLAttributes, ReactNode, ForwardRefExoticComponent, RefAttributes } from 'react';
+import { HTMLAttributes, ReactNode, ForwardRefExoticComponent, RefAttributes, FC } from 'react';
 export type CardVariant = 'default' | 'outlined' | 'elevated';
 export interface CardProps extends HTMLAttributes<HTMLDivElement> {
     /**
@@ -102,11 +102,11 @@ declare const CardHeader: ForwardRefExoticComponent<CardHeaderProps & RefAttribu
 /**
  * Card title component.
  */
-declare const CardTitle: ForwardRefExoticComponent<CardTitleProps & RefAttributes<HTMLHeadingElement>>;
+declare const CardTitle: FC<CardTitleProps>;
 /**
  * Card description component.
  */
-declare const CardDescription: ForwardRefExoticComponent<CardDescriptionProps & RefAttributes<HTMLParagraphElement>>;
+declare const CardDescription: FC<CardDescriptionProps>;
 /**
  * Card action component for action elements in the header.
  */

package/dist/components/primitives/Card/Card.styles.d.ts

@@ -25,15 +25,5 @@ export type CardVariant = 'default' | 'outlined' | 'elevated';
  * @param clickable - Whether the card is clickable
  * @returns Object containing CSS class names for component styling
  */
-declare const useStyles: (theme: Theme, colorScheme: string, variant: CardVariant, clickable: boolean) => {
-    card: string;
-    variant: string;
-    clickable: string;
-    header: string;
-    title: string;
-    description: string;
-    action: string;
-    content: string;
-    footer: string;
-};
+declare const useStyles: (theme: Theme, colorScheme: string, variant: CardVariant, clickable: boolean) => Record<string, string>;
 export default useStyles;

package/dist/components/primitives/Checkbox/Checkbox.d.ts

@@ -18,25 +18,25 @@
 import { FC, InputHTMLAttributes } from 'react';
 export interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'type'> {
     /**
-     * Label text to display next to the checkbox
+     * Additional CSS class names
      */
-    label?: string;
+    className?: string;
     /**
      * Error message to display below the checkbox
      */
     error?: string;
     /**
-     * Additional CSS class names
+     * Helper text to display below the checkbox
      */
-    className?: string;
+    helperText?: string;
     /**
-     * Whether the field is required
+     * Label text to display next to the checkbox
      */
-    required?: boolean;
+    label?: string;
     /**
-     * Helper text to display below the checkbox
+     * Whether the field is required
      */
-    helperText?: string;
+    required?: boolean;
 }
 declare const Checkbox: FC<CheckboxProps>;
 export default Checkbox;

package/dist/components/primitives/Checkbox/Checkbox.styles.d.ts

@@ -24,12 +24,5 @@ import { Theme } from '@asgardeo/browser';
  * @param required - Whether the checkbox is required
  * @returns Object containing CSS class names for component styling
  */
-declare const useStyles: (theme: Theme, colorScheme: string, hasError: boolean, required: boolean) => {
-    container: string;
-    input: string;
-    errorInput: string;
-    label: string;
-    errorLabel: string;
-    required: string;
-};
+declare const useStyles: (theme: Theme, colorScheme: string, hasError: boolean, required: boolean) => Record<string, string>;
 export default useStyles;

package/dist/components/primitives/DatePicker/DatePicker.d.ts

@@ -17,34 +17,34 @@
  */
 import { FC, InputHTMLAttributes } from 'react';
 export interface DatePickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'type'> {
-    /**
-     * Label text to display above the input
-     */
-    label?: string;
-    /**
-     * Error message to display below the input
-     */
-    error?: string;
     /**
      * Additional CSS class names
      */
     className?: string;
     /**
-     * Whether the field is required
+     * Custom date format for the regex pattern
      */
-    required?: boolean;
+    dateFormat?: string;
     /**
      * Whether the field is disabled
      */
     disabled?: boolean;
+    /**
+     * Error message to display below the input
+     */
+    error?: string;
     /**
      * Helper text to display below the input
      */
     helperText?: string;
     /**
-     * Custom date format for the regex pattern
+     * Label text to display above the input
      */
-    dateFormat?: string;
+    label?: string;
+    /**
+     * Whether the field is required
+     */
+    required?: boolean;
 }
 declare const DatePicker: FC<DatePickerProps>;
 export default DatePicker;

package/dist/components/primitives/DatePicker/DatePicker.styles.d.ts

@@ -24,10 +24,5 @@ import { Theme } from '@asgardeo/browser';
  * @param disabled - Whether the date picker is disabled
  * @returns Object containing CSS class names for component styling
  */
-declare const useStyles: (theme: Theme, colorScheme: string, hasError: boolean, disabled: boolean) => {
-    input: string;
-    errorInput: string;
-    disabledInput: string;
-    label: string;
-};
+declare const useStyles: (theme: Theme, colorScheme: string, hasError: boolean, disabled: boolean) => Record<string, string>;
 export default useStyles;

package/dist/components/primitives/Dialog/Dialog.d.ts

@@ -16,7 +16,7 @@
  * under the License.
  */
 import { UseFloatingReturn, UseInteractionsReturn } from '@floating-ui/react';
-import React from 'react';
+import { type ButtonHTMLAttributes, type Dispatch, type FC, type ForwardRefExoticComponent, type HTMLProps, type JSX, type ReactNode, type RefAttributes, type SetStateAction } from 'react';
 interface DialogOptions {
     initialOpen?: boolean;
     onOpenChange?: (open: boolean) => void;
@@ -26,36 +26,36 @@ interface DialogHookReturn extends UseFloatingReturn, UseInteractionsReturn {
     descriptionId: string | undefined;
     labelId: string | undefined;
     open: boolean;
-    setDescriptionId: React.Dispatch<React.SetStateAction<string | undefined>>;
-    setLabelId: React.Dispatch<React.SetStateAction<string | undefined>>;
+    setDescriptionId: Dispatch<SetStateAction<string | undefined>>;
+    setLabelId: Dispatch<SetStateAction<string | undefined>>;
     setOpen: (open: boolean) => void;
 }
 export declare function useDialog({ initialOpen, open: controlledOpen, onOpenChange: setControlledOpen, }?: DialogOptions): DialogHookReturn;
 export declare const useDialogContext: () => DialogHookReturn;
 export declare function Dialog({ children, ...options }: {
-    children: React.ReactNode;
-} & DialogOptions): import("react/jsx-runtime").JSX.Element;
+    children: ReactNode;
+} & DialogOptions): JSX.Element;
 interface DialogTriggerProps {
     asChild?: boolean;
-    children: React.ReactNode;
+    children: ReactNode;
 }
-export declare const DialogTrigger: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLElement> & DialogTriggerProps, "ref"> & React.RefAttributes<HTMLElement>>;
-export declare const DialogContent: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export declare const DialogHeading: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
-export declare const DialogDescription: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+export declare const DialogTrigger: ForwardRefExoticComponent<HTMLProps<HTMLElement> & DialogTriggerProps & RefAttributes<HTMLElement>>;
+export declare const DialogContent: ForwardRefExoticComponent<HTMLProps<HTMLDivElement> & RefAttributes<HTMLDivElement>>;
+export declare const DialogHeading: ForwardRefExoticComponent<HTMLProps<HTMLHeadingElement> & RefAttributes<HTMLHeadingElement>>;
+export declare const DialogDescription: ForwardRefExoticComponent<HTMLProps<HTMLParagraphElement> & RefAttributes<HTMLParagraphElement>>;
 interface DialogCloseProps {
     asChild?: boolean;
-    children?: React.ReactNode;
+    children?: ReactNode;
 }
-export declare const DialogClose: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
-export interface DialogComponent extends React.FC<{
-    children: React.ReactNode;
+export declare const DialogClose: ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & DialogCloseProps & RefAttributes<HTMLButtonElement>>;
+export interface DialogComponent extends FC<{
+    children: ReactNode;
 } & DialogOptions> {
-    Trigger: typeof DialogTrigger;
+    Close: typeof DialogClose;
     Content: typeof DialogContent;
-    Heading: typeof DialogHeading;
     Description: typeof DialogDescription;
-    Close: typeof DialogClose;
+    Heading: typeof DialogHeading;
+    Trigger: typeof DialogTrigger;
 }
 declare const _default: DialogComponent;
 export default _default;

package/dist/components/primitives/Dialog/Dialog.styles.d.ts

@@ -22,13 +22,5 @@ import { Theme } from '@asgardeo/browser';
  * @param colorScheme - The current color scheme (used for memoization)
  * @returns Object containing CSS class names for component styling
  */
-declare const useStyles: (theme: Theme, colorScheme: string) => {
-    overlay: string;
-    content: string;
-    dropdownContent: string;
-    header: string;
-    headerTitle: string;
-    contentBody: string;
-    description: string;
-};
+declare const useStyles: (theme: Theme, colorScheme: string) => Record<string, string>;
 export default useStyles;

package/dist/components/primitives/Divider/Divider.d.ts

@@ -15,14 +15,14 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { FC, HTMLAttributes } from 'react';
+import { FC, HTMLAttributes, ReactNode } from 'react';
 export type DividerOrientation = 'horizontal' | 'vertical';
 export type DividerVariant = 'solid' | 'dashed' | 'dotted';
 export interface DividerProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * Text to display in the center of the divider
      */
-    children?: React.ReactNode;
+    children?: ReactNode;
     /**
      * Custom color for the divider
      */

package/dist/components/primitives/Divider/Divider.styles.d.ts

@@ -28,11 +28,5 @@ export type DividerVariant = 'solid' | 'dashed' | 'dotted';
  * @param hasChildren - Whether the divider has children (text)
  * @returns Object containing CSS class names for component styling
  */
-declare const useStyles: (theme: Theme, colorScheme: string, orientation: DividerOrientation, variant: DividerVariant, color?: string, hasChildren?: boolean) => {
-    divider: string;
-    vertical: string;
-    horizontal: string;
-    line: string;
-    text: string;
-};
+declare const useStyles: (theme: Theme, colorScheme: string, orientation: DividerOrientation, variant: DividerVariant, color?: string, hasChildren?: boolean) => Record<string, string>;
 export default useStyles;

package/dist/components/primitives/FormControl/FormControl.d.ts

@@ -22,6 +22,10 @@ export interface FormControlProps {
      * The content to be wrapped by the form control
      */
     children: ReactNode;
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
     /**
      * Error message to display below the content
      */
@@ -30,10 +34,6 @@ export interface FormControlProps {
      * Helper text to display below the content
      */
     helperText?: string;
-    /**
-     * Additional CSS class names
-     */
-    className?: string;
     /**
      * Custom alignment for helper text (default: left, center for OTP)
      */

package/dist/components/primitives/FormControl/FormControl.styles.d.ts

@@ -26,9 +26,5 @@ export type FormControlHelperTextAlign = 'left' | 'center';
  * @param hasError - Whether the form control has an error
  * @returns Object containing CSS class names for component styling
  */
-declare const useStyles: (theme: Theme, colorScheme: string, helperTextAlign: FormControlHelperTextAlign, helperTextMarginLeft?: string, hasError?: boolean) => {
-    formControl: string;
-    helperText: string;
-    helperTextError: string;
-};
+declare const useStyles: (theme: Theme, colorScheme: string, helperTextAlign: FormControlHelperTextAlign, helperTextMarginLeft?: string, hasError?: boolean) => Record<string, string>;
 export default useStyles;