@asgardeo/react 0.14.1 → 0.14.2

package/dist/components/adapters/Consent.d.ts

@@ -0,0 +1,90 @@
+/**
+ * Copyright (c) 2026, 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 { type ConsentPurposeDataV2 as ConsentPurposeData } from '@asgardeo/browser';
+import { FC, ReactNode } from 'react';
+/**
+ * Consent purpose structure as expected from the backend.
+ * The `essential` and `optional` arrays contain the list of attribute names that fall under
+ * each category for the given purpose.
+ */
+export interface ConsentPurpose {
+    /** Optional human-readable description of the purpose */
+    description?: string;
+    /** Attributes that are always required and cannot be declined */
+    essential?: string[];
+    /** Attributes that the user can optionally decline */
+    optional?: string[];
+    /** Unique identifier for the purpose */
+    purpose_id: string;
+    /** Name of the purpose to display in the UI */
+    purpose_name: string;
+}
+/**
+ * Render props exposed by Consent when using the render-prop pattern.
+ */
+export interface ConsentRenderProps {
+    /** Current form values - used to read optional checkbox state. */
+    formValues: Record<string, string>;
+    /** Callback invoked when a user toggles an optional attribute. */
+    onInputChange: (name: string, value: string) => void;
+    /** The resolved list of consent purposes parsed from `consentData`. */
+    purposes: ConsentPurposeData[];
+}
+/**
+ * Props for the Consent component.
+ */
+export interface ConsentProps {
+    /**
+     * Render-props callback. When provided, the default consent UI is replaced with
+     * whatever JSX the callback returns. The parsed `purposes` list is injected so
+     * consumers do not need to re-parse `consentData` themselves.
+     *
+     * @example
+     * ```tsx
+     * <Consent consentData={raw} formValues={formInputs} onInputChange={onChange} t={t}>
+     *   {({ purposes, formValues, onInputChange, t }) => (
+     *     <div>
+     *       {purposes.map(p => <MyConsentSection key={p.purpose_id} purpose={p} />)}
+     *     </div>
+     *   )}
+     * </Consent>
+     * ```
+     */
+    children?: (props: ConsentRenderProps) => ReactNode;
+    /**
+     * The raw JSON string returned by the backend in `additionalData.consentPrompt`.
+     */
+    consentData?: string | ConsentPurpose[] | {
+        purposes: ConsentPurpose[];
+    };
+    /**
+     * Current form values - used to read optional checkbox state.
+     */
+    formValues: Record<string, string>;
+    /**
+     * Callback invoked when a user toggles an optional attribute.
+     */
+    onInputChange: (name: string, value: string) => void;
+}
+/**
+ * Consent component renders the list of purposes and their associated attributes (essential and optional)
+ * based on the data provided by the backend. It allows users to toggle optional attributes while essential
+ * attributes are displayed as read-only.
+ */
+declare const Consent: FC<ConsentProps>;
+export default Consent;

package/dist/components/adapters/ConsentCheckboxList.d.ts

@@ -0,0 +1,94 @@
+/**
+ * Copyright (c) 2026, 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 { type ConsentPurposeDataV2 as ConsentPurposeData } from '@asgardeo/browser';
+import { FC, ReactNode } from 'react';
+/**
+ * Computes the form value key for tracking an optional attribute's consent state.
+ *
+ * @param purposeId - The ID of the consent purpose.
+ * @param attrName - The name of the attribute.
+ * @returns A stable form key string.
+ */
+export declare const getConsentOptionalKey: (purposeId: string, attrName: string) => string;
+/**
+ * ConsentInputVariant defines whether the ConsentCheckboxList is rendering essential (read-only) or
+ * optional (toggleable) attributes.
+ */
+export type ConsentInputVariant = 'ESSENTIAL' | 'OPTIONAL';
+/**
+ * Render props exposed by ConsentCheckboxList when using the render-prop pattern.
+ */
+export interface ConsentCheckboxListRenderProps {
+    /** The list of attribute names to render. */
+    attributes: string[];
+    /**
+     * Call this when an optional attribute checkbox is toggled.
+     * No-op for ESSENTIAL attributes (they cannot be changed).
+     */
+    handleChange: (attrName: string, checked: boolean) => void;
+    /**
+     * Returns the current checked state for the given attribute name.
+     * Always returns true for ESSENTIAL attributes.
+     */
+    isChecked: (attrName: string) => boolean;
+    /** Whether the list is rendering essential or optional attributes. */
+    variant: ConsentInputVariant;
+}
+/**
+ * Props for the ConsentCheckboxList component.
+ */
+export interface ConsentCheckboxListProps {
+    /**
+     * Render-props callback. When provided, the default checkbox list UI is replaced
+     * with whatever JSX the callback returns.
+     *
+     * @example
+     * ```tsx
+     * <ConsentCheckboxList variant="OPTIONAL" purpose={purpose} formValues={formValues} onInputChange={onChange}>
+     *   {({ attributes, isChecked, handleChange }) => (
+     *     <ul>
+     *       {attributes.map(attr => (
+     *         <li key={attr}>
+     *           <Checkbox checked={isChecked(attr)} onChange={e => handleChange(attr, e.target.checked)} />
+     *           {attr}
+     *         </li>
+     *       ))}
+     *     </ul>
+     *   )}
+     * </ConsentCheckboxList>
+     * ```
+     */
+    children?: (props: ConsentCheckboxListRenderProps) => ReactNode;
+    /** Current form values - used to read optional checkbox state */
+    formValues: Record<string, string>;
+    /** Callback invoked when an optional attribute checkbox is toggled */
+    onInputChange: (name: string, value: string) => void;
+    /** The consent purpose data containing attribute lists */
+    purpose: ConsentPurposeData;
+    /** Whether to render essential (disabled) or optional (toggleable) attributes */
+    variant: ConsentInputVariant;
+}
+/**
+ * Renders a list of consent attribute checkboxes.
+ *
+ * - ESSENTIAL variant: renders read-only checked checkboxes for required attributes.
+ * - OPTIONAL variant: renders toggleable checkboxes for optional attributes.
+ *   Opt-in is the default when no prior form value exists.
+ */
+declare const ConsentCheckboxList: FC<ConsentCheckboxListProps>;
+export default ConsentCheckboxList;

package/dist/components/adapters/FlowTimer.d.ts

@@ -0,0 +1,62 @@
+/**
+ * Copyright (c) 2026, 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 { FC, ReactNode } from 'react';
+/**
+ * Render props exposed by FlowTimer when using the render-prop pattern.
+ */
+export interface FlowTimerRenderProps {
+    /** Human-readable formatted time string (e.g. "2:30" or "Timed out"). */
+    formattedTime: string;
+    /** Whether the timer has expired. */
+    isExpired: boolean;
+    /** Remaining time in seconds. 0 when expired. */
+    remaining: number;
+}
+/**
+ * Props for the FlowTimer component.
+ */
+export interface FlowTimerProps {
+    /**
+     * Render-props callback. When provided, the default countdown display is replaced
+     * with whatever JSX the callback returns.
+     *
+     * @example
+     * ```tsx
+     * <FlowTimer expiresIn={300}>
+     *   {({ remaining, isExpired, formattedTime }) => (
+     *     <span style={{ color: isExpired ? 'red' : 'inherit' }}>
+     *       {isExpired ? 'Session expired' : `Time left: ${formattedTime}`}
+     *     </span>
+     *   )}
+     * </FlowTimer>
+     * ```
+     */
+    children?: (props: FlowTimerRenderProps) => ReactNode;
+    /** Initial number of seconds for the countdown. 0 or negative means no timer. */
+    expiresIn?: number;
+    /** Text template for the countdown display. Use {time} as a placeholder. */
+    textTemplate?: string;
+}
+/**
+ * Flow countdown timer component.
+ *
+ * Displays a countdown from the given number of seconds. When the time expires,
+ * shows "Timed out". Returns null if expiresIn <= 0.
+ */
+declare const FlowTimer: FC<FlowTimerProps>;
+export default FlowTimer;

package/dist/components/presentation/auth/AuthOptionFactory.d.ts

@@ -23,8 +23,12 @@ export type AuthType = 'signin' | 'signup';
  * Processes an array of components and renders them as React elements for sign-in.
  */
 export declare const renderSignInComponents: (components: EmbeddedFlowComponent[], formValues: Record<string, string>, touchedFields: Record<string, boolean>, formErrors: Record<string, string>, isLoading: boolean, isFormValid: boolean, onInputChange: (name: string, value: string) => void, options?: {
+    /** Additional data from the flow response */
+    additionalData?: Record<string, any>;
     buttonClassName?: string;
     inputClassName?: string;
+    /** Flag to determine if the step timeline has expired */
+    isTimeoutDisabled?: boolean;
     /** Flow metadata for resolving {{meta(...)}} expressions at render time */
     meta?: FlowMetadataResponse | null;
     onInputBlur?: (name: string) => void;
@@ -38,6 +42,8 @@ export declare const renderSignInComponents: (components: EmbeddedFlowComponent[
  * Processes an array of components and renders them as React elements for sign-up.
  */
 export declare const renderSignUpComponents: (components: EmbeddedFlowComponent[], formValues: Record<string, string>, touchedFields: Record<string, boolean>, formErrors: Record<string, string>, isLoading: boolean, isFormValid: boolean, onInputChange: (name: string, value: string) => void, options?: {
+    /** Additional data from the flow response */
+    additionalData?: Record<string, any>;
     buttonClassName?: string;
     inputClassName?: string;
     /** Flow metadata for resolving {{meta(...)}} expressions at render time */
@@ -54,6 +60,8 @@ export declare const renderSignUpComponents: (components: EmbeddedFlowComponent[
  * This is used by both InviteUser and AcceptInvite components.
  */
 export declare const renderInviteUserComponents: (components: EmbeddedFlowComponent[], formValues: Record<string, string>, touchedFields: Record<string, boolean>, formErrors: Record<string, string>, isLoading: boolean, isFormValid: boolean, onInputChange: (name: string, value: string) => void, options?: {
+    /** Additional data from the flow response */
+    additionalData?: Record<string, any>;
     buttonClassName?: string;
     inputClassName?: string;
     /** Flow metadata for resolving {{meta(...)}} expressions at render time */

package/dist/components/presentation/auth/SignIn/v2/BaseSignIn.d.ts

@@ -46,6 +46,10 @@ export interface BaseSignInRenderProps {
      * Loading state
      */
     isLoading: boolean;
+    /**
+     * Flag indicating if the step timer has reached zero
+     */
+    isTimeoutDisabled?: boolean;
     /**
      * Whether the form is valid
      */
@@ -89,6 +93,10 @@ export interface BaseSignInRenderProps {
  * Props for the BaseSignIn component.
  */
 export interface BaseSignInProps {
+    /**
+     * Additional data from the flow response.
+     */
+    additionalData?: Record<string, any>;
     /**
      * Custom CSS class name for the submit button.
      */
@@ -121,6 +129,10 @@ export interface BaseSignInProps {
      * Flag to determine if the component is ready to be rendered.
      */
     isLoading?: boolean;
+    /**
+     * Timer flag disabling actions
+     */
+    isTimeoutDisabled?: boolean;
     /**
      * Custom CSS class name for info messages.
      */

package/dist/components/presentation/auth/SignIn/v2/SignIn.d.ts

@@ -22,6 +22,11 @@ import { BaseSignInProps } from './BaseSignIn';
  * Render props function parameters
  */
 export interface SignInRenderProps {
+    /**
+     * Additional data from the flow response containing contextual information
+     * like consent prompt details and session timeouts.
+     */
+    additionalData?: Record<string, any>;
     /**
      * Current flow components
      */
@@ -42,6 +47,11 @@ export interface SignInRenderProps {
      * Loading state indicator
      */
     isLoading: boolean;
+    /**
+     * Flag indicating whether the flow step timeout has expired.
+     * Consuming components can use this to disable submit buttons.
+     */
+    isTimeoutDisabled?: boolean;
     /**
      * Flow metadata returned by the platform (v2 only). `null` while loading or unavailable.
      */

package/dist/index.d.ts

@@ -99,6 +99,12 @@ export { default as SmsOtp } from './components/presentation/auth/SignIn/v1/opti
 export { default as SocialButton } from './components/presentation/auth/SignIn/v1/options/SocialButton';
 export { default as MultiOptionButton } from './components/presentation/auth/SignIn/v1/options/MultiOptionButton';
 export * from './components/presentation/auth/SignIn/v1/options/SignInOptionFactory';
+export { default as FlowTimer } from './components/adapters/FlowTimer';
+export * from './components/adapters/FlowTimer';
+export { default as ConsentCheckboxList } from './components/adapters/ConsentCheckboxList';
+export * from './components/adapters/ConsentCheckboxList';
+export { default as Consent } from './components/adapters/Consent';
+export * from './components/adapters/Consent';
 export { default as BaseUser } from './components/presentation/User/BaseUser';
 export * from './components/presentation/User/BaseUser';
 export { default as User } from './components/presentation/User/User';