@asgardeo/react 0.23.6 → 0.24.0

package/dist/index.js

@@ -45,6 +45,7 @@ var AsgardeoContext = createContext({
   organizationHandle: void 0,
   platform: void 0,
   reInitialize: null,
+  recover: () => Promise.resolve({}),
   resolveFlowTemplateLiterals: (text) => text ?? "",
   signIn: () => Promise.resolve({}),
   signInOptions: {},
@@ -77,6 +78,7 @@ import {
   Platform,
   isEmpty,
   executeEmbeddedSignUpFlowV2,
+  executeEmbeddedRecoveryFlowV2,
   EmbeddedSignInFlowStatusV2
 } from "@asgardeo/browser";
 
@@ -903,6 +905,18 @@ var AsgardeoReactClient = class extends AsgardeoBrowserClient {
     navigate(getRedirectBasedSignUpUrl(config));
     return void 0;
   }
+  async recover(payload) {
+    const config = await this.asgardeo.getConfigData();
+    const baseUrl = config?.baseUrl;
+    const isV2Platform = config && config.platform === Platform.AsgardeoV2;
+    if (isV2Platform) {
+      return executeEmbeddedRecoveryFlowV2({
+        baseUrl,
+        payload: { ...payload, verbose: true }
+      });
+    }
+    return void 0;
+  }
   async getDiscoveryResponse() {
     const storageManager = await this.asgardeo.getStorageManager();
     return storageManager.loadOpenIDProviderConfiguration();
@@ -2428,6 +2442,10 @@ var AsgardeoProvider = ({
     async (...args) => asgardeo.signOut(...args),
     [asgardeo]
   );
+  const recover = useCallback8(
+    async (payload) => asgardeo.recover(payload),
+    [asgardeo]
+  );
   const signUp = useCallback8(
     async (...args) => asgardeo.signUp(...args),
     [asgardeo]
@@ -2468,6 +2486,7 @@ var AsgardeoProvider = ({
       organizationHandle: config?.organizationHandle,
       platform: config?.platform,
       reInitialize,
+      recover,
       signIn,
       signInOptions,
       signInSilently,
@@ -2500,17 +2519,18 @@ var AsgardeoProvider = ({
       syncSession,
       switchOrganization,
       getDecodedIdToken,
+      clearSession,
+      exchangeToken,
       getAccessToken,
       getStorageManager,
+      instanceId,
+      organizationChain,
+      recover,
+      reInitialize,
       request,
       requestAll,
-      exchangeToken,
       signOut,
-      signUp,
-      clearSession,
-      reInitialize,
-      instanceId,
-      organizationChain
+      signUp
     ]
   );
   return /* @__PURE__ */ jsx11(AsgardeoContext_default.Provider, { value, children: /* @__PURE__ */ jsx11(I18nProvider_default, { preferences: preferences?.i18n, children: /* @__PURE__ */ jsx11(FlowMetaProvider_default, { enabled: preferences?.resolveFromMeta !== false, children: /* @__PURE__ */ jsx11(
@@ -9263,6 +9283,22 @@ var renderSignUpComponents = (components, formValues, touchedFields, formErrors,
     }
   )
 ).filter(Boolean);
+var renderRecoveryComponents = (components, formValues, touchedFields, formErrors, isLoading, isFormValid, onInputChange, options) => components.map(
+  (component, index) => createAuthComponentFromFlow(
+    component,
+    formValues,
+    touchedFields,
+    formErrors,
+    isLoading,
+    isFormValid,
+    onInputChange,
+    "recovery",
+    {
+      ...options,
+      key: component.id || index
+    }
+  )
+).filter(Boolean);
 var renderInviteUserComponents = (components, formValues, touchedFields, formErrors, isLoading, isFormValid, onInputChange, options) => components.map(
   (component, index) => createAuthComponentFromFlow(
     component,
@@ -12283,180 +12319,1104 @@ var SignUp3 = (props) => {
 };
 var SignUp_default3 = SignUp3;
 
-// src/components/presentation/auth/InviteUser/v2/InviteUser.tsx
-import { EmbeddedFlowType as EmbeddedFlowType5, getOrganizationUnitChildren } from "@asgardeo/browser";
-import { useCallback as useCallback17 } from "react";
+// src/components/presentation/auth/Recovery/BaseRecovery.tsx
+import { Platform as Platform9 } from "@asgardeo/browser";
 
-// src/components/presentation/auth/InviteUser/v2/BaseInviteUser.tsx
+// src/components/presentation/auth/Recovery/v1/BaseRecovery.tsx
 import {
-  EmbeddedFlowType as EmbeddedFlowType4,
-  logger as logger10
+  EmbeddedFlowStatus as EmbeddedFlowStatus3,
+  EmbeddedFlowComponentType as EmbeddedFlowComponentType6,
+  withVendorCSSClassPrefix as withVendorCSSClassPrefix25
 } from "@asgardeo/browser";
 import { cx as cx26 } from "@emotion/css";
-import { useCallback as useCallback16, useContext as useContext13, useEffect as useEffect21, useRef as useRef10, useState as useState23 } from "react";
+import { useEffect as useEffect21, useState as useState23, useCallback as useCallback16, useRef as useRef10 } from "react";
 
-// src/components/presentation/auth/InviteUser/v2/BaseInviteUser.styles.ts
-import { css as css23 } from "@emotion/css";
-import { useMemo as useMemo30 } from "react";
-var useStyles22 = (theme, colorScheme) => useMemo30(() => {
-  const card = css23`
-      background: ${theme.vars.colors.background.surface};
-      border-radius: ${theme.vars.borderRadius.large};
-      gap: calc(${theme.vars.spacing.unit} * 2);
-      min-width: 420px;
-      font-family: ${theme.vars.typography.fontFamily};
-    `;
-  const header = css23`
-      gap: 0;
-      align-items: center;
-    `;
-  const title = css23`
-      margin: 0 0 calc(${theme.vars.spacing.unit} * 1) 0;
-      color: ${theme.vars.colors.text.primary};
-    `;
-  const subtitle = css23`
-      margin-bottom: calc(${theme.vars.spacing.unit} * 1);
-      color: ${theme.vars.colors.text.secondary};
-    `;
-  return {
-    card,
-    header,
-    subtitle,
-    title
-  };
-}, [
-  theme.vars.colors.background.surface,
-  theme.vars.colors.text.primary,
-  theme.vars.colors.text.secondary,
-  theme.vars.borderRadius.large,
-  theme.vars.spacing.unit,
-  theme.vars.typography.fontFamily,
-  colorScheme
-]);
-var BaseInviteUser_styles_default = useStyles22;
+// src/components/presentation/auth/Recovery/v1/RecoveryOptionFactory.tsx
+import { EmbeddedFlowComponentType as EmbeddedFlowComponentType5 } from "@asgardeo/browser";
+import { jsx as jsx87 } from "react/jsx-runtime";
+var createRecoveryComponent = ({ component, onSubmit, ...rest }) => {
+  switch (component.type) {
+    case EmbeddedFlowComponentType5.Typography:
+      return /* @__PURE__ */ jsx87(Typography_default2, { component, onSubmit, ...rest });
+    case EmbeddedFlowComponentType5.Input: {
+      const inputVariant = component.variant?.toUpperCase();
+      const inputType = component.config["type"]?.toLowerCase();
+      if (inputVariant === "EMAIL" || inputType === "email") {
+        return /* @__PURE__ */ jsx87(EmailInput_default, { component, onSubmit, ...rest });
+      }
+      if (inputVariant === "PASSWORD" || inputType === "password") {
+        return /* @__PURE__ */ jsx87(PasswordInput_default, { component, onSubmit, ...rest });
+      }
+      if (inputVariant === "TELEPHONE" || inputType === "tel") {
+        return /* @__PURE__ */ jsx87(TelephoneInput_default, { component, onSubmit, ...rest });
+      }
+      if (inputVariant === "NUMBER" || inputType === "number") {
+        return /* @__PURE__ */ jsx87(NumberInput_default, { component, onSubmit, ...rest });
+      }
+      if (inputVariant === "DATE" || inputType === "date") {
+        return /* @__PURE__ */ jsx87(DateInput_default, { component, onSubmit, ...rest });
+      }
+      if (inputVariant === "CHECKBOX" || inputType === "checkbox") {
+        return /* @__PURE__ */ jsx87(CheckboxInput_default, { component, onSubmit, ...rest });
+      }
+      return /* @__PURE__ */ jsx87(TextInput_default, { component, onSubmit, ...rest });
+    }
+    case EmbeddedFlowComponentType5.Button: {
+      const buttonVariant = component.variant?.toUpperCase();
+      const buttonText = component.config["text"] || component.config["label"] || "";
+      if (buttonVariant === "SOCIAL") {
+        if (buttonText.toLowerCase().includes("google")) {
+          return /* @__PURE__ */ jsx87(GoogleButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
+        }
+        if (buttonText.toLowerCase().includes("github")) {
+          return /* @__PURE__ */ jsx87(GitHubButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
+        }
+        if (buttonText.toLowerCase().includes("microsoft")) {
+          return /* @__PURE__ */ jsx87(MicrosoftButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
+        }
+        if (buttonText.toLowerCase().includes("facebook")) {
+          return /* @__PURE__ */ jsx87(FacebookButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
+        }
+        if (buttonText.toLowerCase().includes("linkedin")) {
+          return /* @__PURE__ */ jsx87(LinkedInButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
+        }
+        if (buttonText.toLowerCase().includes("ethereum")) {
+          return /* @__PURE__ */ jsx87(SignInWithEthereumButton_default, { onClick: () => onSubmit(component, {}), ...rest, children: buttonText });
+        }
+      }
+      return /* @__PURE__ */ jsx87(SubmitButton_default, { component, onSubmit, ...rest });
+    }
+    case EmbeddedFlowComponentType5.Form:
+      return /* @__PURE__ */ jsx87(FormContainer_default, { component, onSubmit, ...rest });
+    case EmbeddedFlowComponentType5.Select:
+      return /* @__PURE__ */ jsx87(SelectInput_default, { component, onSubmit, ...rest });
+    case EmbeddedFlowComponentType5.Divider:
+      return /* @__PURE__ */ jsx87(DividerComponent_default, { component, onSubmit, ...rest });
+    case EmbeddedFlowComponentType5.Image:
+      return /* @__PURE__ */ jsx87(ImageComponent_default, { component, onSubmit, ...rest });
+    default:
+      return /* @__PURE__ */ jsx87("div", {});
+  }
+};
+var createRecoveryOptionFromComponent = (component, formValues, touchedFields, formErrors, isLoading, isFormValid, onInputChange, options) => createRecoveryComponent({
+  component,
+  formErrors,
+  formValues,
+  isFormValid,
+  isLoading,
+  onInputChange,
+  touchedFields,
+  ...options
+});
+var renderRecoveryComponents2 = (components, formValues, touchedFields, formErrors, isLoading, isFormValid, onInputChange, options) => components.map(
+  (component, index) => createRecoveryOptionFromComponent(
+    component,
+    formValues,
+    touchedFields,
+    formErrors,
+    isLoading,
+    isFormValid,
+    onInputChange,
+    {
+      ...options,
+      // Use component id as key, fallback to index
+      key: component.id || index
+    }
+  )
+).filter(Boolean);
 
-// src/components/presentation/auth/InviteUser/v2/BaseInviteUser.tsx
-import { jsx as jsx87, jsxs as jsxs37 } from "react/jsx-runtime";
-var BaseInviteUser = ({
+// src/components/presentation/auth/Recovery/v1/BaseRecovery.tsx
+import { jsx as jsx88, jsxs as jsxs37 } from "react/jsx-runtime";
+var BaseRecoveryContent = ({
   onInitialize,
   onSubmit,
   onError,
   onFlowChange,
+  onComplete,
   className = "",
-  children,
-  fetchOrganizationUnitChildren,
-  isInitialized = true,
-  preferences,
+  inputClassName = "",
+  buttonClassName = "",
+  errorClassName = "",
+  messageClassName = "",
   size = "medium",
   variant = "outlined",
+  isInitialized,
+  children,
   showTitle = true,
   showSubtitle = true
 }) => {
-  const { meta, isInitialized: isSdkInitialized, getStorageManager } = useAsgardeo_default();
-  const { t } = useTranslation_default(preferences?.i18n);
-  const { theme } = useTheme_default();
-  const customRenderers = useContext13(ComponentRendererContext_default);
-  const styles = BaseInviteUser_styles_default(theme, theme.vars.colors.text.primary);
-  const [isLoading, setIsLoading] = useState23(false);
-  const [isFlowInitialized, setIsFlowInitialized] = useState23(false);
-  const [currentFlow, setCurrentFlow] = useState23(null);
-  const [apiError, setApiError] = useState23(null);
-  const [formValues, setFormValues] = useState23({});
-  const [formErrors, setFormErrors] = useState23({});
-  const [touchedFields, setTouchedFields] = useState23({});
-  const [isFormValid, setIsFormValid] = useState23(true);
-  const challengeTokenRef = useRef10(null);
-  const initializationAttemptedRef = useRef10(false);
-  useEffect21(() => {
-    if (!isSdkInitialized) return;
-    (async () => {
-      try {
-        const storageManager = await getStorageManager();
-        const tempData = await storageManager?.getTemporaryData();
-        if (tempData?.challengeToken) {
-          challengeTokenRef.current = tempData.challengeToken;
-        }
-      } catch {
-      }
-    })();
-  }, [isSdkInitialized]);
-  const setChallengeToken = async (challengeToken) => {
-    challengeTokenRef.current = challengeToken;
-    try {
-      const storageManager = await getStorageManager();
-      if (storageManager) {
-        if (challengeToken) {
-          await storageManager.setTemporaryDataParameter("challengeToken", challengeToken);
-        } else {
-          await storageManager.removeTemporaryDataParameter("challengeToken");
-        }
-      }
-    } catch {
-      logger10.warn("Failed to persist challenge token in storage.");
-    }
-  };
+  const { theme, colorScheme } = useTheme_default();
+  const { t } = useTranslation_default();
+  const { subtitle: flowSubtitle, title: flowTitle, messages: flowMessages, addMessage, clearMessages } = useFlow_default();
+  useAsgardeo_default();
+  const styles = BaseSignUp_styles_default(theme, colorScheme);
   const handleError = useCallback16(
     (error) => {
-      const errorMessage = error?.failureReason || extractErrorMessage(error, t, "components.inviteUser.errors.generic");
-      setApiError(error instanceof Error ? error : new Error(errorMessage));
-      onError?.(error instanceof Error ? error : new Error(errorMessage));
-    },
-    [t, onError]
-  );
-  const normalizeFlowResponseLocal = useCallback16(
-    (response) => {
-      if (!response?.data?.meta?.components) {
-        return response;
-      }
-      try {
-        const { components: components2 } = normalizeFlowResponse(
-          response,
-          t,
-          {
-            defaultErrorKey: "components.inviteUser.errors.generic",
-            resolveTranslations: false
-          },
-          meta
-        );
-        return {
-          ...response,
-          data: {
-            ...response.data,
-            components: components2
+      let errorMessage = t("errors.recovery.flow.failure");
+      if (error && typeof error === "object") {
+        if (error.code && (error.message || error.description)) {
+          errorMessage = error.description || error.message;
+        } else if (error instanceof Error && error.name === "AsgardeoAPIError") {
+          try {
+            const errorResponse = JSON.parse(error.message);
+            errorMessage = errorResponse.description || errorResponse.message || error.message;
+          } catch {
+            errorMessage = error.message;
           }
-        };
-      } catch {
-        return response;
+        } else if (error.message) {
+          errorMessage = error.message;
+        }
+      } else if (typeof error === "string") {
+        errorMessage = error;
       }
+      clearMessages();
+      addMessage({ message: errorMessage, type: "error" });
     },
-    [t, children]
+    [t, addMessage, clearMessages]
   );
-  const handleInputChange = useCallback16((name, value) => {
-    setFormValues((prev) => ({ ...prev, [name]: value }));
-    setFormErrors((prev) => {
-      const newErrors = { ...prev };
-      delete newErrors[name];
-      return newErrors;
-    });
-  }, []);
-  const handleInputBlur = useCallback16((name) => {
-    setTouchedFields((prev) => ({ ...prev, [name]: true }));
-  }, []);
-  const validateForm = useCallback16(
-    (components2) => {
-      const errors = {};
-      const validateComponents = (comps) => {
-        comps.forEach((comp) => {
-          if ((comp.type === "TEXT_INPUT" || comp.type === "EMAIL_INPUT" || comp.type === "SELECT" || comp.type === "PHONE_INPUT" || comp.type === "OTP_INPUT") && comp.required && comp.ref) {
-            const value = formValues[comp.ref];
-            if (!value || value.trim() === "") {
-              errors[comp.ref] = `${comp.label || comp.ref} is required`;
-            }
-            if (comp.type === "EMAIL_INPUT" && value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
-              errors[comp.ref] = "Please enter a valid email address";
-            }
-          }
-          if (comp.components && Array.isArray(comp.components)) {
+  const [isLoading, setIsLoading] = useState23(false);
+  const [isFlowInitialized, setIsFlowInitialized] = useState23(false);
+  const [currentFlow, setCurrentFlow] = useState23(null);
+  const initializationAttemptedRef = useRef10(false);
+  const extractFormFields = useCallback16(
+    (components) => {
+      const fields = [];
+      const processComponents = (comps) => {
+        comps.forEach((component) => {
+          if (component.type === EmbeddedFlowComponentType6.Input) {
+            const config = component.config || {};
+            fields.push({
+              initialValue: config.defaultValue || "",
+              name: config.name || component.id,
+              required: config.required || false,
+              validator: (value) => {
+                if (config.required && (!value || value.trim() === "")) {
+                  return t("validations.required.field.error");
+                }
+                if (config.type === "email" && value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
+                  return t("field.email.invalid");
+                }
+                if (config.type === "password" && value && value.length < 8) {
+                  return t("field.password.weak");
+                }
+                return null;
+              }
+            });
+          }
+          if (component.components && Array.isArray(component.components)) {
+            processComponents(component.components);
+          }
+        });
+      };
+      processComponents(components);
+      return fields;
+    },
+    [t]
+  );
+  const formFields = currentFlow?.data?.components ? extractFormFields(currentFlow.data.components) : [];
+  const form = useForm({
+    fields: formFields,
+    initialValues: {},
+    requiredMessage: t("validations.required.field.error"),
+    validateOnBlur: true,
+    validateOnChange: true
+  });
+  const {
+    values: formValues,
+    touched: touchedFields,
+    errors: formErrors,
+    isValid: isFormValid,
+    setValue: setFormValue,
+    setTouched: setFormTouched,
+    validateForm,
+    touchAllFields,
+    reset: resetForm
+  } = form;
+  const setupFormFields = useCallback16(
+    (flowResponse) => {
+      const fields = extractFormFields(flowResponse.data?.components || []);
+      const initialValues = {};
+      fields.forEach((field) => {
+        initialValues[field.name] = field.initialValue || "";
+      });
+      resetForm();
+      Object.keys(initialValues).forEach((key) => setFormValue(key, initialValues[key]));
+    },
+    [extractFormFields, resetForm, setFormValue]
+  );
+  const handleInputChange = useCallback16(
+    (name, value) => {
+      setFormValue(name, value);
+      setFormTouched(name, true);
+    },
+    [setFormValue, setFormTouched]
+  );
+  const handleSubmit = async (component, data, skipValidation) => {
+    if (!currentFlow) return;
+    if (!skipValidation) {
+      touchAllFields();
+      const validation = validateForm();
+      if (!validation.isValid) return;
+    }
+    setIsLoading(true);
+    clearMessages();
+    try {
+      const filteredInputs = {};
+      if (data) {
+        Object.entries(data).forEach(([key, value]) => {
+          if (value !== null && value !== void 0 && value !== "") {
+            filteredInputs[key] = value;
+          }
+        });
+      }
+      const payload = {
+        ...currentFlow.flowId && { flowId: currentFlow.flowId },
+        flowType: currentFlow.flowType || "RECOVERY",
+        inputs: filteredInputs,
+        ...component.id && { actionId: component.id }
+      };
+      const response = await onSubmit?.(payload);
+      if (!response) return;
+      onFlowChange?.(response);
+      if (response.flowStatus === EmbeddedFlowStatus3.Complete) {
+        onComplete?.(response);
+        return;
+      }
+      if (response.flowStatus === EmbeddedFlowStatus3.Incomplete) {
+        setCurrentFlow(response);
+        setupFormFields(response);
+      }
+    } catch (err) {
+      handleError(err);
+      onError?.(err);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const containerClasses = cx26(
+    [
+      withVendorCSSClassPrefix25("recovery"),
+      withVendorCSSClassPrefix25(`recovery--${size}`),
+      withVendorCSSClassPrefix25(`recovery--${variant}`)
+    ],
+    className
+  );
+  const inputClasses = cx26(
+    [
+      withVendorCSSClassPrefix25("recovery__input"),
+      size === "small" && withVendorCSSClassPrefix25("recovery__input--small"),
+      size === "large" && withVendorCSSClassPrefix25("recovery__input--large")
+    ],
+    inputClassName
+  );
+  const buttonClasses = cx26(
+    [
+      withVendorCSSClassPrefix25("recovery__button"),
+      size === "small" && withVendorCSSClassPrefix25("recovery__button--small"),
+      size === "large" && withVendorCSSClassPrefix25("recovery__button--large")
+    ],
+    buttonClassName
+  );
+  const errorClasses = cx26([withVendorCSSClassPrefix25("recovery__error")], errorClassName);
+  const messageClasses = cx26([withVendorCSSClassPrefix25("recovery__messages")], messageClassName);
+  const renderComponents = useCallback16(
+    (components) => renderRecoveryComponents2(
+      components,
+      formValues,
+      touchedFields,
+      formErrors,
+      isLoading,
+      isFormValid,
+      handleInputChange,
+      {
+        buttonClassName: buttonClasses,
+        inputClassName: inputClasses,
+        onSubmit: handleSubmit,
+        size,
+        variant
+      }
+    ),
+    [
+      buttonClasses,
+      formErrors,
+      formValues,
+      handleInputChange,
+      handleSubmit,
+      inputClasses,
+      isFormValid,
+      isLoading,
+      size,
+      touchedFields,
+      variant
+    ]
+  );
+  useEffect21(() => {
+    if (isInitialized && !isFlowInitialized && !initializationAttemptedRef.current) {
+      initializationAttemptedRef.current = true;
+      (async () => {
+        setIsLoading(true);
+        clearMessages();
+        try {
+          const response = await onInitialize();
+          setCurrentFlow(response);
+          setIsFlowInitialized(true);
+          onFlowChange?.(response);
+          if (response.flowStatus === EmbeddedFlowStatus3.Complete) {
+            onComplete?.(response);
+            return;
+          }
+          if (response.flowStatus === EmbeddedFlowStatus3.Incomplete) {
+            setupFormFields(response);
+          }
+        } catch (err) {
+          handleError(err);
+          onError?.(err);
+        } finally {
+          setIsLoading(false);
+        }
+      })();
+    }
+  }, [
+    clearMessages,
+    handleError,
+    isFlowInitialized,
+    isInitialized,
+    onComplete,
+    onError,
+    onFlowChange,
+    onInitialize,
+    setupFormFields
+  ]);
+  if (children) {
+    return /* @__PURE__ */ jsx88("div", { className: containerClasses, children });
+  }
+  if (!isFlowInitialized && isLoading) {
+    return /* @__PURE__ */ jsx88(Card_default, { className: cx26(containerClasses, styles.card), variant, children: /* @__PURE__ */ jsx88(Card_default.Content, { children: /* @__PURE__ */ jsx88("div", { className: styles.loadingContainer, children: /* @__PURE__ */ jsx88(Spinner_default, { size: "medium" }) }) }) });
+  }
+  if (!currentFlow) {
+    return /* @__PURE__ */ jsx88(Card_default, { className: cx26(containerClasses, styles.card), variant, children: /* @__PURE__ */ jsx88(Card_default.Content, { children: /* @__PURE__ */ jsxs37(Alert_default, { variant: "error", className: errorClasses, children: [
+      /* @__PURE__ */ jsx88(Alert_default.Title, { children: t("errors.heading") }),
+      /* @__PURE__ */ jsx88(Alert_default.Description, { children: t("errors.recovery.flow.initialization.failure") })
+    ] }) }) });
+  }
+  return /* @__PURE__ */ jsxs37(Card_default, { className: cx26(containerClasses, styles.card), variant, children: [
+    (showTitle || showSubtitle) && /* @__PURE__ */ jsxs37(Card_default.Header, { className: styles.header, children: [
+      showTitle && /* @__PURE__ */ jsx88(Card_default.Title, { level: 2, className: styles.title, children: flowTitle || t("recovery.heading") }),
+      showSubtitle && /* @__PURE__ */ jsx88(Typography_default, { variant: "body1", className: styles.subtitle, children: flowSubtitle || t("recovery.subheading") })
+    ] }),
+    /* @__PURE__ */ jsxs37(Card_default.Content, { children: [
+      flowMessages && flowMessages.length > 0 && /* @__PURE__ */ jsx88("div", { className: styles.flowMessagesContainer, children: flowMessages.map((message, index) => /* @__PURE__ */ jsx88(
+        Alert_default,
+        {
+          variant: message.type?.toLowerCase() === "error" ? "error" : "info",
+          className: cx26(styles.flowMessageItem, messageClasses),
+          children: /* @__PURE__ */ jsx88(Alert_default.Description, { children: message.message })
+        },
+        message.id || index
+      )) }),
+      /* @__PURE__ */ jsx88("div", { className: styles.contentContainer, children: currentFlow.data?.components && currentFlow.data.components.length > 0 ? renderComponents(currentFlow.data.components) : /* @__PURE__ */ jsx88(Alert_default, { variant: "warning", children: /* @__PURE__ */ jsx88(Typography_default, { variant: "body1", children: t("errors.recovery.components.not.available") }) }) })
+    ] })
+  ] });
+};
+var BaseRecovery = ({
+  showLogo = true,
+  ...rest
+}) => {
+  const { theme, colorScheme } = useTheme_default();
+  const styles = BaseSignUp_styles_default(theme, colorScheme);
+  return /* @__PURE__ */ jsxs37("div", { children: [
+    showLogo && /* @__PURE__ */ jsx88("div", { className: styles.logoContainer, children: /* @__PURE__ */ jsx88(Logo_default, { size: "large" }) }),
+    /* @__PURE__ */ jsx88(FlowProvider_default, { children: /* @__PURE__ */ jsx88(BaseRecoveryContent, { showLogo, ...rest }) })
+  ] });
+};
+var BaseRecovery_default = BaseRecovery;
+
+// src/components/presentation/auth/Recovery/v2/BaseRecovery.tsx
+import {
+  EmbeddedFlowStatus as EmbeddedFlowStatus4,
+  EmbeddedFlowComponentTypeV2 as EmbeddedFlowComponentType7,
+  withVendorCSSClassPrefix as withVendorCSSClassPrefix26
+} from "@asgardeo/browser";
+import { cx as cx27 } from "@emotion/css";
+import { useContext as useContext13, useEffect as useEffect22, useState as useState24, useCallback as useCallback17, useRef as useRef11 } from "react";
+import { jsx as jsx89, jsxs as jsxs38 } from "react/jsx-runtime";
+var BaseRecoveryContent2 = ({
+  onInitialize,
+  onSubmit,
+  onError,
+  onFlowChange,
+  onComplete,
+  error: externalError,
+  className = "",
+  inputClassName = "",
+  buttonClassName = "",
+  errorClassName = "",
+  messageClassName = "",
+  size = "medium",
+  variant = "outlined",
+  isInitialized,
+  children,
+  showTitle = true,
+  showSubtitle = true
+}) => {
+  const { theme, colorScheme } = useTheme_default();
+  const customRenderers = useContext13(ComponentRendererContext_default);
+  const { t } = useTranslation_default();
+  const { subtitle: flowSubtitle, title: flowTitle, messages: flowMessages, addMessage, clearMessages } = useFlow_default();
+  const { meta } = useAsgardeo_default();
+  const styles = BaseSignUp_styles_default(theme, colorScheme);
+  const [isLoading, setIsLoading] = useState24(false);
+  const [isFlowInitialized, setIsFlowInitialized] = useState24(false);
+  const [currentFlow, setCurrentFlow] = useState24(null);
+  const [apiError, setApiError] = useState24(null);
+  const initializationAttemptedRef = useRef11(false);
+  const challengeTokenRef = useRef11(null);
+  const handleError = useCallback17(
+    (error) => {
+      const errorMessage = error?.failureReason || extractErrorMessage(error, t);
+      setApiError(error instanceof Error ? error : new Error(errorMessage));
+      clearMessages();
+      addMessage({ message: errorMessage, type: "error" });
+    },
+    [t, addMessage, clearMessages]
+  );
+  const normalizeFlowResponseLocal = useCallback17(
+    (response) => {
+      if (response?.data?.components && Array.isArray(response.data.components)) {
+        return response;
+      }
+      if (response?.data) {
+        const { components } = normalizeFlowResponse(
+          response,
+          t,
+          { defaultErrorKey: "components.recovery.errors.generic", resolveTranslations: false },
+          meta
+        );
+        return { ...response, data: { ...response.data, components } };
+      }
+      return response;
+    },
+    [t, meta]
+  );
+  const extractFormFields = useCallback17(
+    (components) => {
+      const fields = [];
+      const processComponents = (comps) => {
+        comps.forEach((component) => {
+          if (component.type === EmbeddedFlowComponentType7.TextInput || component.type === EmbeddedFlowComponentType7.PasswordInput || component.type === EmbeddedFlowComponentType7.EmailInput || component.type === EmbeddedFlowComponentType7.Select) {
+            const fieldName = component.ref || component.id;
+            fields.push({
+              initialValue: "",
+              name: fieldName,
+              required: component.required || false,
+              validator: (value) => {
+                if (component.required && (!value || value.trim() === "")) {
+                  return t("validations.required.field.error");
+                }
+                if ((component.type === EmbeddedFlowComponentType7.EmailInput || component.variant === "EMAIL") && value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
+                  return t("field.email.invalid");
+                }
+                return null;
+              }
+            });
+          }
+          if (component.components && Array.isArray(component.components)) {
+            processComponents(component.components);
+          }
+        });
+      };
+      processComponents(components);
+      return fields;
+    },
+    [t]
+  );
+  const formFields = currentFlow?.data?.components ? extractFormFields(currentFlow.data.components) : [];
+  const form = useForm({
+    fields: formFields,
+    initialValues: {},
+    requiredMessage: t("validations.required.field.error"),
+    validateOnBlur: true,
+    validateOnChange: false
+  });
+  const {
+    values: formValues,
+    touched: touchedFields,
+    errors: formErrors,
+    isValid: isFormValid,
+    setValue: setFormValue,
+    setTouched: setFormTouched,
+    validateForm,
+    touchAllFields,
+    reset: resetForm
+  } = form;
+  const setupFormFields = useCallback17(
+    (flowResponse) => {
+      const fields = extractFormFields(flowResponse.data?.components || []);
+      const initialValues = {};
+      fields.forEach((field) => {
+        initialValues[field.name] = field.initialValue || "";
+      });
+      resetForm();
+      Object.keys(initialValues).forEach((key) => setFormValue(key, initialValues[key]));
+    },
+    [extractFormFields, resetForm, setFormValue]
+  );
+  const handleInputChange = (name, value) => {
+    setFormValue(name, value);
+  };
+  const handleInputBlur = (name) => {
+    setFormTouched(name, true);
+  };
+  const handleSubmit = async (component, data, skipValidation) => {
+    if (!currentFlow) return;
+    if (!skipValidation) {
+      touchAllFields();
+      const validation = validateForm();
+      if (!validation.isValid) return;
+    }
+    setIsLoading(true);
+    setApiError(null);
+    clearMessages();
+    try {
+      const filteredInputs = {};
+      if (data) {
+        Object.entries(data).forEach(([key, value]) => {
+          if (value !== null && value !== void 0 && value !== "") {
+            filteredInputs[key] = value;
+          }
+        });
+      }
+      const payload = {
+        ...currentFlow.executionId && { executionId: currentFlow.executionId },
+        flowType: currentFlow.flowType || "RECOVERY",
+        ...component.id && { action: component.id },
+        ...challengeTokenRef.current ? { challengeToken: challengeTokenRef.current } : {},
+        inputs: filteredInputs
+      };
+      const rawResponse = await onSubmit?.(payload);
+      if (!rawResponse) return;
+      const response = normalizeFlowResponseLocal(rawResponse);
+      onFlowChange?.(response);
+      if (response.challengeToken !== void 0) {
+        challengeTokenRef.current = response.challengeToken ?? null;
+      }
+      if (response.flowStatus === EmbeddedFlowStatus4.Complete) {
+        onComplete?.(response);
+        return;
+      }
+      if (response.flowStatus === EmbeddedFlowStatus4.Incomplete) {
+        setCurrentFlow(response);
+        setupFormFields(response);
+      }
+    } catch (err) {
+      handleError(err);
+      onError?.(err);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const containerClasses = cx27(
+    [
+      withVendorCSSClassPrefix26("recovery"),
+      withVendorCSSClassPrefix26(`recovery--${size}`),
+      withVendorCSSClassPrefix26(`recovery--${variant}`)
+    ],
+    className
+  );
+  const inputClasses = cx27(
+    [
+      withVendorCSSClassPrefix26("recovery__input"),
+      size === "small" && withVendorCSSClassPrefix26("recovery__input--small"),
+      size === "large" && withVendorCSSClassPrefix26("recovery__input--large")
+    ],
+    inputClassName
+  );
+  const buttonClasses = cx27(
+    [
+      withVendorCSSClassPrefix26("recovery__button"),
+      size === "small" && withVendorCSSClassPrefix26("recovery__button--small"),
+      size === "large" && withVendorCSSClassPrefix26("recovery__button--large")
+    ],
+    buttonClassName
+  );
+  const errorClasses = cx27([withVendorCSSClassPrefix26("recovery__error")], errorClassName);
+  const messageClasses = cx27([withVendorCSSClassPrefix26("recovery__messages")], messageClassName);
+  const renderComponents = useCallback17(
+    (components) => renderRecoveryComponents(
+      components,
+      formValues,
+      touchedFields,
+      formErrors,
+      isLoading,
+      isFormValid,
+      handleInputChange,
+      {
+        _customRenderers: customRenderers,
+        _theme: theme,
+        buttonClassName: buttonClasses,
+        inputClassName: inputClasses,
+        meta,
+        onInputBlur: handleInputBlur,
+        onSubmit: handleSubmit,
+        size,
+        variant
+      }
+    ),
+    [
+      customRenderers,
+      buttonClasses,
+      formErrors,
+      formValues,
+      handleInputBlur,
+      handleSubmit,
+      inputClasses,
+      isFormValid,
+      meta,
+      isLoading,
+      size,
+      theme,
+      touchedFields,
+      variant
+    ]
+  );
+  useEffect22(() => {
+    if (isInitialized && !isFlowInitialized && !initializationAttemptedRef.current) {
+      initializationAttemptedRef.current = true;
+      (async () => {
+        setIsLoading(true);
+        setApiError(null);
+        clearMessages();
+        try {
+          const rawResponse = await onInitialize?.();
+          if (!rawResponse) return;
+          const response = normalizeFlowResponseLocal(rawResponse);
+          if (response.challengeToken !== void 0) {
+            challengeTokenRef.current = response.challengeToken ?? null;
+          }
+          setCurrentFlow(response);
+          setIsFlowInitialized(true);
+          onFlowChange?.(response);
+          if (response.flowStatus === EmbeddedFlowStatus4.Complete) {
+            onComplete?.(response);
+            return;
+          }
+          if (response.flowStatus === EmbeddedFlowStatus4.Incomplete) {
+            setupFormFields(response);
+          }
+        } catch (err) {
+          handleError(err);
+          onError?.(err);
+        } finally {
+          setIsLoading(false);
+        }
+      })();
+    }
+  }, [
+    isFlowInitialized,
+    isInitialized,
+    normalizeFlowResponseLocal,
+    onComplete,
+    onError,
+    onFlowChange,
+    onInitialize,
+    setupFormFields,
+    t
+  ]);
+  if (children) {
+    if (typeof children === "function") {
+      const renderProps = {
+        components: currentFlow?.data?.components || [],
+        error: apiError,
+        fieldErrors: formErrors,
+        handleInputChange,
+        handleSubmit,
+        isLoading,
+        isValid: isFormValid,
+        messages: flowMessages || [],
+        meta,
+        subtitle: flowSubtitle || t("recovery.subheading"),
+        title: flowTitle || t("recovery.heading"),
+        touched: touchedFields,
+        validateForm: () => {
+          const result = validateForm();
+          return { fieldErrors: result.errors, isValid: result.isValid };
+        },
+        values: formValues
+      };
+      return /* @__PURE__ */ jsx89("div", { className: containerClasses, children: children(renderProps) });
+    }
+    return /* @__PURE__ */ jsx89("div", { className: containerClasses, children });
+  }
+  if (!isFlowInitialized && isLoading) {
+    return /* @__PURE__ */ jsx89(Card_default, { className: cx27(containerClasses, styles.card), variant, children: /* @__PURE__ */ jsx89(Card_default.Content, { children: /* @__PURE__ */ jsx89("div", { className: styles.loadingContainer, children: /* @__PURE__ */ jsx89(Spinner_default, { size: "medium" }) }) }) });
+  }
+  if (!currentFlow) {
+    return /* @__PURE__ */ jsx89(Card_default, { className: cx27(containerClasses, styles.card), variant, children: /* @__PURE__ */ jsx89(Card_default.Content, { children: /* @__PURE__ */ jsxs38(Alert_default, { variant: "error", className: errorClasses, children: [
+      /* @__PURE__ */ jsx89(Alert_default.Title, { children: t("errors.heading") }),
+      /* @__PURE__ */ jsx89(Alert_default.Description, { children: t("errors.recovery.flow.initialization.failure") })
+    ] }) }) });
+  }
+  const componentsToRender = currentFlow.data?.components || [];
+  const { title, subtitle, componentsWithoutHeadings } = getAuthComponentHeadings_default(
+    componentsToRender,
+    flowTitle,
+    flowSubtitle,
+    t("recovery.heading"),
+    t("recovery.subheading")
+  );
+  return /* @__PURE__ */ jsxs38(Card_default, { className: cx27(containerClasses, styles.card), variant, children: [
+    (showTitle || showSubtitle) && /* @__PURE__ */ jsxs38(Card_default.Header, { className: styles.header, children: [
+      showTitle && /* @__PURE__ */ jsx89(Card_default.Title, { level: 2, className: styles.title, children: title }),
+      showSubtitle && /* @__PURE__ */ jsx89(Typography_default, { variant: "body1", className: styles.subtitle, children: subtitle })
+    ] }),
+    /* @__PURE__ */ jsxs38(Card_default.Content, { children: [
+      externalError && /* @__PURE__ */ jsx89("div", { className: styles.flowMessagesContainer, children: /* @__PURE__ */ jsx89(Alert_default, { variant: "error", className: cx27(styles.flowMessageItem, messageClasses), children: /* @__PURE__ */ jsx89(Alert_default.Description, { children: externalError.message }) }) }),
+      flowMessages && flowMessages.length > 0 && /* @__PURE__ */ jsx89("div", { className: styles.flowMessagesContainer, children: flowMessages.map((message, index) => /* @__PURE__ */ jsx89(
+        Alert_default,
+        {
+          variant: message.type?.toLowerCase() === "error" ? "error" : "info",
+          className: cx27(styles.flowMessageItem, messageClasses),
+          children: /* @__PURE__ */ jsx89(Alert_default.Description, { children: message.message })
+        },
+        message.id || index
+      )) }),
+      /* @__PURE__ */ jsx89("div", { className: styles.contentContainer, children: componentsWithoutHeadings && componentsWithoutHeadings.length > 0 ? renderComponents(componentsWithoutHeadings) : /* @__PURE__ */ jsx89(Alert_default, { variant: "warning", children: /* @__PURE__ */ jsx89(Typography_default, { variant: "body1", children: t("errors.recovery.components.not.available") }) }) })
+    ] })
+  ] });
+};
+var BaseRecovery2 = ({
+  preferences,
+  showLogo = true,
+  ...rest
+}) => {
+  const { theme, colorScheme } = useTheme_default();
+  const styles = BaseSignUp_styles_default(theme, colorScheme);
+  const content = /* @__PURE__ */ jsxs38("div", { children: [
+    showLogo && /* @__PURE__ */ jsx89("div", { className: styles.logoContainer, children: /* @__PURE__ */ jsx89(Logo_default, { size: "large" }) }),
+    /* @__PURE__ */ jsx89(FlowProvider_default, { children: /* @__PURE__ */ jsx89(BaseRecoveryContent2, { showLogo, ...rest }) })
+  ] });
+  if (!preferences) return content;
+  return /* @__PURE__ */ jsx89(ComponentPreferencesContext_default.Provider, { value: preferences, children: content });
+};
+var BaseRecovery_default2 = BaseRecovery2;
+
+// src/components/presentation/auth/Recovery/BaseRecovery.tsx
+import { jsx as jsx90 } from "react/jsx-runtime";
+var BaseRecovery3 = (props) => {
+  const { platform } = useAsgardeo_default();
+  if (platform === Platform9.AsgardeoV2) {
+    return /* @__PURE__ */ jsx90(BaseRecovery_default2, { ...props });
+  }
+  return /* @__PURE__ */ jsx90(BaseRecovery_default, { ...props });
+};
+var BaseRecovery_default3 = BaseRecovery3;
+
+// src/components/presentation/auth/Recovery/Recovery.tsx
+import { Platform as Platform10 } from "@asgardeo/browser";
+
+// src/components/presentation/auth/Recovery/v1/Recovery.tsx
+import { EmbeddedFlowType as EmbeddedFlowType4 } from "@asgardeo/browser";
+import { jsx as jsx91 } from "react/jsx-runtime";
+var Recovery = ({
+  className,
+  size = "medium",
+  afterRecoveryUrl,
+  onError,
+  onComplete,
+  children,
+  ...rest
+}) => {
+  const { recover, isInitialized } = useAsgardeo_default();
+  const handleInitialize = async (payload) => {
+    const initialPayload = payload || { flowType: EmbeddedFlowType4.Recovery };
+    return await recover(initialPayload);
+  };
+  const handleOnSubmit = async (payload) => await recover(payload);
+  const handleComplete = (response) => {
+    onComplete?.(response);
+    if (afterRecoveryUrl) {
+      window.location.href = afterRecoveryUrl;
+    }
+  };
+  return /* @__PURE__ */ jsx91(
+    BaseRecovery_default,
+    {
+      afterRecoveryUrl,
+      onInitialize: handleInitialize,
+      onSubmit: handleOnSubmit,
+      onError,
+      onComplete: handleComplete,
+      className,
+      size,
+      isInitialized,
+      showLogo: true,
+      showTitle: false,
+      showSubtitle: false,
+      children,
+      ...rest
+    }
+  );
+};
+var Recovery_default = Recovery;
+
+// src/components/presentation/auth/Recovery/v2/Recovery.tsx
+import { EmbeddedFlowType as EmbeddedFlowType5 } from "@asgardeo/browser";
+import { useCallback as useCallback18 } from "react";
+import { jsx as jsx92 } from "react/jsx-runtime";
+var Recovery2 = ({
+  className,
+  size = "medium",
+  afterRecoveryUrl,
+  onError,
+  onComplete,
+  tokenUrlParam,
+  children,
+  ...rest
+}) => {
+  const { recover, isInitialized, applicationId } = useAsgardeo_default();
+  const handleInitialize = useCallback18(
+    async (payload) => {
+      const urlParams = new URL(window.location.href).searchParams;
+      const applicationIdFromUrl = urlParams.get("applicationId");
+      const effectiveApplicationId = applicationId ?? applicationIdFromUrl;
+      if (tokenUrlParam) {
+        const executionId = urlParams.get("executionId");
+        const tokenValue = urlParams.get(tokenUrlParam);
+        if (executionId && tokenValue) {
+          const resumePayload = {
+            executionId,
+            inputs: { [tokenUrlParam]: tokenValue },
+            verbose: true
+          };
+          return await recover(resumePayload);
+        }
+      }
+      const initialPayload = payload || {
+        flowType: EmbeddedFlowType5.Recovery,
+        ...effectiveApplicationId && { applicationId: effectiveApplicationId }
+      };
+      return await recover(initialPayload);
+    },
+    [applicationId, tokenUrlParam, recover]
+  );
+  const handleOnSubmit = useCallback18(
+    async (payload) => await recover(payload),
+    [recover]
+  );
+  const handleComplete = useCallback18(
+    (response) => {
+      onComplete?.(response);
+      if (afterRecoveryUrl) {
+        window.location.href = afterRecoveryUrl;
+      }
+    },
+    [onComplete, afterRecoveryUrl]
+  );
+  return /* @__PURE__ */ jsx92(
+    BaseRecovery_default2,
+    {
+      afterRecoveryUrl,
+      onInitialize: handleInitialize,
+      onSubmit: handleOnSubmit,
+      onError,
+      onComplete: handleComplete,
+      className,
+      size,
+      isInitialized,
+      showTitle: true,
+      showSubtitle: true,
+      children,
+      ...rest
+    }
+  );
+};
+var Recovery_default2 = Recovery2;
+
+// src/components/presentation/auth/Recovery/Recovery.tsx
+import { jsx as jsx93 } from "react/jsx-runtime";
+var Recovery3 = (props) => {
+  const { platform } = useAsgardeo_default();
+  if (platform === Platform10.AsgardeoV2) {
+    return /* @__PURE__ */ jsx93(Recovery_default2, { ...props });
+  }
+  return /* @__PURE__ */ jsx93(Recovery_default, { ...props });
+};
+var Recovery_default3 = Recovery3;
+
+// src/components/presentation/auth/InviteUser/v2/InviteUser.tsx
+import { EmbeddedFlowType as EmbeddedFlowType7, getOrganizationUnitChildren } from "@asgardeo/browser";
+import { useCallback as useCallback20 } from "react";
+
+// src/components/presentation/auth/InviteUser/v2/BaseInviteUser.tsx
+import {
+  EmbeddedFlowType as EmbeddedFlowType6,
+  logger as logger10
+} from "@asgardeo/browser";
+import { cx as cx28 } from "@emotion/css";
+import { useCallback as useCallback19, useContext as useContext14, useEffect as useEffect23, useRef as useRef12, useState as useState25 } from "react";
+
+// src/components/presentation/auth/InviteUser/v2/BaseInviteUser.styles.ts
+import { css as css23 } from "@emotion/css";
+import { useMemo as useMemo30 } from "react";
+var useStyles22 = (theme, colorScheme) => useMemo30(() => {
+  const card = css23`
+      background: ${theme.vars.colors.background.surface};
+      border-radius: ${theme.vars.borderRadius.large};
+      gap: calc(${theme.vars.spacing.unit} * 2);
+      min-width: 420px;
+      font-family: ${theme.vars.typography.fontFamily};
+    `;
+  const header = css23`
+      gap: 0;
+      align-items: center;
+    `;
+  const title = css23`
+      margin: 0 0 calc(${theme.vars.spacing.unit} * 1) 0;
+      color: ${theme.vars.colors.text.primary};
+    `;
+  const subtitle = css23`
+      margin-bottom: calc(${theme.vars.spacing.unit} * 1);
+      color: ${theme.vars.colors.text.secondary};
+    `;
+  return {
+    card,
+    header,
+    subtitle,
+    title
+  };
+}, [
+  theme.vars.colors.background.surface,
+  theme.vars.colors.text.primary,
+  theme.vars.colors.text.secondary,
+  theme.vars.borderRadius.large,
+  theme.vars.spacing.unit,
+  theme.vars.typography.fontFamily,
+  colorScheme
+]);
+var BaseInviteUser_styles_default = useStyles22;
+
+// src/components/presentation/auth/InviteUser/v2/BaseInviteUser.tsx
+import { jsx as jsx94, jsxs as jsxs39 } from "react/jsx-runtime";
+var BaseInviteUser = ({
+  onInitialize,
+  onSubmit,
+  onError,
+  onFlowChange,
+  className = "",
+  children,
+  fetchOrganizationUnitChildren,
+  isInitialized = true,
+  preferences,
+  size = "medium",
+  variant = "outlined",
+  showTitle = true,
+  showSubtitle = true
+}) => {
+  const { meta, isInitialized: isSdkInitialized, getStorageManager } = useAsgardeo_default();
+  const { t } = useTranslation_default(preferences?.i18n);
+  const { theme } = useTheme_default();
+  const customRenderers = useContext14(ComponentRendererContext_default);
+  const styles = BaseInviteUser_styles_default(theme, theme.vars.colors.text.primary);
+  const [isLoading, setIsLoading] = useState25(false);
+  const [isFlowInitialized, setIsFlowInitialized] = useState25(false);
+  const [currentFlow, setCurrentFlow] = useState25(null);
+  const [apiError, setApiError] = useState25(null);
+  const [formValues, setFormValues] = useState25({});
+  const [formErrors, setFormErrors] = useState25({});
+  const [touchedFields, setTouchedFields] = useState25({});
+  const [isFormValid, setIsFormValid] = useState25(true);
+  const challengeTokenRef = useRef12(null);
+  const initializationAttemptedRef = useRef12(false);
+  useEffect23(() => {
+    if (!isSdkInitialized) return;
+    (async () => {
+      try {
+        const storageManager = await getStorageManager();
+        const tempData = await storageManager?.getTemporaryData();
+        if (tempData?.challengeToken) {
+          challengeTokenRef.current = tempData.challengeToken;
+        }
+      } catch {
+      }
+    })();
+  }, [isSdkInitialized]);
+  const setChallengeToken = async (challengeToken) => {
+    challengeTokenRef.current = challengeToken;
+    try {
+      const storageManager = await getStorageManager();
+      if (storageManager) {
+        if (challengeToken) {
+          await storageManager.setTemporaryDataParameter("challengeToken", challengeToken);
+        } else {
+          await storageManager.removeTemporaryDataParameter("challengeToken");
+        }
+      }
+    } catch {
+      logger10.warn("Failed to persist challenge token in storage.");
+    }
+  };
+  const handleError = useCallback19(
+    (error) => {
+      const errorMessage = error?.failureReason || extractErrorMessage(error, t, "components.inviteUser.errors.generic");
+      setApiError(error instanceof Error ? error : new Error(errorMessage));
+      onError?.(error instanceof Error ? error : new Error(errorMessage));
+    },
+    [t, onError]
+  );
+  const normalizeFlowResponseLocal = useCallback19(
+    (response) => {
+      if (!response?.data?.meta?.components) {
+        return response;
+      }
+      try {
+        const { components: components2 } = normalizeFlowResponse(
+          response,
+          t,
+          {
+            defaultErrorKey: "components.inviteUser.errors.generic",
+            resolveTranslations: false
+          },
+          meta
+        );
+        return {
+          ...response,
+          data: {
+            ...response.data,
+            components: components2
+          }
+        };
+      } catch {
+        return response;
+      }
+    },
+    [t, children]
+  );
+  const handleInputChange = useCallback19((name, value) => {
+    setFormValues((prev) => ({ ...prev, [name]: value }));
+    setFormErrors((prev) => {
+      const newErrors = { ...prev };
+      delete newErrors[name];
+      return newErrors;
+    });
+  }, []);
+  const handleInputBlur = useCallback19((name) => {
+    setTouchedFields((prev) => ({ ...prev, [name]: true }));
+  }, []);
+  const validateForm = useCallback19(
+    (components2) => {
+      const errors = {};
+      const validateComponents = (comps) => {
+        comps.forEach((comp) => {
+          if ((comp.type === "TEXT_INPUT" || comp.type === "EMAIL_INPUT" || comp.type === "SELECT" || comp.type === "PHONE_INPUT" || comp.type === "OTP_INPUT") && comp.required && comp.ref) {
+            const value = formValues[comp.ref];
+            if (!value || value.trim() === "") {
+              errors[comp.ref] = `${comp.label || comp.ref} is required`;
+            }
+            if (comp.type === "EMAIL_INPUT" && value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
+              errors[comp.ref] = "Please enter a valid email address";
+            }
+          }
+          if (comp.components && Array.isArray(comp.components)) {
             validateComponents(comp.components);
           }
         });
@@ -12466,7 +13426,7 @@ var BaseInviteUser = ({
     },
     [formValues]
   );
-  const handleSubmit = useCallback16(
+  const handleSubmit = useCallback19(
     async (component, data) => {
       if (!currentFlow) {
         return;
@@ -12517,7 +13477,7 @@ var BaseInviteUser = ({
     },
     [currentFlow, formValues, validateForm, onSubmit, onFlowChange, handleError, normalizeFlowResponseLocal]
   );
-  const resetFlow = useCallback16(() => {
+  const resetFlow = useCallback19(() => {
     setIsFlowInitialized(false);
     setCurrentFlow(null);
     setApiError(null);
@@ -12526,7 +13486,7 @@ var BaseInviteUser = ({
     setTouchedFields({});
     initializationAttemptedRef.current = false;
   }, []);
-  useEffect21(() => {
+  useEffect23(() => {
     if (isInitialized && !isFlowInitialized && !initializationAttemptedRef.current) {
       initializationAttemptedRef.current = true;
       (async () => {
@@ -12534,7 +13494,7 @@ var BaseInviteUser = ({
         setApiError(null);
         try {
           const payload = {
-            flowType: EmbeddedFlowType4.UserOnboarding,
+            flowType: EmbeddedFlowType6.UserOnboarding,
             verbose: true
           };
           const rawResponse = await onInitialize(payload);
@@ -12554,7 +13514,7 @@ var BaseInviteUser = ({
       })();
     }
   }, [isInitialized, isFlowInitialized, onInitialize, onFlowChange, handleError, normalizeFlowResponseLocal]);
-  useEffect21(() => {
+  useEffect23(() => {
     if (currentFlow && isFlowInitialized) {
       const components2 = currentFlow.data?.components || [];
       if (components2.length > 0) {
@@ -12563,7 +13523,7 @@ var BaseInviteUser = ({
       }
     }
   }, [formValues, currentFlow, isFlowInitialized, validateForm]);
-  const extractHeadings = useCallback16((components2) => {
+  const extractHeadings = useCallback19((components2) => {
     let title2;
     let subtitle2;
     components2.forEach((comp) => {
@@ -12577,13 +13537,13 @@ var BaseInviteUser = ({
     });
     return { subtitle: subtitle2, title: title2 };
   }, []);
-  const filterHeadings = useCallback16(
+  const filterHeadings = useCallback19(
     (components2) => components2.filter(
       (comp) => !(comp.type === "TEXT" && (comp.variant === "HEADING_1" || comp.variant === "HEADING_2"))
     ),
     []
   );
-  const renderComponents = useCallback16(
+  const renderComponents = useCallback19(
     (components2) => renderInviteUserComponents(
       components2,
       formValues,
@@ -12642,30 +13602,30 @@ var BaseInviteUser = ({
     values: formValues
   };
   if (children) {
-    return /* @__PURE__ */ jsx87("div", { className, children: children(renderProps) });
+    return /* @__PURE__ */ jsx94("div", { className, children: children(renderProps) });
   }
   if (!isInitialized) {
-    return /* @__PURE__ */ jsx87(Card_default, { className: cx26(className, styles.card), variant, children: /* @__PURE__ */ jsx87(Card_default.Content, { children: /* @__PURE__ */ jsx87("div", { style: { display: "flex", justifyContent: "center", padding: "2rem" }, children: /* @__PURE__ */ jsx87(Spinner_default, { size: "medium" }) }) }) });
+    return /* @__PURE__ */ jsx94(Card_default, { className: cx28(className, styles.card), variant, children: /* @__PURE__ */ jsx94(Card_default.Content, { children: /* @__PURE__ */ jsx94("div", { style: { display: "flex", justifyContent: "center", padding: "2rem" }, children: /* @__PURE__ */ jsx94(Spinner_default, { size: "medium" }) }) }) });
   }
   if (!isFlowInitialized && isLoading) {
-    return /* @__PURE__ */ jsx87(Card_default, { className: cx26(className, styles.card), variant, children: /* @__PURE__ */ jsx87(Card_default.Content, { children: /* @__PURE__ */ jsx87("div", { style: { display: "flex", justifyContent: "center", padding: "2rem" }, children: /* @__PURE__ */ jsx87(Spinner_default, { size: "medium" }) }) }) });
+    return /* @__PURE__ */ jsx94(Card_default, { className: cx28(className, styles.card), variant, children: /* @__PURE__ */ jsx94(Card_default.Content, { children: /* @__PURE__ */ jsx94("div", { style: { display: "flex", justifyContent: "center", padding: "2rem" }, children: /* @__PURE__ */ jsx94(Spinner_default, { size: "medium" }) }) }) });
   }
   if (!currentFlow && apiError) {
-    return /* @__PURE__ */ jsx87(Card_default, { className: cx26(className, styles.card), variant, children: /* @__PURE__ */ jsx87(Card_default.Content, { children: /* @__PURE__ */ jsxs37(Alert_default, { variant: "error", children: [
-      /* @__PURE__ */ jsx87(Alert_default.Title, { children: "Error" }),
-      /* @__PURE__ */ jsx87(Alert_default.Description, { children: apiError.message })
+    return /* @__PURE__ */ jsx94(Card_default, { className: cx28(className, styles.card), variant, children: /* @__PURE__ */ jsx94(Card_default.Content, { children: /* @__PURE__ */ jsxs39(Alert_default, { variant: "error", children: [
+      /* @__PURE__ */ jsx94(Alert_default.Title, { children: "Error" }),
+      /* @__PURE__ */ jsx94(Alert_default.Description, { children: apiError.message })
     ] }) }) });
   }
-  return /* @__PURE__ */ jsxs37(Card_default, { className: cx26(className, styles.card), variant, children: [
-    (showTitle || showSubtitle) && (title || subtitle) && /* @__PURE__ */ jsxs37(Card_default.Header, { className: styles.header, children: [
-      showTitle && title && /* @__PURE__ */ jsx87(Card_default.Title, { level: 2, className: styles.title, children: title }),
-      showSubtitle && subtitle && /* @__PURE__ */ jsx87(Typography_default, { variant: "body1", className: styles.subtitle, children: subtitle })
+  return /* @__PURE__ */ jsxs39(Card_default, { className: cx28(className, styles.card), variant, children: [
+    (showTitle || showSubtitle) && (title || subtitle) && /* @__PURE__ */ jsxs39(Card_default.Header, { className: styles.header, children: [
+      showTitle && title && /* @__PURE__ */ jsx94(Card_default.Title, { level: 2, className: styles.title, children: title }),
+      showSubtitle && subtitle && /* @__PURE__ */ jsx94(Typography_default, { variant: "body1", className: styles.subtitle, children: subtitle })
     ] }),
-    /* @__PURE__ */ jsxs37(Card_default.Content, { children: [
-      apiError && /* @__PURE__ */ jsx87("div", { style: { marginBottom: "1rem" }, children: /* @__PURE__ */ jsx87(Alert_default, { variant: "error", children: /* @__PURE__ */ jsx87(Alert_default.Description, { children: apiError.message }) }) }),
-      /* @__PURE__ */ jsxs37("div", { children: [
-        componentsWithoutHeadings && componentsWithoutHeadings.length > 0 ? renderComponents(componentsWithoutHeadings) : !isLoading && /* @__PURE__ */ jsx87(Alert_default, { variant: "warning", children: /* @__PURE__ */ jsx87(Typography_default, { variant: "body1", children: "No form components available" }) }),
-        isLoading && /* @__PURE__ */ jsx87("div", { style: { display: "flex", justifyContent: "center", padding: "1rem" }, children: /* @__PURE__ */ jsx87(Spinner_default, { size: "small" }) })
+    /* @__PURE__ */ jsxs39(Card_default.Content, { children: [
+      apiError && /* @__PURE__ */ jsx94("div", { style: { marginBottom: "1rem" }, children: /* @__PURE__ */ jsx94(Alert_default, { variant: "error", children: /* @__PURE__ */ jsx94(Alert_default.Description, { children: apiError.message }) }) }),
+      /* @__PURE__ */ jsxs39("div", { children: [
+        componentsWithoutHeadings && componentsWithoutHeadings.length > 0 ? renderComponents(componentsWithoutHeadings) : !isLoading && /* @__PURE__ */ jsx94(Alert_default, { variant: "warning", children: /* @__PURE__ */ jsx94(Typography_default, { variant: "body1", children: "No form components available" }) }),
+        isLoading && /* @__PURE__ */ jsx94("div", { style: { display: "flex", justifyContent: "center", padding: "1rem" }, children: /* @__PURE__ */ jsx94(Spinner_default, { size: "small" }) })
       ] })
     ] })
   ] });
@@ -12673,7 +13633,7 @@ var BaseInviteUser = ({
 var BaseInviteUser_default = BaseInviteUser;
 
 // src/components/presentation/auth/InviteUser/v2/InviteUser.tsx
-import { jsx as jsx88 } from "react/jsx-runtime";
+import { jsx as jsx95 } from "react/jsx-runtime";
 var InviteUser = ({
   onError,
   onFlowChange,
@@ -12689,7 +13649,7 @@ var InviteUser = ({
     const response = await http2.request({
       data: {
         ...payload,
-        flowType: EmbeddedFlowType5.UserOnboarding,
+        flowType: EmbeddedFlowType7.UserOnboarding,
         verbose: true
       },
       headers: {
@@ -12716,7 +13676,7 @@ var InviteUser = ({
     });
     return response.data;
   };
-  const fetchOrganizationUnitChildren = useCallback17(
+  const fetchOrganizationUnitChildren = useCallback20(
     async (parentId, limit, offset4) => {
       const accessToken = await getAccessToken();
       return getOrganizationUnitChildren({
@@ -12729,7 +13689,7 @@ var InviteUser = ({
     },
     [baseUrl, getAccessToken]
   );
-  return /* @__PURE__ */ jsx88(
+  return /* @__PURE__ */ jsx95(
     BaseInviteUser_default,
     {
       onInitialize: handleInitialize,
@@ -12753,8 +13713,8 @@ var InviteUser_default = InviteUser;
 import { useMemo as useMemo32 } from "react";
 
 // src/components/presentation/auth/AcceptInvite/v2/BaseAcceptInvite.tsx
-import { cx as cx27 } from "@emotion/css";
-import { useCallback as useCallback18, useContext as useContext14, useEffect as useEffect22, useRef as useRef11, useState as useState24 } from "react";
+import { cx as cx29 } from "@emotion/css";
+import { useCallback as useCallback21, useContext as useContext15, useEffect as useEffect24, useRef as useRef13, useState as useState26 } from "react";
 
 // src/components/presentation/auth/AcceptInvite/v2/BaseAcceptInvite.styles.ts
 import { css as css24 } from "@emotion/css";
@@ -12797,7 +13757,7 @@ var useStyles23 = (theme, colorScheme) => useMemo31(() => {
 var BaseAcceptInvite_styles_default = useStyles23;
 
 // src/components/presentation/auth/AcceptInvite/v2/BaseAcceptInvite.tsx
-import { jsx as jsx89, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx96, jsxs as jsxs40 } from "react/jsx-runtime";
 var BaseAcceptInvite = ({
   executionId,
   inviteToken,
@@ -12817,22 +13777,22 @@ var BaseAcceptInvite = ({
   const { meta, isInitialized, getStorageManager } = useAsgardeo_default();
   const { t } = useTranslation_default(preferences?.i18n);
   const { theme } = useTheme_default();
-  const customRenderers = useContext14(ComponentRendererContext_default);
+  const customRenderers = useContext15(ComponentRendererContext_default);
   const styles = BaseAcceptInvite_styles_default(theme, theme.vars.colors.text.primary);
-  const [isLoading, setIsLoading] = useState24(false);
-  const [isValidatingToken, setIsValidatingToken] = useState24(true);
-  const [isTokenInvalid, setIsTokenInvalid] = useState24(false);
-  const [isComplete, setIsComplete] = useState24(false);
-  const [currentFlow, setCurrentFlow] = useState24(null);
-  const [apiError, setApiError] = useState24(null);
-  const [formValues, setFormValues] = useState24({});
-  const [formErrors, setFormErrors] = useState24({});
-  const [touchedFields, setTouchedFields] = useState24({});
-  const [isFormValid, setIsFormValid] = useState24(true);
-  const [isStorageReady, setIsStorageReady] = useState24(false);
-  const challengeTokenRef = useRef11(null);
-  const tokenValidationAttemptedRef = useRef11(false);
-  useEffect22(() => {
+  const [isLoading, setIsLoading] = useState26(false);
+  const [isValidatingToken, setIsValidatingToken] = useState26(true);
+  const [isTokenInvalid, setIsTokenInvalid] = useState26(false);
+  const [isComplete, setIsComplete] = useState26(false);
+  const [currentFlow, setCurrentFlow] = useState26(null);
+  const [apiError, setApiError] = useState26(null);
+  const [formValues, setFormValues] = useState26({});
+  const [formErrors, setFormErrors] = useState26({});
+  const [touchedFields, setTouchedFields] = useState26({});
+  const [isFormValid, setIsFormValid] = useState26(true);
+  const [isStorageReady, setIsStorageReady] = useState26(false);
+  const challengeTokenRef = useRef13(null);
+  const tokenValidationAttemptedRef = useRef13(false);
+  useEffect24(() => {
     if (!isInitialized) return;
     (async () => {
       try {
@@ -12857,7 +13817,7 @@ var BaseAcceptInvite = ({
       }
     }
   };
-  const handleError = useCallback18(
+  const handleError = useCallback21(
     (error) => {
       const errorMessage = error?.failureReason || extractErrorMessage(error, t, "components.acceptInvite.errors.generic");
       setApiError(error instanceof Error ? error : new Error(errorMessage));
@@ -12865,7 +13825,7 @@ var BaseAcceptInvite = ({
     },
     [t, onError]
   );
-  const normalizeFlowResponseLocal = useCallback18(
+  const normalizeFlowResponseLocal = useCallback21(
     (response) => {
       if (!response?.data?.meta?.components) {
         return response;
@@ -12928,7 +13888,7 @@ var BaseAcceptInvite = ({
     },
     tokenValidationAttemptedRef
   });
-  const handleInputChange = useCallback18((name, value) => {
+  const handleInputChange = useCallback21((name, value) => {
     setFormValues((prev) => ({ ...prev, [name]: value }));
     setFormErrors((prev) => {
       const newErrors = { ...prev };
@@ -12937,10 +13897,10 @@ var BaseAcceptInvite = ({
     });
     setIsFormValid(true);
   }, []);
-  const handleInputBlur = useCallback18((name) => {
+  const handleInputBlur = useCallback21((name) => {
     setTouchedFields((prev) => ({ ...prev, [name]: true }));
   }, []);
-  const validateForm = useCallback18(
+  const validateForm = useCallback21(
     (components2) => {
       const errors = {};
       const validateComponents = (comps) => {
@@ -12961,7 +13921,7 @@ var BaseAcceptInvite = ({
     },
     [formValues, t]
   );
-  const handleSubmit = useCallback18(
+  const handleSubmit = useCallback21(
     async (component, data) => {
       if (!currentFlow) {
         return;
@@ -13036,7 +13996,7 @@ var BaseAcceptInvite = ({
       normalizeFlowResponseLocal
     ]
   );
-  useEffect22(() => {
+  useEffect24(() => {
     if (tokenValidationAttemptedRef.current) {
       return;
     }
@@ -13079,7 +14039,7 @@ var BaseAcceptInvite = ({
       }
     })();
   }, [executionId, inviteToken, onSubmit, onFlowChange, handleError, normalizeFlowResponseLocal]);
-  const extractHeadings = useCallback18((components2) => {
+  const extractHeadings = useCallback21((components2) => {
     let title2;
     let subtitle2;
     components2.forEach((comp) => {
@@ -13093,7 +14053,7 @@ var BaseAcceptInvite = ({
     });
     return { subtitle: subtitle2, title: title2 };
   }, []);
-  const filterHeadings = useCallback18(
+  const filterHeadings = useCallback21(
     (components2) => components2.filter(
       (comp) => !(comp.type === "TEXT" && (comp.variant === "HEADING_1" || comp.variant === "HEADING_2"))
     ),
@@ -13124,34 +14084,34 @@ var BaseAcceptInvite = ({
     values: formValues
   };
   if (children) {
-    return /* @__PURE__ */ jsx89("div", { className, children: children(renderProps) });
+    return /* @__PURE__ */ jsx96("div", { className, children: children(renderProps) });
   }
   if (isValidatingToken) {
-    return /* @__PURE__ */ jsx89(Card_default, { className: cx27(className, styles.card), variant, children: /* @__PURE__ */ jsx89(Card_default.Content, { children: /* @__PURE__ */ jsxs38("div", { style: { alignItems: "center", display: "flex", flexDirection: "column", gap: "1rem", padding: "2rem" }, children: [
-      /* @__PURE__ */ jsx89(Spinner_default, { size: "medium" }),
-      /* @__PURE__ */ jsx89(Typography_default, { variant: "body1", children: "Validating your invite link..." })
+    return /* @__PURE__ */ jsx96(Card_default, { className: cx29(className, styles.card), variant, children: /* @__PURE__ */ jsx96(Card_default.Content, { children: /* @__PURE__ */ jsxs40("div", { style: { alignItems: "center", display: "flex", flexDirection: "column", gap: "1rem", padding: "2rem" }, children: [
+      /* @__PURE__ */ jsx96(Spinner_default, { size: "medium" }),
+      /* @__PURE__ */ jsx96(Typography_default, { variant: "body1", children: "Validating your invite link..." })
     ] }) }) });
   }
   if (isTokenInvalid) {
-    return /* @__PURE__ */ jsxs38(Card_default, { className: cx27(className, styles.card), variant, children: [
-      /* @__PURE__ */ jsx89(Card_default.Header, { className: styles.header, children: /* @__PURE__ */ jsx89(Card_default.Title, { level: 2, className: styles.title, children: "Invalid Invite Link" }) }),
-      /* @__PURE__ */ jsxs38(Card_default.Content, { children: [
-        /* @__PURE__ */ jsxs38(Alert_default, { variant: "error", children: [
-          /* @__PURE__ */ jsx89(Alert_default.Title, { children: "Unable to verify invite" }),
-          /* @__PURE__ */ jsx89(Alert_default.Description, { children: apiError?.message || "This invite link is invalid or has expired. Please contact your administrator for a new invite." })
+    return /* @__PURE__ */ jsxs40(Card_default, { className: cx29(className, styles.card), variant, children: [
+      /* @__PURE__ */ jsx96(Card_default.Header, { className: styles.header, children: /* @__PURE__ */ jsx96(Card_default.Title, { level: 2, className: styles.title, children: "Invalid Invite Link" }) }),
+      /* @__PURE__ */ jsxs40(Card_default.Content, { children: [
+        /* @__PURE__ */ jsxs40(Alert_default, { variant: "error", children: [
+          /* @__PURE__ */ jsx96(Alert_default.Title, { children: "Unable to verify invite" }),
+          /* @__PURE__ */ jsx96(Alert_default.Description, { children: apiError?.message || "This invite link is invalid or has expired. Please contact your administrator for a new invite." })
         ] }),
-        onGoToSignIn && /* @__PURE__ */ jsx89("div", { style: { display: "flex", justifyContent: "center", marginTop: "1.5rem" }, children: /* @__PURE__ */ jsx89(Button_default, { variant: "outline", onClick: onGoToSignIn, children: "Go to Sign In" }) })
+        onGoToSignIn && /* @__PURE__ */ jsx96("div", { style: { display: "flex", justifyContent: "center", marginTop: "1.5rem" }, children: /* @__PURE__ */ jsx96(Button_default, { variant: "outline", onClick: onGoToSignIn, children: "Go to Sign In" }) })
       ] })
     ] });
   }
-  return /* @__PURE__ */ jsxs38(Card_default, { className: cx27(className, styles.card), variant, children: [
-    (showTitle || showSubtitle) && (title || subtitle) && /* @__PURE__ */ jsxs38(Card_default.Header, { className: styles.header, children: [
-      showTitle && title && /* @__PURE__ */ jsx89(Card_default.Title, { level: 2, className: styles.title, children: title }),
-      showSubtitle && subtitle && /* @__PURE__ */ jsx89(Typography_default, { variant: "body1", className: styles.subtitle, children: subtitle })
+  return /* @__PURE__ */ jsxs40(Card_default, { className: cx29(className, styles.card), variant, children: [
+    (showTitle || showSubtitle) && (title || subtitle) && /* @__PURE__ */ jsxs40(Card_default.Header, { className: styles.header, children: [
+      showTitle && title && /* @__PURE__ */ jsx96(Card_default.Title, { level: 2, className: styles.title, children: title }),
+      showSubtitle && subtitle && /* @__PURE__ */ jsx96(Typography_default, { variant: "body1", className: styles.subtitle, children: subtitle })
     ] }),
-    /* @__PURE__ */ jsxs38(Card_default.Content, { children: [
-      apiError && /* @__PURE__ */ jsx89("div", { style: { marginBottom: "1rem" }, children: /* @__PURE__ */ jsx89(Alert_default, { variant: "error", children: /* @__PURE__ */ jsx89(Alert_default.Description, { children: apiError.message }) }) }),
-      /* @__PURE__ */ jsxs38("div", { children: [
+    /* @__PURE__ */ jsxs40(Card_default.Content, { children: [
+      apiError && /* @__PURE__ */ jsx96("div", { style: { marginBottom: "1rem" }, children: /* @__PURE__ */ jsx96(Alert_default, { variant: "error", children: /* @__PURE__ */ jsx96(Alert_default.Description, { children: apiError.message }) }) }),
+      /* @__PURE__ */ jsxs40("div", { children: [
         componentsWithoutHeadings && componentsWithoutHeadings.length > 0 ? renderInviteUserComponents(
           componentsWithoutHeadings,
           formValues,
@@ -13168,13 +14128,13 @@ var BaseAcceptInvite = ({
             size,
             variant
           }
-        ) : !isLoading && /* @__PURE__ */ jsx89(Alert_default, { variant: "warning", children: /* @__PURE__ */ jsx89(Typography_default, { variant: "body1", children: "No form components available" }) }),
-        isLoading && /* @__PURE__ */ jsx89("div", { style: { display: "flex", justifyContent: "center", padding: "1rem" }, children: /* @__PURE__ */ jsx89(Spinner_default, { size: "small" }) })
+        ) : !isLoading && /* @__PURE__ */ jsx96(Alert_default, { variant: "warning", children: /* @__PURE__ */ jsx96(Typography_default, { variant: "body1", children: "No form components available" }) }),
+        isLoading && /* @__PURE__ */ jsx96("div", { style: { display: "flex", justifyContent: "center", padding: "1rem" }, children: /* @__PURE__ */ jsx96(Spinner_default, { size: "small" }) })
       ] }),
-      onGoToSignIn && /* @__PURE__ */ jsx89("div", { style: { marginTop: "1.5rem", textAlign: "center" }, children: /* @__PURE__ */ jsxs38(Typography_default, { variant: "body2", children: [
+      onGoToSignIn && /* @__PURE__ */ jsx96("div", { style: { marginTop: "1.5rem", textAlign: "center" }, children: /* @__PURE__ */ jsxs40(Typography_default, { variant: "body2", children: [
         "Already have an account?",
         " ",
-        /* @__PURE__ */ jsx89(Button_default, { variant: "text", onClick: onGoToSignIn, style: { minWidth: "auto", padding: 0 }, children: "Sign In" })
+        /* @__PURE__ */ jsx96(Button_default, { variant: "text", onClick: onGoToSignIn, style: { minWidth: "auto", padding: 0 }, children: "Sign In" })
       ] }) })
     ] })
   ] });
@@ -13182,7 +14142,7 @@ var BaseAcceptInvite = ({
 var BaseAcceptInvite_default = BaseAcceptInvite;
 
 // src/components/presentation/auth/AcceptInvite/v2/AcceptInvite.tsx
-import { jsx as jsx90 } from "react/jsx-runtime";
+import { jsx as jsx97 } from "react/jsx-runtime";
 var getUrlParams = () => {
   if (typeof window === "undefined") {
     return {};
@@ -13238,7 +14198,7 @@ var AcceptInvite = ({
     }
     return response.json();
   };
-  return /* @__PURE__ */ jsx90(
+  return /* @__PURE__ */ jsx97(
     BaseAcceptInvite_default,
     {
       executionId,
@@ -13261,9 +14221,9 @@ var AcceptInvite_default = AcceptInvite;
 
 // src/components/auth/Callback/Callback.tsx
 import { navigate as browserNavigate } from "@asgardeo/browser";
-import { useEffect as useEffect23, useRef as useRef12 } from "react";
+import { useEffect as useEffect25, useRef as useRef14 } from "react";
 var Callback = ({ onNavigate, onError }) => {
-  const processingRef = useRef12(false);
+  const processingRef = useRef14(false);
   const navigate6 = (path) => {
     if (onNavigate) {
       onNavigate(path);
@@ -13271,7 +14231,7 @@ var Callback = ({ onNavigate, onError }) => {
       browserNavigate(path);
     }
   };
-  useEffect23(() => {
+  useEffect25(() => {
     const processOAuthCallback = () => {
       if (processingRef.current) {
         return;
@@ -13353,56 +14313,56 @@ var Callback = ({ onNavigate, onError }) => {
 };
 
 // src/components/presentation/User/BaseUser.tsx
-import { Fragment as Fragment18, jsx as jsx91 } from "react/jsx-runtime";
+import { Fragment as Fragment18, jsx as jsx98 } from "react/jsx-runtime";
 var BaseUser = ({ user, children, fallback = null }) => {
   if (!user) {
-    return /* @__PURE__ */ jsx91(Fragment18, { children: fallback });
+    return /* @__PURE__ */ jsx98(Fragment18, { children: fallback });
   }
-  return /* @__PURE__ */ jsx91(Fragment18, { children: children(user) });
+  return /* @__PURE__ */ jsx98(Fragment18, { children: children(user) });
 };
 BaseUser.displayName = "BaseUser";
 var BaseUser_default = BaseUser;
 
 // src/components/presentation/User/User.tsx
-import { jsx as jsx92 } from "react/jsx-runtime";
+import { jsx as jsx99 } from "react/jsx-runtime";
 var User5 = ({ children, fallback = null }) => {
   const { user } = useAsgardeo_default();
-  return /* @__PURE__ */ jsx92(BaseUser_default, { user, fallback, children });
+  return /* @__PURE__ */ jsx99(BaseUser_default, { user, fallback, children });
 };
 User5.displayName = "User";
 var User_default = User5;
 
 // src/components/presentation/Organization/BaseOrganization.tsx
-import { Fragment as Fragment19, jsx as jsx93 } from "react/jsx-runtime";
+import { Fragment as Fragment19, jsx as jsx100 } from "react/jsx-runtime";
 var BaseOrganization = ({
   children,
   fallback = null,
   organization
 }) => {
   if (!organization) {
-    return /* @__PURE__ */ jsx93(Fragment19, { children: fallback });
+    return /* @__PURE__ */ jsx100(Fragment19, { children: fallback });
   }
-  return /* @__PURE__ */ jsx93(Fragment19, { children: children(organization) });
+  return /* @__PURE__ */ jsx100(Fragment19, { children: children(organization) });
 };
 BaseOrganization.displayName = "BaseOrganization";
 var BaseOrganization_default = BaseOrganization;
 
 // src/components/presentation/Organization/Organization.tsx
-import { jsx as jsx94 } from "react/jsx-runtime";
+import { jsx as jsx101 } from "react/jsx-runtime";
 var Organization5 = ({ children, fallback = null }) => {
   const { currentOrganization } = useOrganization_default();
-  return /* @__PURE__ */ jsx94(BaseOrganization_default, { organization: currentOrganization, fallback, children });
+  return /* @__PURE__ */ jsx101(BaseOrganization_default, { organization: currentOrganization, fallback, children });
 };
 Organization5.displayName = "Organization";
 var Organization_default = Organization5;
 
 // src/components/presentation/UserProfile/BaseUserProfile.tsx
-import { withVendorCSSClassPrefix as withVendorCSSClassPrefix29, WellKnownSchemaIds, bem as bem21 } from "@asgardeo/browser";
-import { cx as cx31 } from "@emotion/css";
-import { useState as useState27, useCallback as useCallback20 } from "react";
+import { withVendorCSSClassPrefix as withVendorCSSClassPrefix31, WellKnownSchemaIds, bem as bem21 } from "@asgardeo/browser";
+import { cx as cx33 } from "@emotion/css";
+import { useState as useState29, useCallback as useCallback23 } from "react";
 
 // src/components/presentation/UserProfile/BaseUserProfile.styles.ts
-import { withVendorCSSClassPrefix as withVendorCSSClassPrefix25 } from "@asgardeo/browser";
+import { withVendorCSSClassPrefix as withVendorCSSClassPrefix27 } from "@asgardeo/browser";
 import { css as css25 } from "@emotion/css";
 import { useMemo as useMemo33 } from "react";
 var useStyles24 = (theme, colorScheme) => {
@@ -13541,7 +14501,7 @@ var useStyles24 = (theme, colorScheme) => {
       max-width: 350px;
       text-align: start;
 
-      .${withVendorCSSClassPrefix25("form-control")} {
+      .${withVendorCSSClassPrefix27("form-control")} {
         margin-bottom: 0;
       }
 
@@ -13659,8 +14619,8 @@ var getDisplayName = (mergedMappings, user, displayAttributes) => {
 var getDisplayName_default = getDisplayName;
 
 // src/components/primitives/Avatar/Avatar.tsx
-import { withVendorCSSClassPrefix as withVendorCSSClassPrefix26, bem as bem18 } from "@asgardeo/browser";
-import { cx as cx28 } from "@emotion/css";
+import { withVendorCSSClassPrefix as withVendorCSSClassPrefix28, bem as bem18 } from "@asgardeo/browser";
+import { cx as cx30 } from "@emotion/css";
 import { useMemo as useMemo35 } from "react";
 
 // src/components/primitives/Avatar/Avatar.styles.ts
@@ -13730,7 +14690,7 @@ var useStyles25 = (theme, colorScheme, size, variant, backgroundColor) => useMem
 var Avatar_styles_default = useStyles25;
 
 // src/components/primitives/Avatar/Avatar.tsx
-import { jsx as jsx95 } from "react/jsx-runtime";
+import { jsx as jsx102 } from "react/jsx-runtime";
 var Avatar = ({
   alt = "User avatar",
   background = "random",
@@ -13777,12 +14737,12 @@ var Avatar = ({
   const getInitials = (fullName) => fullName.split(" ").map((part) => part[0]).slice(0, 2).join("").toUpperCase();
   const renderContent = () => {
     if (imageUrl) {
-      return /* @__PURE__ */ jsx95(
+      return /* @__PURE__ */ jsx102(
         "img",
         {
           src: imageUrl,
           alt,
-          className: cx28(withVendorCSSClassPrefix26(bem18("avatar", "image")), styles["image"])
+          className: cx30(withVendorCSSClassPrefix28(bem18("avatar", "image")), styles["image"])
         }
       );
     }
@@ -13790,27 +14750,27 @@ var Avatar = ({
       return getInitials(name);
     }
     if (isLoading) {
-      return /* @__PURE__ */ jsx95("div", { className: cx28(withVendorCSSClassPrefix26(bem18("avatar", "skeleton")), styles["skeleton"]) });
+      return /* @__PURE__ */ jsx102("div", { className: cx30(withVendorCSSClassPrefix28(bem18("avatar", "skeleton")), styles["skeleton"]) });
     }
-    return /* @__PURE__ */ jsx95(
+    return /* @__PURE__ */ jsx102(
       "svg",
       {
         xmlns: "http://www.w3.org/2000/svg",
         viewBox: "0 0 640 640",
-        className: cx28(withVendorCSSClassPrefix26(bem18("avatar", "icon")), styles["icon"]),
-        children: /* @__PURE__ */ jsx95("path", { d: "M240 192C240 147.8 275.8 112 320 112C364.2 112 400 147.8 400 192C400 236.2 364.2 272 320 272C275.8 272 240 236.2 240 192zM448 192C448 121.3 390.7 64 320 64C249.3 64 192 121.3 192 192C192 262.7 249.3 320 320 320C390.7 320 448 262.7 448 192zM144 544C144 473.3 201.3 416 272 416L368 416C438.7 416 496 473.3 496 544L496 552C496 565.3 506.7 576 520 576C533.3 576 544 565.3 544 552L544 544C544 446.8 465.2 368 368 368L272 368C174.8 368 96 446.8 96 544L96 552C96 565.3 106.7 576 120 576C133.3 576 144 565.3 144 552L144 544z" })
+        className: cx30(withVendorCSSClassPrefix28(bem18("avatar", "icon")), styles["icon"]),
+        children: /* @__PURE__ */ jsx102("path", { d: "M240 192C240 147.8 275.8 112 320 112C364.2 112 400 147.8 400 192C400 236.2 364.2 272 320 272C275.8 272 240 236.2 240 192zM448 192C448 121.3 390.7 64 320 64C249.3 64 192 121.3 192 192C192 262.7 249.3 320 320 320C390.7 320 448 262.7 448 192zM144 544C144 473.3 201.3 416 272 416L368 416C438.7 416 496 473.3 496 544L496 552C496 565.3 506.7 576 520 576C533.3 576 544 565.3 544 552L544 544C544 446.8 465.2 368 368 368L272 368C174.8 368 96 446.8 96 544L96 552C96 565.3 106.7 576 120 576C133.3 576 144 565.3 144 552L144 544z" })
       }
     );
   };
-  return /* @__PURE__ */ jsx95(
+  return /* @__PURE__ */ jsx102(
     "div",
     {
-      className: cx28(
-        withVendorCSSClassPrefix26(bem18("avatar")),
+      className: cx30(
+        withVendorCSSClassPrefix28(bem18("avatar")),
         styles["avatar"],
         styles["variant"],
-        withVendorCSSClassPrefix26(bem18("avatar", null, variant)),
-        isDefaultState && withVendorCSSClassPrefix26(bem18("avatar", "default")),
+        withVendorCSSClassPrefix28(bem18("avatar", null, variant)),
+        isDefaultState && withVendorCSSClassPrefix28(bem18("avatar", "default")),
         className
       ),
       children: renderContent()
@@ -13819,8 +14779,8 @@ var Avatar = ({
 };
 
 // src/components/primitives/Dialog/Dialog.tsx
-import { withVendorCSSClassPrefix as withVendorCSSClassPrefix27, bem as bem19 } from "@asgardeo/browser";
-import { cx as cx29 } from "@emotion/css";
+import { withVendorCSSClassPrefix as withVendorCSSClassPrefix29, bem as bem19 } from "@asgardeo/browser";
+import { cx as cx31 } from "@emotion/css";
 import {
   useFloating,
   useClick,
@@ -13838,10 +14798,10 @@ import {
   createContext as createContext12,
   forwardRef as forwardRef10,
   isValidElement,
-  useContext as useContext15,
+  useContext as useContext16,
   useLayoutEffect,
   useMemo as useMemo37,
-  useState as useState25
+  useState as useState27
 } from "react";
 
 // src/components/primitives/Dialog/Dialog.styles.ts
@@ -13909,8 +14869,8 @@ var useStyles26 = (theme, colorScheme) => useMemo36(() => {
 var Dialog_styles_default = useStyles26;
 
 // src/components/primitives/Icons/LogOut.tsx
-import { jsx as jsx96, jsxs as jsxs39 } from "react/jsx-runtime";
-var LogOut = (props) => /* @__PURE__ */ jsxs39(
+import { jsx as jsx103, jsxs as jsxs41 } from "react/jsx-runtime";
+var LogOut = (props) => /* @__PURE__ */ jsxs41(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -13924,17 +14884,17 @@ var LogOut = (props) => /* @__PURE__ */ jsxs39(
     strokeLinejoin: "round",
     ...props,
     children: [
-      /* @__PURE__ */ jsx96("path", { d: "m16 17 5-5-5-5" }),
-      /* @__PURE__ */ jsx96("path", { d: "M21 12H9" }),
-      /* @__PURE__ */ jsx96("path", { d: "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" })
+      /* @__PURE__ */ jsx103("path", { d: "m16 17 5-5-5-5" }),
+      /* @__PURE__ */ jsx103("path", { d: "M21 12H9" }),
+      /* @__PURE__ */ jsx103("path", { d: "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" })
     ]
   }
 );
 var LogOut_default = LogOut;
 
 // src/components/primitives/Icons/Plus.tsx
-import { jsx as jsx97, jsxs as jsxs40 } from "react/jsx-runtime";
-var Plus = (props) => /* @__PURE__ */ jsxs40(
+import { jsx as jsx104, jsxs as jsxs42 } from "react/jsx-runtime";
+var Plus = (props) => /* @__PURE__ */ jsxs42(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -13948,16 +14908,16 @@ var Plus = (props) => /* @__PURE__ */ jsxs40(
     strokeLinejoin: "round",
     ...props,
     children: [
-      /* @__PURE__ */ jsx97("path", { d: "M5 12h14" }),
-      /* @__PURE__ */ jsx97("path", { d: "M12 5v14" })
+      /* @__PURE__ */ jsx104("path", { d: "M5 12h14" }),
+      /* @__PURE__ */ jsx104("path", { d: "M12 5v14" })
     ]
   }
 );
 var Plus_default = Plus;
 
 // src/components/primitives/Icons/User.tsx
-import { jsx as jsx98, jsxs as jsxs41 } from "react/jsx-runtime";
-var User7 = (props) => /* @__PURE__ */ jsxs41(
+import { jsx as jsx105, jsxs as jsxs43 } from "react/jsx-runtime";
+var User7 = (props) => /* @__PURE__ */ jsxs43(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -13971,16 +14931,16 @@ var User7 = (props) => /* @__PURE__ */ jsxs41(
     strokeLinejoin: "round",
     ...props,
     children: [
-      /* @__PURE__ */ jsx98("path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }),
-      /* @__PURE__ */ jsx98("circle", { cx: "12", cy: "7", r: "4" })
+      /* @__PURE__ */ jsx105("path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }),
+      /* @__PURE__ */ jsx105("circle", { cx: "12", cy: "7", r: "4" })
     ]
   }
 );
 var User_default2 = User7;
 
 // src/components/primitives/Icons/X.tsx
-import { jsx as jsx99, jsxs as jsxs42 } from "react/jsx-runtime";
-var X = (props) => /* @__PURE__ */ jsxs42(
+import { jsx as jsx106, jsxs as jsxs44 } from "react/jsx-runtime";
+var X = (props) => /* @__PURE__ */ jsxs44(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -13994,23 +14954,23 @@ var X = (props) => /* @__PURE__ */ jsxs42(
     strokeLinejoin: "round",
     ...props,
     children: [
-      /* @__PURE__ */ jsx99("path", { d: "M18 6 6 18" }),
-      /* @__PURE__ */ jsx99("path", { d: "m6 6 12 12" })
+      /* @__PURE__ */ jsx106("path", { d: "M18 6 6 18" }),
+      /* @__PURE__ */ jsx106("path", { d: "m6 6 12 12" })
     ]
   }
 );
 var X_default = X;
 
 // src/components/primitives/Dialog/Dialog.tsx
-import { jsx as jsx100, jsxs as jsxs43 } from "react/jsx-runtime";
+import { jsx as jsx107, jsxs as jsxs45 } from "react/jsx-runtime";
 function useDialog({
   initialOpen = false,
   open: controlledOpen,
   onOpenChange: setControlledOpen
 } = {}) {
-  const [uncontrolledOpen, setUncontrolledOpen] = useState25(initialOpen);
-  const [labelId, setLabelId] = useState25();
-  const [descriptionId, setDescriptionId] = useState25();
+  const [uncontrolledOpen, setUncontrolledOpen] = useState27(initialOpen);
+  const [labelId, setLabelId] = useState27();
+  const [descriptionId, setDescriptionId] = useState27();
   const open = controlledOpen ?? uncontrolledOpen;
   const setOpen = setControlledOpen ?? setUncontrolledOpen;
   const data = useFloating({
@@ -14040,7 +15000,7 @@ function useDialog({
 }
 var DialogContext = createContext12(null);
 var useDialogContext = () => {
-  const context = useContext15(DialogContext);
+  const context = useContext16(DialogContext);
   if (context == null) {
     throw new Error("Dialog components must be wrapped in <Dialog />");
   }
@@ -14048,7 +15008,7 @@ var useDialogContext = () => {
 };
 function Dialog({ children, ...options }) {
   const dialog = useDialog(options);
-  return /* @__PURE__ */ jsx100(DialogContext.Provider, { value: dialog, children });
+  return /* @__PURE__ */ jsx107(DialogContext.Provider, { value: dialog, children });
 }
 var DialogTrigger = forwardRef10(
   ({ children, asChild = false, ...props }, propRef) => {
@@ -14066,7 +15026,7 @@ var DialogTrigger = forwardRef10(
         })
       );
     }
-    return /* @__PURE__ */ jsx100("button", { ref, "data-state": context.open ? "open" : "closed", ...context.getReferenceProps(props), children });
+    return /* @__PURE__ */ jsx107("button", { ref, "data-state": context.open ? "open" : "closed", ...context.getReferenceProps(props), children });
   }
 );
 var DialogContent = forwardRef10(
@@ -14076,16 +15036,16 @@ var DialogContent = forwardRef10(
     const styles = Dialog_styles_default(theme, colorScheme);
     const ref = useMergeRefs([context.refs.setFloating, propRef]);
     if (!floatingContext.open) return null;
-    return /* @__PURE__ */ jsx100(FloatingPortal, { children: /* @__PURE__ */ jsx100(
+    return /* @__PURE__ */ jsx107(FloatingPortal, { children: /* @__PURE__ */ jsx107(
       FloatingOverlay,
       {
-        className: cx29(withVendorCSSClassPrefix27(bem19("dialog", "overlay")), styles["overlay"]),
+        className: cx31(withVendorCSSClassPrefix29(bem19("dialog", "overlay")), styles["overlay"]),
         lockScroll: true,
-        children: /* @__PURE__ */ jsx100(FloatingFocusManager, { context: floatingContext, initialFocus: -1, children: /* @__PURE__ */ jsx100(
+        children: /* @__PURE__ */ jsx107(FloatingFocusManager, { context: floatingContext, initialFocus: -1, children: /* @__PURE__ */ jsx107(
           "div",
           {
             ref,
-            className: cx29(withVendorCSSClassPrefix27(bem19("dialog", "content")), styles["content"], props.className),
+            className: cx31(withVendorCSSClassPrefix29(bem19("dialog", "content")), styles["content"], props.className),
             "aria-labelledby": context.labelId,
             "aria-describedby": context.descriptionId,
             ...context.getFloatingProps(props),
@@ -14108,18 +15068,18 @@ var DialogHeading = forwardRef10(
         context.setLabelId(void 0);
       };
     }, [id, context.setLabelId]);
-    return /* @__PURE__ */ jsxs43("div", { className: cx29(withVendorCSSClassPrefix27(bem19("dialog", "header")), styles["header"]), children: [
-      /* @__PURE__ */ jsx100(
+    return /* @__PURE__ */ jsxs45("div", { className: cx31(withVendorCSSClassPrefix29(bem19("dialog", "header")), styles["header"]), children: [
+      /* @__PURE__ */ jsx107(
         "h2",
         {
           ...props,
           ref,
           id,
-          className: cx29(withVendorCSSClassPrefix27(bem19("dialog", "title")), styles["headerTitle"]),
+          className: cx31(withVendorCSSClassPrefix29(bem19("dialog", "title")), styles["headerTitle"]),
           children
         }
       ),
-      /* @__PURE__ */ jsx100(
+      /* @__PURE__ */ jsx107(
         Button_default,
         {
           color: "tertiary",
@@ -14130,7 +15090,7 @@ var DialogHeading = forwardRef10(
             context.setOpen(false);
           },
           "aria-label": "Close",
-          children: /* @__PURE__ */ jsx100(X_default, { width: 16, height: 16 })
+          children: /* @__PURE__ */ jsx107(X_default, { width: 16, height: 16 })
         }
       )
     ] });
@@ -14148,13 +15108,13 @@ var DialogDescription = forwardRef10(
         context.setDescriptionId(void 0);
       };
     }, [id, context.setDescriptionId]);
-    return /* @__PURE__ */ jsx100(
+    return /* @__PURE__ */ jsx107(
       "p",
       {
         ...props,
         ref,
         id,
-        className: cx29(withVendorCSSClassPrefix27(bem19("dialog", "description")), styles["description"], props.className),
+        className: cx31(withVendorCSSClassPrefix29(bem19("dialog", "description")), styles["description"], props.className),
         children
       }
     );
@@ -14177,13 +15137,13 @@ var DialogClose = forwardRef10(
         onClick: handleClick
       });
     }
-    return /* @__PURE__ */ jsx100(
+    return /* @__PURE__ */ jsx107(
       Button_default,
       {
         ...props,
         ref,
         onClick: handleClick,
-        className: cx29(withVendorCSSClassPrefix27(bem19("dialog", "close")), props.className),
+        className: cx31(withVendorCSSClassPrefix29(bem19("dialog", "close")), props.className),
         variant: "text",
         children
       }
@@ -14203,9 +15163,9 @@ Dialog.Close = DialogClose;
 var Dialog_default = Dialog;
 
 // src/components/primitives/MultiInput/MultiInput.tsx
-import { withVendorCSSClassPrefix as withVendorCSSClassPrefix28, bem as bem20 } from "@asgardeo/browser";
-import { cx as cx30 } from "@emotion/css";
-import { useCallback as useCallback19, useState as useState26 } from "react";
+import { withVendorCSSClassPrefix as withVendorCSSClassPrefix30, bem as bem20 } from "@asgardeo/browser";
+import { cx as cx32 } from "@emotion/css";
+import { useCallback as useCallback22, useState as useState28 } from "react";
 
 // src/components/primitives/MultiInput/MultiInput.styles.ts
 import { css as css28 } from "@emotion/css";
@@ -14300,7 +15260,7 @@ var useStyles27 = (theme, colorScheme, disabled, hasError, canAddMore, canRemove
 var MultiInput_styles_default = useStyles27;
 
 // src/components/primitives/MultiInput/MultiInput.tsx
-import { jsx as jsx101, jsxs as jsxs44 } from "react/jsx-runtime";
+import { jsx as jsx108, jsxs as jsxs46 } from "react/jsx-runtime";
 var MultiInput = ({
   label,
   error,
@@ -14323,9 +15283,9 @@ var MultiInput = ({
   const canAddMore = !maxFields || values.length < maxFields;
   const canRemove = values.length > minFields;
   const styles = MultiInput_styles_default(theme, colorScheme, !!disabled, !!error, canAddMore, canRemove);
-  const PlusIcon = ({ iconClassName }) => /* @__PURE__ */ jsx101("svg", { width: "16", height: "16", viewBox: "0 0 24 24", className: cx30(styles["icon"], iconClassName), children: /* @__PURE__ */ jsx101("path", { d: "M12 5v14M5 12h14" }) });
-  const BinIcon = ({ iconClassName }) => /* @__PURE__ */ jsx101("svg", { width: "16", height: "16", viewBox: "0 0 24 24", className: cx30(styles["icon"], iconClassName), children: /* @__PURE__ */ jsx101("path", { d: "M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2m3 0v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6h14ZM10 11v6M14 11v6" }) });
-  const handleAddValue = useCallback19(
+  const PlusIcon = ({ iconClassName }) => /* @__PURE__ */ jsx108("svg", { width: "16", height: "16", viewBox: "0 0 24 24", className: cx32(styles["icon"], iconClassName), children: /* @__PURE__ */ jsx108("path", { d: "M12 5v14M5 12h14" }) });
+  const BinIcon = ({ iconClassName }) => /* @__PURE__ */ jsx108("svg", { width: "16", height: "16", viewBox: "0 0 24 24", className: cx32(styles["icon"], iconClassName), children: /* @__PURE__ */ jsx108("path", { d: "M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2m3 0v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6h14ZM10 11v6M14 11v6" }) });
+  const handleAddValue = useCallback22(
     (newValue) => {
       if (newValue.trim() !== "" && (!maxFields || values.length < maxFields)) {
         onChange([...values, newValue.trim()]);
@@ -14333,7 +15293,7 @@ var MultiInput = ({
     },
     [values, onChange, maxFields]
   );
-  const handleRemoveValue = useCallback19(
+  const handleRemoveValue = useCallback22(
     (index) => {
       if (values.length > minFields) {
         const updatedValues = values.filter((_, i) => i !== index);
@@ -14342,7 +15302,7 @@ var MultiInput = ({
     },
     [values, onChange, minFields]
   );
-  const renderInputField = useCallback19(
+  const renderInputField = useCallback22(
     (value, onValueChange, attachedEndIcon, onEndIconClick) => {
       const handleInputChange = (e) => {
         const newValue = e.target ? e.target.value : e;
@@ -14368,9 +15328,9 @@ var MultiInput = ({
       };
       switch (fieldType) {
         case "DATE_TIME":
-          return /* @__PURE__ */ jsx101(DatePicker_default, { ...commonProps });
+          return /* @__PURE__ */ jsx108(DatePicker_default, { ...commonProps });
         case "BOOLEAN":
-          return /* @__PURE__ */ jsx101(
+          return /* @__PURE__ */ jsx108(
             Checkbox_default,
             {
               ...commonProps,
@@ -14379,58 +15339,58 @@ var MultiInput = ({
             }
           );
         default:
-          return /* @__PURE__ */ jsx101(TextField_default, { ...commonProps, type });
+          return /* @__PURE__ */ jsx108(TextField_default, { ...commonProps, type });
       }
     },
     [placeholder, disabled, startIcon, endIcon, error, fieldType, type]
   );
-  const [currentInputValue, setCurrentInputValue] = useState26("");
-  const handleInputSubmit = useCallback19(() => {
+  const [currentInputValue, setCurrentInputValue] = useState28("");
+  const handleInputSubmit = useCallback22(() => {
     if (currentInputValue.trim() !== "") {
       handleAddValue(currentInputValue);
       setCurrentInputValue("");
     }
   }, [currentInputValue, handleAddValue]);
-  return /* @__PURE__ */ jsxs44(
+  return /* @__PURE__ */ jsxs46(
     FormControl_default,
     {
       error,
       helperText,
-      className: cx30(withVendorCSSClassPrefix28(bem20("multi-input")), className),
+      className: cx32(withVendorCSSClassPrefix30(bem20("multi-input")), className),
       style,
       children: [
-        label && /* @__PURE__ */ jsx101(InputLabel_default, { required, error: !!error, children: label }),
-        /* @__PURE__ */ jsxs44("div", { className: cx30(withVendorCSSClassPrefix28(bem20("multi-input", "container")), styles["container"]), children: [
-          /* @__PURE__ */ jsx101("div", { className: cx30(withVendorCSSClassPrefix28(bem20("multi-input", "input-row")), styles["inputRow"]), children: /* @__PURE__ */ jsx101("div", { className: cx30(withVendorCSSClassPrefix28(bem20("multi-input", "input-wrapper")), styles["inputWrapper"]), children: renderInputField(
+        label && /* @__PURE__ */ jsx108(InputLabel_default, { required, error: !!error, children: label }),
+        /* @__PURE__ */ jsxs46("div", { className: cx32(withVendorCSSClassPrefix30(bem20("multi-input", "container")), styles["container"]), children: [
+          /* @__PURE__ */ jsx108("div", { className: cx32(withVendorCSSClassPrefix30(bem20("multi-input", "input-row")), styles["inputRow"]), children: /* @__PURE__ */ jsx108("div", { className: cx32(withVendorCSSClassPrefix30(bem20("multi-input", "input-wrapper")), styles["inputWrapper"]), children: renderInputField(
             currentInputValue,
             setCurrentInputValue,
-            canAddMore ? /* @__PURE__ */ jsx101(PlusIcon, { iconClassName: styles["plusIcon"] }) : void 0,
+            canAddMore ? /* @__PURE__ */ jsx108(PlusIcon, { iconClassName: styles["plusIcon"] }) : void 0,
             canAddMore ? handleInputSubmit : void 0
           ) }) }),
-          values.length > 0 && /* @__PURE__ */ jsx101("div", { className: cx30(withVendorCSSClassPrefix28(bem20("multi-input", "list-container")), styles["listContainer"]), children: values.map((value, index) => /* @__PURE__ */ jsxs44(
+          values.length > 0 && /* @__PURE__ */ jsx108("div", { className: cx32(withVendorCSSClassPrefix30(bem20("multi-input", "list-container")), styles["listContainer"]), children: values.map((value, index) => /* @__PURE__ */ jsxs46(
             "div",
             {
-              className: cx30(withVendorCSSClassPrefix28(bem20("multi-input", "list-item")), styles["listItem"]),
+              className: cx32(withVendorCSSClassPrefix30(bem20("multi-input", "list-item")), styles["listItem"]),
               children: [
-                /* @__PURE__ */ jsx101(
+                /* @__PURE__ */ jsx108(
                   "span",
                   {
-                    className: cx30(withVendorCSSClassPrefix28(bem20("multi-input", "list-item-text")), styles["listItemText"]),
+                    className: cx32(withVendorCSSClassPrefix30(bem20("multi-input", "list-item-text")), styles["listItemText"]),
                     children: value
                   }
                 ),
-                canRemove && /* @__PURE__ */ jsx101(
+                canRemove && /* @__PURE__ */ jsx108(
                   "button",
                   {
                     type: "button",
                     onClick: () => handleRemoveValue(index),
                     disabled,
-                    className: cx30(
-                      withVendorCSSClassPrefix28(bem20("multi-input", "remove-button")),
+                    className: cx32(
+                      withVendorCSSClassPrefix30(bem20("multi-input", "remove-button")),
                       styles["removeButton"]
                     ),
                     title: "Remove value",
-                    children: /* @__PURE__ */ jsx101(BinIcon, { iconClassName: styles["icon"] })
+                    children: /* @__PURE__ */ jsx108(BinIcon, { iconClassName: styles["icon"] })
                   }
                 )
               ]
@@ -14445,7 +15405,7 @@ var MultiInput = ({
 var MultiInput_default = MultiInput;
 
 // src/components/presentation/UserProfile/BaseUserProfile.tsx
-import { Fragment as Fragment20, jsx as jsx102, jsxs as jsxs45 } from "react/jsx-runtime";
+import { Fragment as Fragment20, jsx as jsx109, jsxs as jsxs47 } from "react/jsx-runtime";
 var fieldsToSkip = [
   "roles.default",
   "active",
@@ -14489,10 +15449,10 @@ var BaseUserProfile = ({
   displayNameAttributes = []
 }) => {
   const { theme, colorScheme } = useTheme_default();
-  const [editedUser, setEditedUser] = useState27(flattenedProfile || profile);
-  const [editingFields, setEditingFields] = useState27({});
+  const [editedUser, setEditedUser] = useState29(flattenedProfile || profile);
+  const [editingFields, setEditingFields] = useState29({});
   const { t } = useTranslation_default(preferences?.i18n);
-  const shouldShowField = useCallback20(
+  const shouldShowField = useCallback23(
     (fieldName) => {
       if (fieldsToSkip.includes(fieldName)) {
         return false;
@@ -14507,7 +15467,7 @@ var BaseUserProfile = ({
     },
     [showFields, hideFields]
   );
-  const PencilIcon = () => /* @__PURE__ */ jsx102(
+  const PencilIcon = () => /* @__PURE__ */ jsx109(
     "svg",
     {
       width: "16",
@@ -14518,16 +15478,16 @@ var BaseUserProfile = ({
       strokeWidth: "2",
       strokeLinecap: "round",
       strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsx102("path", { d: "M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z" })
+      children: /* @__PURE__ */ jsx109("path", { d: "M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z" })
     }
   );
-  const toggleFieldEdit = useCallback20((fieldName) => {
+  const toggleFieldEdit = useCallback23((fieldName) => {
     setEditingFields((prev) => ({
       ...prev,
       [fieldName]: !prev[fieldName]
     }));
   }, []);
-  const getFieldPlaceholder = useCallback20((schema) => {
+  const getFieldPlaceholder = useCallback23((schema) => {
     const { type, displayName, description, name } = schema;
     const fieldLabel = displayName || description || name || "value";
     switch (type) {
@@ -14541,19 +15501,19 @@ var BaseUserProfile = ({
         return `Enter your ${fieldLabel.toLowerCase()}`;
     }
   }, []);
-  const formatLabel = useCallback20(
+  const formatLabel = useCallback23(
     (key) => key.split(/(?=[A-Z])|_/).map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join(" "),
     []
   );
   const styles = BaseUserProfile_styles_default(theme, colorScheme);
   const ObjectDisplay = ({ data }) => {
     if (!data || typeof data !== "object") return null;
-    return /* @__PURE__ */ jsx102("table", { className: styles.value, children: /* @__PURE__ */ jsx102("tbody", { children: Object.entries(data).map(([key, value]) => /* @__PURE__ */ jsxs45("tr", { children: [
-      /* @__PURE__ */ jsx102("td", { className: styles.objectKey, children: /* @__PURE__ */ jsxs45("strong", { children: [
+    return /* @__PURE__ */ jsx109("table", { className: styles.value, children: /* @__PURE__ */ jsx109("tbody", { children: Object.entries(data).map(([key, value]) => /* @__PURE__ */ jsxs47("tr", { children: [
+      /* @__PURE__ */ jsx109("td", { className: styles.objectKey, children: /* @__PURE__ */ jsxs47("strong", { children: [
         formatLabel(key),
         ":"
       ] }) }),
-      /* @__PURE__ */ jsx102("td", { className: styles.objectValue, children: typeof value === "object" ? /* @__PURE__ */ jsx102(ObjectDisplay, { data: value }) : String(value) })
+      /* @__PURE__ */ jsx109("td", { className: styles.objectValue, children: typeof value === "object" ? /* @__PURE__ */ jsx109(ObjectDisplay, { data: value }) : String(value) })
     ] }, key)) }) });
   };
   function set(obj, path, value) {
@@ -14571,7 +15531,7 @@ var BaseUserProfile = ({
       }
     }
   }
-  const handleFieldSave = useCallback20(
+  const handleFieldSave = useCallback23(
     (schema) => {
       if (!onUpdate || !schema.name) return;
       const fieldName = schema.name;
@@ -14601,7 +15561,7 @@ var BaseUserProfile = ({
     },
     [editedUser, flattenedProfile, onUpdate, toggleFieldEdit]
   );
-  const handleFieldCancel = useCallback20(
+  const handleFieldCancel = useCallback23(
     (fieldName) => {
       const currentUser2 = flattenedProfile || profile;
       setEditedUser((prev) => ({
@@ -14628,7 +15588,7 @@ var BaseUserProfile = ({
     const { value, displayName, description, name, type, required, mutability, subAttributes, multiValued } = schema;
     const label = displayName || description || name || "";
     if (subAttributes && Array.isArray(subAttributes)) {
-      return /* @__PURE__ */ jsx102(Fragment20, { children: subAttributes.map((subAttr, index) => {
+      return /* @__PURE__ */ jsx109(Fragment20, { children: subAttributes.map((subAttr, index) => {
         let displayValue2;
         if (Array.isArray(subAttr.value)) {
           displayValue2 = subAttr.value.map((item) => typeof item === "object" ? JSON.stringify(item) : String(item)).join(", ");
@@ -14637,9 +15597,9 @@ var BaseUserProfile = ({
         } else {
           displayValue2 = String(subAttr.value);
         }
-        return /* @__PURE__ */ jsxs45("div", { className: styles.field, children: [
-          /* @__PURE__ */ jsx102("span", { className: styles.label, children: subAttr.displayName || subAttr.description || "" }),
-          /* @__PURE__ */ jsx102("div", { className: styles.value, children: displayValue2 })
+        return /* @__PURE__ */ jsxs47("div", { className: styles.field, children: [
+          /* @__PURE__ */ jsx109("span", { className: styles.label, children: subAttr.displayName || subAttr.description || "" }),
+          /* @__PURE__ */ jsx109("div", { className: styles.value, children: displayValue2 })
         ] }, index);
       }) });
     }
@@ -14663,9 +15623,9 @@ var BaseUserProfile = ({
         } else {
           fieldValues = [];
         }
-        return /* @__PURE__ */ jsxs45(Fragment20, { children: [
-          /* @__PURE__ */ jsx102("span", { className: styles.label, children: label }),
-          /* @__PURE__ */ jsx102("div", { className: styles.value, children: /* @__PURE__ */ jsx102(
+        return /* @__PURE__ */ jsxs47(Fragment20, { children: [
+          /* @__PURE__ */ jsx109("span", { className: styles.label, children: label }),
+          /* @__PURE__ */ jsx109("div", { className: styles.value, children: /* @__PURE__ */ jsx109(
             MultiInput_default,
             {
               values: fieldValues,
@@ -14696,9 +15656,9 @@ var BaseUserProfile = ({
       } else {
         displayValue2 = "-";
       }
-      return /* @__PURE__ */ jsxs45(Fragment20, { children: [
-        /* @__PURE__ */ jsx102("span", { className: styles.label, children: label }),
-        /* @__PURE__ */ jsx102("div", { className: cx31(styles.value, !hasValues ? styles.valuePlaceholder : ""), children: !hasValues && isEditable2 && onStartEdit ? /* @__PURE__ */ jsx102(
+      return /* @__PURE__ */ jsxs47(Fragment20, { children: [
+        /* @__PURE__ */ jsx109("span", { className: styles.label, children: label }),
+        /* @__PURE__ */ jsx109("div", { className: cx33(styles.value, !hasValues ? styles.valuePlaceholder : ""), children: !hasValues && isEditable2 && onStartEdit ? /* @__PURE__ */ jsx109(
           Button_default,
           {
             onClick: onStartEdit,
@@ -14713,7 +15673,7 @@ var BaseUserProfile = ({
       ] });
     }
     if (type === "COMPLEX" && typeof value === "object") {
-      return /* @__PURE__ */ jsx102(ObjectDisplay, { data: value });
+      return /* @__PURE__ */ jsx109(ObjectDisplay, { data: value });
     }
     if (isEditing && onEditValue && mutability !== "READ_ONLY" && !readonlyFields.includes(name || "")) {
       let fieldValue;
@@ -14735,13 +15695,13 @@ var BaseUserProfile = ({
       let field;
       switch (type) {
         case "STRING":
-          field = /* @__PURE__ */ jsx102(TextField_default, { ...commonProps });
+          field = /* @__PURE__ */ jsx109(TextField_default, { ...commonProps });
           break;
         case "DATE_TIME":
-          field = /* @__PURE__ */ jsx102(DatePicker_default, { ...commonProps });
+          field = /* @__PURE__ */ jsx109(DatePicker_default, { ...commonProps });
           break;
         case "BOOLEAN":
-          field = /* @__PURE__ */ jsx102(
+          field = /* @__PURE__ */ jsx109(
             Checkbox_default,
             {
               ...commonProps,
@@ -14753,7 +15713,7 @@ var BaseUserProfile = ({
           );
           break;
         case "COMPLEX":
-          field = /* @__PURE__ */ jsx102(
+          field = /* @__PURE__ */ jsx109(
             "textarea",
             {
               value: fieldValue,
@@ -14765,11 +15725,11 @@ var BaseUserProfile = ({
           );
           break;
         default:
-          field = /* @__PURE__ */ jsx102(TextField_default, { ...commonProps });
+          field = /* @__PURE__ */ jsx109(TextField_default, { ...commonProps });
       }
-      return /* @__PURE__ */ jsxs45(Fragment20, { children: [
-        /* @__PURE__ */ jsx102("span", { className: styles.label, children: label }),
-        /* @__PURE__ */ jsx102("div", { className: styles.value, children: field })
+      return /* @__PURE__ */ jsxs47(Fragment20, { children: [
+        /* @__PURE__ */ jsx109("span", { className: styles.label, children: label }),
+        /* @__PURE__ */ jsx109("div", { className: styles.value, children: field })
       ] });
     }
     const hasValue = value !== void 0 && value !== null && value !== "";
@@ -14782,9 +15742,9 @@ var BaseUserProfile = ({
     } else {
       displayValue = "-";
     }
-    return /* @__PURE__ */ jsxs45(Fragment20, { children: [
-      /* @__PURE__ */ jsx102("span", { className: styles.label, children: label }),
-      /* @__PURE__ */ jsx102("div", { className: cx31(styles.value, !hasValue ? styles.valuePlaceholder : ""), children: !hasValue && isEditable && onStartEdit ? /* @__PURE__ */ jsx102(
+    return /* @__PURE__ */ jsxs47(Fragment20, { children: [
+      /* @__PURE__ */ jsx109("span", { className: styles.label, children: label }),
+      /* @__PURE__ */ jsx109("div", { className: cx33(styles.value, !hasValue ? styles.valuePlaceholder : ""), children: !hasValue && isEditable && onStartEdit ? /* @__PURE__ */ jsx109(
         Button_default,
         {
           onClick: onStartEdit,
@@ -14807,8 +15767,8 @@ var BaseUserProfile = ({
     if (!shouldShow) {
       return null;
     }
-    return /* @__PURE__ */ jsxs45("div", { className: styles.field, children: [
-      /* @__PURE__ */ jsx102("div", { className: styles.fieldInner, children: renderSchemaField(
+    return /* @__PURE__ */ jsxs47("div", { className: styles.field, children: [
+      /* @__PURE__ */ jsx109("div", { className: styles.fieldInner, children: renderSchemaField(
         schema,
         isFieldEditing,
         (value) => {
@@ -14818,10 +15778,10 @@ var BaseUserProfile = ({
         },
         () => toggleFieldEdit(schema.name)
       ) }),
-      editable && schema.mutability !== "READ_ONLY" && !isReadonlyField && /* @__PURE__ */ jsxs45("div", { className: styles.fieldActions, children: [
-        isFieldEditing && /* @__PURE__ */ jsxs45(Fragment20, { children: [
-          /* @__PURE__ */ jsx102(Button_default, { size: "small", color: "primary", variant: "solid", onClick: () => handleFieldSave(schema), children: "Save" }),
-          /* @__PURE__ */ jsx102(
+      editable && schema.mutability !== "READ_ONLY" && !isReadonlyField && /* @__PURE__ */ jsxs47("div", { className: styles.fieldActions, children: [
+        isFieldEditing && /* @__PURE__ */ jsxs47(Fragment20, { children: [
+          /* @__PURE__ */ jsx109(Button_default, { size: "small", color: "primary", variant: "solid", onClick: () => handleFieldSave(schema), children: "Save" }),
+          /* @__PURE__ */ jsx109(
             Button_default,
             {
               size: "small",
@@ -14832,7 +15792,7 @@ var BaseUserProfile = ({
             }
           )
         ] }),
-        !isFieldEditing && hasValue && /* @__PURE__ */ jsx102(
+        !isFieldEditing && hasValue && /* @__PURE__ */ jsx109(
           Button_default,
           {
             size: "small",
@@ -14841,7 +15801,7 @@ var BaseUserProfile = ({
             onClick: () => toggleFieldEdit(schema.name),
             title: "Edit",
             className: styles.editButton,
-            children: /* @__PURE__ */ jsx102(PencilIcon, {})
+            children: /* @__PURE__ */ jsx109(PencilIcon, {})
           }
         )
       ] })
@@ -14850,10 +15810,10 @@ var BaseUserProfile = ({
   if (!profile && !flattenedProfile) {
     return fallback;
   }
-  const containerClasses = cx31(
+  const containerClasses = cx33(
     styles.root,
     cardLayout ? styles.card : "",
-    withVendorCSSClassPrefix29("user-profile"),
+    withVendorCSSClassPrefix31("user-profile"),
     className
   );
   const currentUser = flattenedProfile || profile;
@@ -14864,9 +15824,9 @@ var BaseUserProfile = ({
       if (!shouldShowField(key)) return false;
       return value !== void 0 && value !== "" && value !== null;
     }).sort(([a], [b]) => a.localeCompare(b));
-    return /* @__PURE__ */ jsxs45(Fragment20, { children: [
-      /* @__PURE__ */ jsxs45("div", { className: styles.profileSummary, children: [
-        /* @__PURE__ */ jsx102(
+    return /* @__PURE__ */ jsxs47(Fragment20, { children: [
+      /* @__PURE__ */ jsxs47("div", { className: styles.profileSummary, children: [
+        /* @__PURE__ */ jsx109(
           Avatar,
           {
             imageUrl: getMappedUserProfileValue_default("picture", mergedMappings, currentUser),
@@ -14876,32 +15836,32 @@ var BaseUserProfile = ({
             isLoading
           }
         ),
-        /* @__PURE__ */ jsx102(Typography_default, { variant: "h3", fontWeight: "medium", children: displayName }),
-        getMappedUserProfileValue_default("email", mergedMappings, currentUser) && /* @__PURE__ */ jsx102(Typography_default, { variant: "body2", color: "textSecondary", children: getMappedUserProfileValue_default("email", mergedMappings, currentUser) })
+        /* @__PURE__ */ jsx109(Typography_default, { variant: "h3", fontWeight: "medium", children: displayName }),
+        getMappedUserProfileValue_default("email", mergedMappings, currentUser) && /* @__PURE__ */ jsx109(Typography_default, { variant: "body2", color: "textSecondary", children: getMappedUserProfileValue_default("email", mergedMappings, currentUser) })
       ] }),
-      /* @__PURE__ */ jsx102(Divider_default, {}),
-      profileEntries.map(([key, value], index) => /* @__PURE__ */ jsxs45("div", { children: [
-        /* @__PURE__ */ jsxs45("div", { className: styles.sectionRow, children: [
-          /* @__PURE__ */ jsx102("div", { className: styles.sectionLabel, children: formatLabel(key) }),
-          /* @__PURE__ */ jsx102("div", { className: styles.sectionValue, children: typeof value === "object" ? /* @__PURE__ */ jsx102(ObjectDisplay, { data: value }) : String(value) })
+      /* @__PURE__ */ jsx109(Divider_default, {}),
+      profileEntries.map(([key, value], index) => /* @__PURE__ */ jsxs47("div", { children: [
+        /* @__PURE__ */ jsxs47("div", { className: styles.sectionRow, children: [
+          /* @__PURE__ */ jsx109("div", { className: styles.sectionLabel, children: formatLabel(key) }),
+          /* @__PURE__ */ jsx109("div", { className: styles.sectionValue, children: typeof value === "object" ? /* @__PURE__ */ jsx109(ObjectDisplay, { data: value }) : String(value) })
         ] }),
-        index < profileEntries.length - 1 && /* @__PURE__ */ jsx102(Divider_default, {})
+        index < profileEntries.length - 1 && /* @__PURE__ */ jsx109(Divider_default, {})
       ] }, key))
     ] });
   };
-  const profileContent = /* @__PURE__ */ jsxs45(Card_default, { className: containerClasses, children: [
-    error && /* @__PURE__ */ jsxs45(
+  const profileContent = /* @__PURE__ */ jsxs47(Card_default, { className: containerClasses, children: [
+    error && /* @__PURE__ */ jsxs47(
       Alert_default,
       {
         variant: "error",
-        className: cx31(withVendorCSSClassPrefix29(bem21("user-profile", "alert")), styles.alert),
+        className: cx33(withVendorCSSClassPrefix31(bem21("user-profile", "alert")), styles.alert),
         children: [
-          /* @__PURE__ */ jsx102(Alert_default.Title, { children: t("errors.heading") || "Error" }),
-          /* @__PURE__ */ jsx102(Alert_default.Description, { children: error })
+          /* @__PURE__ */ jsx109(Alert_default.Title, { children: t("errors.heading") || "Error" }),
+          /* @__PURE__ */ jsx109(Alert_default.Description, { children: error })
         ]
       }
     ),
-    schemas && schemas.length > 0 && /* @__PURE__ */ jsx102("div", { className: styles.header, children: /* @__PURE__ */ jsx102(
+    schemas && schemas.length > 0 && /* @__PURE__ */ jsx109("div", { className: styles.header, children: /* @__PURE__ */ jsx109(
       Avatar,
       {
         imageUrl: getMappedUserProfileValue_default("picture", mergedMappings, currentUser),
@@ -14911,7 +15871,7 @@ var BaseUserProfile = ({
         isLoading
       }
     ) }),
-    /* @__PURE__ */ jsx102("div", { className: styles.infoContainer, children: schemas && schemas.length > 0 ? schemas.filter((schema) => {
+    /* @__PURE__ */ jsx109("div", { className: styles.infoContainer, children: schemas && schemas.length > 0 ? schemas.filter((schema) => {
       if (!schema.name || !shouldShowField(schema.name)) return false;
       if (!editable) {
         const value = flattenedProfile && schema.name ? flattenedProfile[schema.name] : void 0;
@@ -14928,13 +15888,13 @@ var BaseUserProfile = ({
         ...schema,
         value
       };
-      return /* @__PURE__ */ jsx102("div", { className: styles.info, children: renderUserInfo(schemaWithValue) }, schema.name || index);
+      return /* @__PURE__ */ jsx109("div", { className: styles.info, children: renderUserInfo(schemaWithValue) }, schema.name || index);
     }) : renderProfileWithoutSchemas() })
   ] });
   if (mode === "popup") {
-    return /* @__PURE__ */ jsx102(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs45(Dialog_default.Content, { children: [
-      /* @__PURE__ */ jsx102(Dialog_default.Heading, { children: title ?? t("user.profile.heading") }),
-      /* @__PURE__ */ jsx102("div", { className: styles.popup, children: profileContent })
+    return /* @__PURE__ */ jsx109(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs47(Dialog_default.Content, { children: [
+      /* @__PURE__ */ jsx109(Dialog_default.Heading, { children: title ?? t("user.profile.heading") }),
+      /* @__PURE__ */ jsx109("div", { className: styles.popup, children: profileContent })
     ] }) });
   }
   return profileContent;
@@ -14943,7 +15903,7 @@ var BaseUserProfile_default = BaseUserProfile;
 
 // src/components/presentation/UserProfile/UserProfile.tsx
 import { AsgardeoError } from "@asgardeo/browser";
-import { useState as useState28 } from "react";
+import { useState as useState30 } from "react";
 
 // src/api/updateMeProfile.ts
 import {
@@ -14976,12 +15936,12 @@ var updateMeProfile = async ({ fetcher, instanceId = 0, ...requestConfig }) => {
 var updateMeProfile_default = updateMeProfile;
 
 // src/components/presentation/UserProfile/UserProfile.tsx
-import { jsx as jsx103 } from "react/jsx-runtime";
+import { jsx as jsx110 } from "react/jsx-runtime";
 var UserProfile3 = ({ preferences, ...rest }) => {
   const { baseUrl, instanceId } = useAsgardeo_default();
   const { profile, flattenedProfile, schemas, onUpdateProfile } = useUser_default();
   const { t } = useTranslation_default(preferences?.i18n);
-  const [error, setError] = useState28(null);
+  const [error, setError] = useState30(null);
   const handleProfileUpdate = async (payload) => {
     setError(null);
     try {
@@ -14995,7 +15955,7 @@ var UserProfile3 = ({ preferences, ...rest }) => {
       setError(message);
     }
   };
-  return /* @__PURE__ */ jsx103(
+  return /* @__PURE__ */ jsx110(
     BaseUserProfile_default,
     {
       profile,
@@ -15011,8 +15971,8 @@ var UserProfile3 = ({ preferences, ...rest }) => {
 var UserProfile_default = UserProfile3;
 
 // src/components/presentation/UserDropdown/BaseUserDropdown.tsx
-import { withVendorCSSClassPrefix as withVendorCSSClassPrefix30 } from "@asgardeo/browser";
-import { cx as cx32 } from "@emotion/css";
+import { withVendorCSSClassPrefix as withVendorCSSClassPrefix32 } from "@asgardeo/browser";
+import { cx as cx34 } from "@emotion/css";
 import {
   useFloating as useFloating2,
   autoUpdate,
@@ -15026,7 +15986,7 @@ import {
   FloatingFocusManager as FloatingFocusManager2,
   FloatingPortal as FloatingPortal2
 } from "@floating-ui/react";
-import { useState as useState29 } from "react";
+import { useState as useState31 } from "react";
 
 // src/components/presentation/UserDropdown/BaseUserDropdown.styles.ts
 import { css as css29 } from "@emotion/css";
@@ -15218,7 +16178,7 @@ var useStyles28 = (theme, colorScheme) => useMemo39(() => {
 var BaseUserDropdown_styles_default = useStyles28;
 
 // src/components/presentation/UserDropdown/BaseUserDropdown.tsx
-import { jsx as jsx104, jsxs as jsxs46 } from "react/jsx-runtime";
+import { jsx as jsx111, jsxs as jsxs48 } from "react/jsx-runtime";
 var BaseUserDropdown = ({
   fallback = null,
   className = "",
@@ -15234,8 +16194,8 @@ var BaseUserDropdown = ({
 }) => {
   const { theme, colorScheme } = useTheme_default();
   const styles = BaseUserDropdown_styles_default(theme, colorScheme);
-  const [isOpen, setIsOpen] = useState29(false);
-  const [hoveredItemIndex, setHoveredItemIndex] = useState29(null);
+  const [isOpen, setIsOpen] = useState31(false);
+  const [hoveredItemIndex, setHoveredItemIndex] = useState31(null);
   const { refs, floatingStyles, context } = useFloating2({
     middleware: [offset(5), flip({ fallbackAxisSideDirection: "end" }), shift({ padding: 5 })],
     onOpenChange: setIsOpen,
@@ -15270,14 +16230,14 @@ var BaseUserDropdown = ({
   const defaultMenuItems = [];
   if (onManageProfile) {
     defaultMenuItems.push({
-      icon: /* @__PURE__ */ jsx104(User_default2, { width: "16", height: "16" }),
+      icon: /* @__PURE__ */ jsx111(User_default2, { width: "16", height: "16" }),
       label: "Manage Profile",
       onClick: onManageProfile
     });
   }
   if (onSignOut) {
     defaultMenuItems.push({
-      icon: /* @__PURE__ */ jsx104(LogOut_default, { width: "16", height: "16" }),
+      icon: /* @__PURE__ */ jsx111(LogOut_default, { width: "16", height: "16" }),
       label: "Sign Out",
       onClick: onSignOut
     });
@@ -15289,19 +16249,19 @@ var BaseUserDropdown = ({
     }
     allMenuItems.push(...defaultMenuItems);
   }
-  return /* @__PURE__ */ jsxs46("div", { className: cx32(withVendorCSSClassPrefix30("user-dropdown"), className), children: [
-    /* @__PURE__ */ jsxs46(
+  return /* @__PURE__ */ jsxs48("div", { className: cx34(withVendorCSSClassPrefix32("user-dropdown"), className), children: [
+    /* @__PURE__ */ jsxs48(
       Button_default,
       {
         ref: refs.setReference,
-        className: cx32(withVendorCSSClassPrefix30("user-dropdown__trigger"), styles["trigger"]),
+        className: cx34(withVendorCSSClassPrefix32("user-dropdown__trigger"), styles["trigger"]),
         color: "tertiary",
         variant: "text",
         size: "medium",
         "data-testid": "asgardeo-user-dropdown-trigger",
         ...getReferenceProps(),
         children: [
-          /* @__PURE__ */ jsx104(
+          /* @__PURE__ */ jsx111(
             Avatar,
             {
               imageUrl: getMappedUserProfileValue_default("picture", mergedMappings, user),
@@ -15310,22 +16270,22 @@ var BaseUserDropdown = ({
               alt: `${getDisplayName_default(mergedMappings, user)}'s avatar`
             }
           ),
-          showTriggerLabel && /* @__PURE__ */ jsx104(
+          showTriggerLabel && /* @__PURE__ */ jsx111(
             Typography_default,
             {
               variant: "body2",
-              className: cx32(withVendorCSSClassPrefix30("user-dropdown__trigger-label"), styles["userName"]),
+              className: cx34(withVendorCSSClassPrefix32("user-dropdown__trigger-label"), styles["userName"]),
               children: getDisplayName_default(mergedMappings, user)
             }
           )
         ]
       }
     ),
-    isOpen && /* @__PURE__ */ jsx104(FloatingPortal2, { id: portalId, children: /* @__PURE__ */ jsx104(FloatingFocusManager2, { context, modal: false, initialFocus: -1, children: /* @__PURE__ */ jsxs46(
+    isOpen && /* @__PURE__ */ jsx111(FloatingPortal2, { id: portalId, children: /* @__PURE__ */ jsx111(FloatingFocusManager2, { context, modal: false, initialFocus: -1, children: /* @__PURE__ */ jsxs48(
       "div",
       {
         ref: refs.setFloating,
-        className: cx32(withVendorCSSClassPrefix30("user-dropdown__content"), styles["dropdownContent"]),
+        className: cx34(withVendorCSSClassPrefix32("user-dropdown__content"), styles["dropdownContent"]),
         style: {
           ...floatingStyles,
           // Floating UI doesn't set a z-index by default, so we set a high value to ensure the dropdown appears above other elements.
@@ -15334,8 +16294,8 @@ var BaseUserDropdown = ({
         },
         ...getFloatingProps(),
         children: [
-          /* @__PURE__ */ jsxs46("div", { className: cx32(withVendorCSSClassPrefix30("user-dropdown__header"), styles["dropdownHeader"]), children: [
-            /* @__PURE__ */ jsx104(
+          /* @__PURE__ */ jsxs48("div", { className: cx34(withVendorCSSClassPrefix32("user-dropdown__header"), styles["dropdownHeader"]), children: [
+            /* @__PURE__ */ jsx111(
               Avatar,
               {
                 imageUrl: getMappedUserProfileValue_default("picture", mergedMappings, user),
@@ -15344,22 +16304,22 @@ var BaseUserDropdown = ({
                 alt: `${getDisplayName_default(mergedMappings, user)}'s avatar`
               }
             ),
-            /* @__PURE__ */ jsxs46("div", { className: cx32(withVendorCSSClassPrefix30("user-dropdown__header-info"), styles["headerInfo"]), children: [
-              /* @__PURE__ */ jsx104(
+            /* @__PURE__ */ jsxs48("div", { className: cx34(withVendorCSSClassPrefix32("user-dropdown__header-info"), styles["headerInfo"]), children: [
+              /* @__PURE__ */ jsx111(
                 Typography_default,
                 {
                   noWrap: true,
-                  className: withVendorCSSClassPrefix30("user-dropdown__header-name"),
+                  className: withVendorCSSClassPrefix32("user-dropdown__header-name"),
                   variant: "body1",
                   fontWeight: "medium",
                   children: getDisplayName_default(mergedMappings, user)
                 }
               ),
-              /* @__PURE__ */ jsx104(
+              /* @__PURE__ */ jsx111(
                 Typography_default,
                 {
                   noWrap: true,
-                  className: withVendorCSSClassPrefix30("user-dropdown__header-email"),
+                  className: withVendorCSSClassPrefix32("user-dropdown__header-email"),
                   variant: "caption",
                   color: "secondary",
                   children: getMappedUserProfileValue_default("username", mergedMappings, user) || getMappedUserProfileValue_default("email", mergedMappings, user)
@@ -15367,25 +16327,25 @@ var BaseUserDropdown = ({
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsx104("div", { className: cx32(withVendorCSSClassPrefix30("user-dropdown__menu"), styles["dropdownMenu"]), children: allMenuItems.map((item, index) => /* @__PURE__ */ jsx104("div", { children: (() => {
+          /* @__PURE__ */ jsx111("div", { className: cx34(withVendorCSSClassPrefix32("user-dropdown__menu"), styles["dropdownMenu"]), children: allMenuItems.map((item, index) => /* @__PURE__ */ jsx111("div", { children: (() => {
             if (item.label === "") {
-              return /* @__PURE__ */ jsx104(
+              return /* @__PURE__ */ jsx111(
                 "div",
                 {
-                  className: cx32(withVendorCSSClassPrefix30("user-dropdown__menu-divider"), styles["divider"])
+                  className: cx34(withVendorCSSClassPrefix32("user-dropdown__menu-divider"), styles["divider"])
                 }
               );
             }
             if (item.href) {
-              return /* @__PURE__ */ jsxs46(
+              return /* @__PURE__ */ jsxs48(
                 "a",
                 {
                   href: item.href,
                   style: {
                     backgroundColor: hoveredItemIndex === index ? theme.vars.colors.action?.hover : "transparent"
                   },
-                  className: cx32(
-                    withVendorCSSClassPrefix30("user-dropdown__menu-item"),
+                  className: cx34(
+                    withVendorCSSClassPrefix32("user-dropdown__menu-item"),
                     styles["menuItemAnchor"]
                   ),
                   onMouseEnter: () => setHoveredItemIndex(index),
@@ -15394,19 +16354,19 @@ var BaseUserDropdown = ({
                   onBlur: () => setHoveredItemIndex(null),
                   children: [
                     item.icon,
-                    /* @__PURE__ */ jsx104("span", { children: item.label })
+                    /* @__PURE__ */ jsx111("span", { children: item.label })
                   ]
                 }
               );
             }
-            return /* @__PURE__ */ jsx104(
+            return /* @__PURE__ */ jsx111(
               Button_default,
               {
                 onClick: () => handleMenuItemClick(item),
                 style: {
                   backgroundColor: hoveredItemIndex === index ? theme.vars.colors.action?.hover : "transparent"
                 },
-                className: cx32(withVendorCSSClassPrefix30("user-dropdown__menu-item"), styles["menuItem"]),
+                className: cx34(withVendorCSSClassPrefix32("user-dropdown__menu-item"), styles["menuItem"]),
                 color: "tertiary",
                 variant: "text",
                 size: "small",
@@ -15425,8 +16385,8 @@ var BaseUserDropdown = ({
 var BaseUserDropdown_default = BaseUserDropdown;
 
 // src/components/presentation/UserDropdown/UserDropdown.tsx
-import { useState as useState30 } from "react";
-import { Fragment as Fragment21, jsx as jsx105, jsxs as jsxs47 } from "react/jsx-runtime";
+import { useState as useState32 } from "react";
+import { Fragment as Fragment21, jsx as jsx112, jsxs as jsxs49 } from "react/jsx-runtime";
 var UserDropdown = ({
   children,
   renderTrigger,
@@ -15435,7 +16395,7 @@ var UserDropdown = ({
   ...rest
 }) => {
   const { user, isLoading, signOut, meta } = useAsgardeo_default();
-  const [isProfileOpen, setIsProfileOpen] = useState30(false);
+  const [isProfileOpen, setIsProfileOpen] = useState32(false);
   const handleManageProfile = () => {
     setIsProfileOpen(true);
   };
@@ -15458,14 +16418,14 @@ var UserDropdown = ({
     user
   };
   if (children) {
-    return /* @__PURE__ */ jsxs47(Fragment21, { children: [
+    return /* @__PURE__ */ jsxs49(Fragment21, { children: [
       children(renderProps),
-      /* @__PURE__ */ jsx105(UserProfile_default, { mode: "popup", open: isProfileOpen, onOpenChange: setIsProfileOpen })
+      /* @__PURE__ */ jsx112(UserProfile_default, { mode: "popup", open: isProfileOpen, onOpenChange: setIsProfileOpen })
     ] });
   }
   if (renderTrigger || renderDropdown) {
-    return /* @__PURE__ */ jsxs47(Fragment21, { children: [
-      renderTrigger ? renderTrigger(renderProps) : /* @__PURE__ */ jsx105(
+    return /* @__PURE__ */ jsxs49(Fragment21, { children: [
+      renderTrigger ? renderTrigger(renderProps) : /* @__PURE__ */ jsx112(
         BaseUserDropdown,
         {
           user,
@@ -15475,11 +16435,11 @@ var UserDropdown = ({
           ...rest
         }
       ),
-      /* @__PURE__ */ jsx105(UserProfile_default, { mode: "popup", open: isProfileOpen, onOpenChange: setIsProfileOpen })
+      /* @__PURE__ */ jsx112(UserProfile_default, { mode: "popup", open: isProfileOpen, onOpenChange: setIsProfileOpen })
     ] });
   }
-  return /* @__PURE__ */ jsxs47(Fragment21, { children: [
-    /* @__PURE__ */ jsx105(
+  return /* @__PURE__ */ jsxs49(Fragment21, { children: [
+    /* @__PURE__ */ jsx112(
       BaseUserDropdown,
       {
         user,
@@ -15489,13 +16449,13 @@ var UserDropdown = ({
         ...rest
       }
     ),
-    isProfileOpen && /* @__PURE__ */ jsx105(UserProfile_default, { mode: "popup", open: isProfileOpen, onOpenChange: setIsProfileOpen })
+    isProfileOpen && /* @__PURE__ */ jsx112(UserProfile_default, { mode: "popup", open: isProfileOpen, onOpenChange: setIsProfileOpen })
   ] });
 };
 var UserDropdown_default = UserDropdown;
 
 // src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.tsx
-import { cx as cx33 } from "@emotion/css";
+import { cx as cx35 } from "@emotion/css";
 import {
   useFloating as useFloating3,
   autoUpdate as autoUpdate2,
@@ -15509,7 +16469,7 @@ import {
   FloatingFocusManager as FloatingFocusManager3,
   FloatingPortal as FloatingPortal3
 } from "@floating-ui/react";
-import { useState as useState31 } from "react";
+import { useState as useState33 } from "react";
 
 // src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.styles.ts
 import { css as css30 } from "@emotion/css";
@@ -15737,9 +16697,9 @@ var useStyles29 = (theme, colorScheme) => useMemo40(() => {
 var BaseOrganizationSwitcher_styles_default = useStyles29;
 
 // src/components/primitives/Icons/Building.tsx
-import { jsx as jsx106, jsxs as jsxs48 } from "react/jsx-runtime";
-var Building = ({ color = "currentColor", height = 24, width = 24 }) => /* @__PURE__ */ jsxs48("svg", { width, height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-  /* @__PURE__ */ jsx106(
+import { jsx as jsx113, jsxs as jsxs50 } from "react/jsx-runtime";
+var Building = ({ color = "currentColor", height = 24, width = 24 }) => /* @__PURE__ */ jsxs50("svg", { width, height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+  /* @__PURE__ */ jsx113(
     "path",
     {
       d: "M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z",
@@ -15749,30 +16709,30 @@ var Building = ({ color = "currentColor", height = 24, width = 24 }) => /* @__PU
       strokeLinejoin: "round"
     }
   ),
-  /* @__PURE__ */ jsx106("path", { d: "M6 12h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
-  /* @__PURE__ */ jsx106("path", { d: "M6 8h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
-  /* @__PURE__ */ jsx106("path", { d: "M14 8h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
-  /* @__PURE__ */ jsx106("path", { d: "M14 12h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
-  /* @__PURE__ */ jsx106("path", { d: "M6 18h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
-  /* @__PURE__ */ jsx106("path", { d: "M14 18h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })
+  /* @__PURE__ */ jsx113("path", { d: "M6 12h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
+  /* @__PURE__ */ jsx113("path", { d: "M6 8h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
+  /* @__PURE__ */ jsx113("path", { d: "M14 8h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
+  /* @__PURE__ */ jsx113("path", { d: "M14 12h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
+  /* @__PURE__ */ jsx113("path", { d: "M6 18h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }),
+  /* @__PURE__ */ jsx113("path", { d: "M14 18h4", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })
 ] });
 Building.displayName = "Building";
 var Building_default = Building;
 
 // src/components/primitives/Icons/Check.tsx
-import { jsx as jsx107 } from "react/jsx-runtime";
-var Check = ({ color = "currentColor", height = 24, width = 24 }) => /* @__PURE__ */ jsx107("svg", { width, height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx107("path", { d: "M20 6 9 17l-5-5", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
+import { jsx as jsx114 } from "react/jsx-runtime";
+var Check = ({ color = "currentColor", height = 24, width = 24 }) => /* @__PURE__ */ jsx114("svg", { width, height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx114("path", { d: "M20 6 9 17l-5-5", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
 Check.displayName = "Check";
 var Check_default = Check;
 
 // src/components/primitives/Icons/ChevronDown.tsx
-import { jsx as jsx108 } from "react/jsx-runtime";
-var ChevronDown = ({ color = "currentColor", height = 24, width = 24 }) => /* @__PURE__ */ jsx108("svg", { width, height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx108("path", { d: "m6 9 6 6 6-6", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
+import { jsx as jsx115 } from "react/jsx-runtime";
+var ChevronDown = ({ color = "currentColor", height = 24, width = 24 }) => /* @__PURE__ */ jsx115("svg", { width, height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx115("path", { d: "m6 9 6 6 6-6", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
 ChevronDown.displayName = "ChevronDown";
 var ChevronDown_default = ChevronDown;
 
 // src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.tsx
-import { Fragment as Fragment22, jsx as jsx109, jsxs as jsxs49 } from "react/jsx-runtime";
+import { Fragment as Fragment22, jsx as jsx116, jsxs as jsxs51 } from "react/jsx-runtime";
 var BaseOrganizationSwitcher = ({
   organizations,
   currentOrganization,
@@ -15796,8 +16756,8 @@ var BaseOrganizationSwitcher = ({
 }) => {
   const { theme, colorScheme, direction } = useTheme_default();
   const styles = BaseOrganizationSwitcher_styles_default(theme, colorScheme);
-  const [isOpen, setIsOpen] = useState31(false);
-  const [hoveredItemIndex, setHoveredItemIndex] = useState31(null);
+  const [isOpen, setIsOpen] = useState33(false);
+  const [hoveredItemIndex, setHoveredItemIndex] = useState33(null);
   const { t } = useTranslation_default(preferences?.i18n);
   const isRTL = direction === "rtl";
   const { refs, floatingStyles, context } = useFloating3({
@@ -15827,8 +16787,8 @@ var BaseOrganizationSwitcher = ({
   const switchableOrganizations = organizations.filter(
     (org) => org.id !== currentOrganization?.id
   );
-  const defaultRenderOrganization2 = (organization, isSelected) => /* @__PURE__ */ jsxs49(Fragment22, { children: [
-    /* @__PURE__ */ jsx109(
+  const defaultRenderOrganization2 = (organization, isSelected) => /* @__PURE__ */ jsxs51(Fragment22, { children: [
+    /* @__PURE__ */ jsx116(
       Avatar,
       {
         variant: "square",
@@ -15838,35 +16798,35 @@ var BaseOrganizationSwitcher = ({
         alt: `${organization.name} avatar`
       }
     ),
-    /* @__PURE__ */ jsxs49("div", { className: cx33(styles["organizationInfo"]), children: [
-      /* @__PURE__ */ jsx109(Typography_default, { variant: "body2", fontWeight: "medium", className: cx33(styles["organizationName"]), children: organization.name }),
-      /* @__PURE__ */ jsxs49("div", { className: cx33(styles["organizationMeta"]), children: [
-        showMemberCount && organization.memberCount !== void 0 && /* @__PURE__ */ jsxs49("span", { children: [
+    /* @__PURE__ */ jsxs51("div", { className: cx35(styles["organizationInfo"]), children: [
+      /* @__PURE__ */ jsx116(Typography_default, { variant: "body2", fontWeight: "medium", className: cx35(styles["organizationName"]), children: organization.name }),
+      /* @__PURE__ */ jsxs51("div", { className: cx35(styles["organizationMeta"]), children: [
+        showMemberCount && organization.memberCount !== void 0 && /* @__PURE__ */ jsxs51("span", { children: [
           organization.memberCount,
           " ",
           organization.memberCount === 1 ? t("organization.switcher.member") : t("organization.switcher.members")
         ] }),
-        showRole && organization.role && showMemberCount && organization.memberCount !== void 0 && /* @__PURE__ */ jsx109("span", { children: " \u2022 " }),
-        showRole && organization.role && /* @__PURE__ */ jsx109("span", { className: cx33(styles["roleCapitalized"]), children: organization.role })
+        showRole && organization.role && showMemberCount && organization.memberCount !== void 0 && /* @__PURE__ */ jsx116("span", { children: " \u2022 " }),
+        showRole && organization.role && /* @__PURE__ */ jsx116("span", { className: cx35(styles["roleCapitalized"]), children: organization.role })
       ] })
     ] }),
-    isSelected && /* @__PURE__ */ jsx109(Check_default, { width: "16", height: "16", color: theme.vars.colors.text.primary })
+    isSelected && /* @__PURE__ */ jsx116(Check_default, { width: "16", height: "16", color: theme.vars.colors.text.primary })
   ] });
-  const defaultRenderLoading2 = () => /* @__PURE__ */ jsx109("div", { className: cx33(styles["loadingContainer"]), children: /* @__PURE__ */ jsx109(Typography_default, { variant: "caption", className: cx33(styles["loadingText"]), children: t("organization.switcher.loading.placeholder.organizations") }) });
-  const defaultRenderError2 = (errorMessage) => /* @__PURE__ */ jsx109("div", { className: cx33(styles["errorContainer"]), children: /* @__PURE__ */ jsx109(Typography_default, { variant: "caption", className: cx33(styles["errorText"]), children: errorMessage }) });
-  return /* @__PURE__ */ jsxs49("div", { className: cx33(styles["root"], className), style, children: [
-    /* @__PURE__ */ jsxs49(
+  const defaultRenderLoading2 = () => /* @__PURE__ */ jsx116("div", { className: cx35(styles["loadingContainer"]), children: /* @__PURE__ */ jsx116(Typography_default, { variant: "caption", className: cx35(styles["loadingText"]), children: t("organization.switcher.loading.placeholder.organizations") }) });
+  const defaultRenderError2 = (errorMessage) => /* @__PURE__ */ jsx116("div", { className: cx35(styles["errorContainer"]), children: /* @__PURE__ */ jsx116(Typography_default, { variant: "caption", className: cx35(styles["errorText"]), children: errorMessage }) });
+  return /* @__PURE__ */ jsxs51("div", { className: cx35(styles["root"], className), style, children: [
+    /* @__PURE__ */ jsxs51(
       Button_default,
       {
         ref: refs.setReference,
-        className: cx33(styles["trigger"]),
+        className: cx35(styles["trigger"]),
         color: "tertiary",
         variant: "outline",
         size: "medium",
         ...getReferenceProps(),
         children: [
-          currentOrganization ? /* @__PURE__ */ jsxs49(Fragment22, { children: [
-            /* @__PURE__ */ jsx109(
+          currentOrganization ? /* @__PURE__ */ jsxs51(Fragment22, { children: [
+            /* @__PURE__ */ jsx116(
               Avatar,
               {
                 variant: "square",
@@ -15876,25 +16836,25 @@ var BaseOrganizationSwitcher = ({
                 alt: `${currentOrganization.name} avatar`
               }
             ),
-            showTriggerLabel && /* @__PURE__ */ jsx109(Typography_default, { variant: "body2", className: cx33(styles["triggerLabel"]), children: currentOrganization.name })
-          ] }) : /* @__PURE__ */ jsxs49(Fragment22, { children: [
-            /* @__PURE__ */ jsx109(Building_default, { width: avatarSize, height: avatarSize }),
-            showTriggerLabel && /* @__PURE__ */ jsx109(Typography_default, { variant: "body2", className: cx33(styles["triggerLabel"]), children: t("elements.fields.organization.select.label") })
+            showTriggerLabel && /* @__PURE__ */ jsx116(Typography_default, { variant: "body2", className: cx35(styles["triggerLabel"]), children: currentOrganization.name })
+          ] }) : /* @__PURE__ */ jsxs51(Fragment22, { children: [
+            /* @__PURE__ */ jsx116(Building_default, { width: avatarSize, height: avatarSize }),
+            showTriggerLabel && /* @__PURE__ */ jsx116(Typography_default, { variant: "body2", className: cx35(styles["triggerLabel"]), children: t("elements.fields.organization.select.label") })
           ] }),
-          /* @__PURE__ */ jsx109("span", { style: { display: "inline-flex", transform: isRTL ? "scaleX(-1)" : "none" }, children: /* @__PURE__ */ jsx109(ChevronDown_default, { width: "16", height: "16" }) })
+          /* @__PURE__ */ jsx116("span", { style: { display: "inline-flex", transform: isRTL ? "scaleX(-1)" : "none" }, children: /* @__PURE__ */ jsx116(ChevronDown_default, { width: "16", height: "16" }) })
         ]
       }
     ),
-    isOpen && /* @__PURE__ */ jsx109(FloatingPortal3, { id: portalId, children: /* @__PURE__ */ jsx109(FloatingFocusManager3, { context, modal: false, initialFocus: -1, children: /* @__PURE__ */ jsxs49(
+    isOpen && /* @__PURE__ */ jsx116(FloatingPortal3, { id: portalId, children: /* @__PURE__ */ jsx116(FloatingFocusManager3, { context, modal: false, initialFocus: -1, children: /* @__PURE__ */ jsxs51(
       "div",
       {
         ref: refs.setFloating,
-        className: cx33(styles["content"]),
+        className: cx35(styles["content"]),
         style: floatingStyles,
         ...getFloatingProps(),
         children: [
-          currentOrganization && /* @__PURE__ */ jsxs49("div", { className: cx33(styles["header"]), children: [
-            /* @__PURE__ */ jsx109(
+          currentOrganization && /* @__PURE__ */ jsxs51("div", { className: cx35(styles["header"]), children: [
+            /* @__PURE__ */ jsx116(
               Avatar,
               {
                 variant: "square",
@@ -15904,10 +16864,10 @@ var BaseOrganizationSwitcher = ({
                 alt: `${currentOrganization.name} avatar`
               }
             ),
-            /* @__PURE__ */ jsxs49("div", { className: cx33(styles["headerInfo"]), children: [
-              /* @__PURE__ */ jsx109(Typography_default, { noWrap: true, className: cx33(styles["headerName"]), variant: "body1", fontWeight: "medium", children: currentOrganization.name }),
-              /* @__PURE__ */ jsxs49("div", { className: cx33(styles["headerMeta"]), children: [
-                showMemberCount && currentOrganization.memberCount !== void 0 && /* @__PURE__ */ jsxs49(
+            /* @__PURE__ */ jsxs51("div", { className: cx35(styles["headerInfo"]), children: [
+              /* @__PURE__ */ jsx116(Typography_default, { noWrap: true, className: cx35(styles["headerName"]), variant: "body1", fontWeight: "medium", children: currentOrganization.name }),
+              /* @__PURE__ */ jsxs51("div", { className: cx35(styles["headerMeta"]), children: [
+                showMemberCount && currentOrganization.memberCount !== void 0 && /* @__PURE__ */ jsxs51(
                   Typography_default,
                   {
                     noWrap: true,
@@ -15917,17 +16877,17 @@ var BaseOrganizationSwitcher = ({
                       currentOrganization.memberCount,
                       " ",
                       currentOrganization.memberCount === 1 ? t("organization.switcher.member") : t("organization.switcher.members"),
-                      showRole && currentOrganization.role && /* @__PURE__ */ jsxs49("span", { children: [
+                      showRole && currentOrganization.role && /* @__PURE__ */ jsxs51("span", { children: [
                         " \u2022 ",
                         currentOrganization.role
                       ] })
                     ]
                   }
                 ),
-                showRole && currentOrganization.role && (!showMemberCount || currentOrganization.memberCount === void 0) && /* @__PURE__ */ jsx109(Typography_default, { noWrap: true, className: cx33(styles["headerRole"]), variant: "caption", color: "secondary", children: currentOrganization.role })
+                showRole && currentOrganization.role && (!showMemberCount || currentOrganization.memberCount === void 0) && /* @__PURE__ */ jsx116(Typography_default, { noWrap: true, className: cx35(styles["headerRole"]), variant: "caption", color: "secondary", children: currentOrganization.role })
               ] })
             ] }),
-            onManageProfile && /* @__PURE__ */ jsx109(
+            onManageProfile && /* @__PURE__ */ jsx116(
               Button_default,
               {
                 onClick: onManageProfile,
@@ -15935,8 +16895,8 @@ var BaseOrganizationSwitcher = ({
                 variant: "outline",
                 size: "small",
                 "aria-label": "Manage Organization Profile",
-                className: cx33(styles["manageButton"]),
-                endIcon: /* @__PURE__ */ jsxs49(
+                className: cx35(styles["manageButton"]),
+                endIcon: /* @__PURE__ */ jsxs51(
                   "svg",
                   {
                     width: "16",
@@ -15948,8 +16908,8 @@ var BaseOrganizationSwitcher = ({
                     strokeLinecap: "round",
                     strokeLinejoin: "round",
                     children: [
-                      /* @__PURE__ */ jsx109("circle", { cx: "12", cy: "12", r: "3" }),
-                      /* @__PURE__ */ jsx109("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1 1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" })
+                      /* @__PURE__ */ jsx116("circle", { cx: "12", cy: "12", r: "3" }),
+                      /* @__PURE__ */ jsx116("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1 1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" })
                     ]
                   }
                 ),
@@ -15957,31 +16917,31 @@ var BaseOrganizationSwitcher = ({
               }
             )
           ] }),
-          organizations.length > 1 && /* @__PURE__ */ jsx109(
+          organizations.length > 1 && /* @__PURE__ */ jsx116(
             "div",
             {
-              className: cx33(styles["header"], styles["sectionHeaderContainer"]),
+              className: cx35(styles["header"], styles["sectionHeaderContainer"]),
               style: {
                 borderTop: currentOrganization ? `1px solid ${theme.vars.colors.border}` : "none"
               },
-              children: /* @__PURE__ */ jsx109(Typography_default, { variant: "caption", fontWeight: 600, className: cx33(styles["sectionHeader"]), children: t("organization.switcher.switch.organization") })
+              children: /* @__PURE__ */ jsx116(Typography_default, { variant: "caption", fontWeight: 600, className: cx35(styles["sectionHeader"]), children: t("organization.switcher.switch.organization") })
             }
           ),
-          /* @__PURE__ */ jsx109("div", { className: cx33(styles["menu"]), children: (() => {
+          /* @__PURE__ */ jsx116("div", { className: cx35(styles["menu"]), children: (() => {
             if (loading) {
               return renderLoading ? renderLoading() : defaultRenderLoading2();
             }
             if (error) {
               return renderError ? renderError(error) : defaultRenderError2(error);
             }
-            return /* @__PURE__ */ jsxs49(Fragment22, { children: [
+            return /* @__PURE__ */ jsxs51(Fragment22, { children: [
               switchableOrganizations.map((organization) => {
                 const isSelected = false;
-                return /* @__PURE__ */ jsx109(
+                return /* @__PURE__ */ jsx116(
                   Button_default,
                   {
                     onClick: () => handleOrganizationSwitch(organization),
-                    className: cx33(styles["menuItem"]),
+                    className: cx35(styles["menuItem"]),
                     color: "tertiary",
                     variant: "text",
                     size: "small",
@@ -15995,34 +16955,34 @@ var BaseOrganizationSwitcher = ({
                   organization.id
                 );
               }),
-              menuItems.length > 0 && /* @__PURE__ */ jsxs49(Fragment22, { children: [
-                /* @__PURE__ */ jsx109("div", { className: cx33(styles["menuDivider"]) }),
+              menuItems.length > 0 && /* @__PURE__ */ jsxs51(Fragment22, { children: [
+                /* @__PURE__ */ jsx116("div", { className: cx35(styles["menuDivider"]) }),
                 menuItems.map(
-                  (item, index) => /* @__PURE__ */ jsx109("div", { children: item.href ? /* @__PURE__ */ jsxs49(
+                  (item, index) => /* @__PURE__ */ jsx116("div", { children: item.href ? /* @__PURE__ */ jsxs51(
                     "a",
                     {
                       href: item.href,
                       style: {
                         backgroundColor: hoveredItemIndex === switchableOrganizations.length + index ? theme.vars.colors.action?.hover : "transparent"
                       },
-                      className: cx33(styles["menuItem"]),
+                      className: cx35(styles["menuItem"]),
                       onMouseEnter: () => setHoveredItemIndex(switchableOrganizations.length + index),
                       onMouseLeave: () => setHoveredItemIndex(null),
                       onFocus: () => setHoveredItemIndex(switchableOrganizations.length + index),
                       onBlur: () => setHoveredItemIndex(null),
                       children: [
                         item.icon,
-                        /* @__PURE__ */ jsx109("span", { children: item.label })
+                        /* @__PURE__ */ jsx116("span", { children: item.label })
                       ]
                     }
-                  ) : /* @__PURE__ */ jsx109(
+                  ) : /* @__PURE__ */ jsx116(
                     Button_default,
                     {
                       onClick: () => handleMenuItemClick(item),
                       style: {
                         backgroundColor: hoveredItemIndex === switchableOrganizations.length + index ? theme.vars.colors.action?.hover : "transparent"
                       },
-                      className: cx33(styles["menuItem"]),
+                      className: cx35(styles["menuItem"]),
                       color: "tertiary",
                       variant: "text",
                       size: "small",
@@ -16044,11 +17004,11 @@ var BaseOrganizationSwitcher = ({
 var BaseOrganizationSwitcher_default = BaseOrganizationSwitcher;
 
 // src/components/presentation/OrganizationSwitcher/OrganizationSwitcher.tsx
-import { useState as useState38 } from "react";
+import { useState as useState40 } from "react";
 
 // src/components/primitives/Icons/BuildingAlt.tsx
-import { jsx as jsx110, jsxs as jsxs50 } from "react/jsx-runtime";
-var BuildingAlt = ({ height = 24, width = 24 }) => /* @__PURE__ */ jsxs50(
+import { jsx as jsx117, jsxs as jsxs52 } from "react/jsx-runtime";
+var BuildingAlt = ({ height = 24, width = 24 }) => /* @__PURE__ */ jsxs52(
   "svg",
   {
     width,
@@ -16061,13 +17021,13 @@ var BuildingAlt = ({ height = 24, width = 24 }) => /* @__PURE__ */ jsxs50(
     strokeLinecap: "round",
     strokeLinejoin: "round",
     children: [
-      /* @__PURE__ */ jsx110("path", { d: "M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z" }),
-      /* @__PURE__ */ jsx110("path", { d: "M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2" }),
-      /* @__PURE__ */ jsx110("path", { d: "M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2" }),
-      /* @__PURE__ */ jsx110("path", { d: "M10 6h4" }),
-      /* @__PURE__ */ jsx110("path", { d: "M10 10h4" }),
-      /* @__PURE__ */ jsx110("path", { d: "M10 14h4" }),
-      /* @__PURE__ */ jsx110("path", { d: "M10 18h4" })
+      /* @__PURE__ */ jsx117("path", { d: "M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z" }),
+      /* @__PURE__ */ jsx117("path", { d: "M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2" }),
+      /* @__PURE__ */ jsx117("path", { d: "M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2" }),
+      /* @__PURE__ */ jsx117("path", { d: "M10 6h4" }),
+      /* @__PURE__ */ jsx117("path", { d: "M10 10h4" }),
+      /* @__PURE__ */ jsx117("path", { d: "M10 14h4" }),
+      /* @__PURE__ */ jsx117("path", { d: "M10 18h4" })
     ]
   }
 );
@@ -16075,12 +17035,12 @@ BuildingAlt.displayName = "BuildingAlt";
 var BuildingAlt_default = BuildingAlt;
 
 // src/components/presentation/CreateOrganization/CreateOrganization.tsx
-import { useState as useState33 } from "react";
+import { useState as useState35 } from "react";
 
 // src/components/presentation/CreateOrganization/BaseCreateOrganization.tsx
 import { createPackageComponentLogger as createPackageComponentLogger9 } from "@asgardeo/browser";
-import { cx as cx34 } from "@emotion/css";
-import { useState as useState32 } from "react";
+import { cx as cx36 } from "@emotion/css";
+import { useState as useState34 } from "react";
 
 // src/components/presentation/CreateOrganization/BaseCreateOrganization.styles.ts
 import { css as css31 } from "@emotion/css";
@@ -16221,7 +17181,7 @@ var useStyles30 = (theme, colorScheme) => useMemo41(() => {
 var BaseCreateOrganization_styles_default = useStyles30;
 
 // src/components/presentation/CreateOrganization/BaseCreateOrganization.tsx
-import { jsx as jsx111, jsxs as jsxs51 } from "react/jsx-runtime";
+import { jsx as jsx118, jsxs as jsxs53 } from "react/jsx-runtime";
 var logger11 = createPackageComponentLogger9(
   "@asgardeo/react",
   "BaseCreateOrganization"
@@ -16248,13 +17208,13 @@ var BaseCreateOrganization = ({
   const { theme, colorScheme } = useTheme_default();
   const styles = BaseCreateOrganization_styles_default(theme, colorScheme);
   const { t } = useTranslation_default(preferences?.i18n);
-  const [formData, setFormData] = useState32({
+  const [formData, setFormData] = useState34({
     description: "",
     handle: "",
     name: "",
     ...initialValues
   });
-  const [formErrors, setFormErrors] = useState32({});
+  const [formErrors, setFormErrors] = useState34({});
   const validateForm = () => {
     const errors = {};
     if (!formData.name.trim()) {
@@ -16311,13 +17271,13 @@ var BaseCreateOrganization = ({
       logger11.error("Form submission error:");
     }
   };
-  const createOrganizationContent = /* @__PURE__ */ jsx111("div", { className: cx34(styles["root"], cardLayout && styles["card"], className), style, children: /* @__PURE__ */ jsxs51("div", { className: cx34(styles["content"]), children: [
-    /* @__PURE__ */ jsxs51("form", { id: "create-organization-form", className: cx34(styles["form"]), onSubmit: handleSubmit, children: [
-      error && /* @__PURE__ */ jsxs51(Alert_default, { variant: "error", className: styles["errorAlert"], children: [
-        /* @__PURE__ */ jsx111(Alert_default.Title, { children: "Error" }),
-        /* @__PURE__ */ jsx111(Alert_default.Description, { children: error })
+  const createOrganizationContent = /* @__PURE__ */ jsx118("div", { className: cx36(styles["root"], cardLayout && styles["card"], className), style, children: /* @__PURE__ */ jsxs53("div", { className: cx36(styles["content"]), children: [
+    /* @__PURE__ */ jsxs53("form", { id: "create-organization-form", className: cx36(styles["form"]), onSubmit: handleSubmit, children: [
+      error && /* @__PURE__ */ jsxs53(Alert_default, { variant: "error", className: styles["errorAlert"], children: [
+        /* @__PURE__ */ jsx118(Alert_default.Title, { children: "Error" }),
+        /* @__PURE__ */ jsx118(Alert_default.Description, { children: error })
       ] }),
-      /* @__PURE__ */ jsx111("div", { className: cx34(styles["fieldGroup"]), children: /* @__PURE__ */ jsx111(
+      /* @__PURE__ */ jsx118("div", { className: cx36(styles["fieldGroup"]), children: /* @__PURE__ */ jsx118(
         TextField_default,
         {
           label: `${t("elements.fields.organization.name.label")}`,
@@ -16327,10 +17287,10 @@ var BaseCreateOrganization = ({
           disabled: loading,
           required: true,
           error: formErrors.name,
-          className: cx34(styles["input"])
+          className: cx36(styles["input"])
         }
       ) }),
-      /* @__PURE__ */ jsx111("div", { className: cx34(styles["fieldGroup"]), children: /* @__PURE__ */ jsx111(
+      /* @__PURE__ */ jsx118("div", { className: cx36(styles["fieldGroup"]), children: /* @__PURE__ */ jsx118(
         TextField_default,
         {
           label: `${t("elements.fields.organization.handle.label") || "Organization Handle"}`,
@@ -16341,15 +17301,15 @@ var BaseCreateOrganization = ({
           required: true,
           error: formErrors.handle,
           helperText: "This will be your organization's unique identifier. Only lowercase letters, numbers, and hyphens are allowed.",
-          className: cx34(styles["input"])
+          className: cx36(styles["input"])
         }
       ) }),
-      /* @__PURE__ */ jsx111("div", { className: cx34(styles["fieldGroup"]), children: /* @__PURE__ */ jsxs51(FormControl_default, { error: formErrors.description, children: [
-        /* @__PURE__ */ jsx111(InputLabel_default, { required: true, children: t("elements.fields.organization.description.label") }),
-        /* @__PURE__ */ jsx111(
+      /* @__PURE__ */ jsx118("div", { className: cx36(styles["fieldGroup"]), children: /* @__PURE__ */ jsxs53(FormControl_default, { error: formErrors.description, children: [
+        /* @__PURE__ */ jsx118(InputLabel_default, { required: true, children: t("elements.fields.organization.description.label") }),
+        /* @__PURE__ */ jsx118(
           "textarea",
           {
-            className: cx34(styles["textarea"], formErrors.description && styles["textareaError"]),
+            className: cx36(styles["textarea"], formErrors.description && styles["textareaError"]),
             placeholder: t("organization.create.description.placeholder"),
             value: formData.description,
             onChange: (e) => handleInputChange("description", e.target.value),
@@ -16360,15 +17320,15 @@ var BaseCreateOrganization = ({
       ] }) }),
       renderAdditionalFields && renderAdditionalFields()
     ] }),
-    /* @__PURE__ */ jsxs51("div", { className: cx34(styles["actions"]), children: [
-      onCancel && /* @__PURE__ */ jsx111(Button_default, { type: "button", variant: "outline", onClick: onCancel, disabled: loading, children: t("organization.create.buttons.cancel.text") }),
-      /* @__PURE__ */ jsx111(Button_default, { type: "submit", variant: "solid", color: "primary", disabled: loading, form: "create-organization-form", children: loading ? t("organization.create.buttons.create_organization.loading.text") : t("organization.create.buttons.create_organization.text") })
+    /* @__PURE__ */ jsxs53("div", { className: cx36(styles["actions"]), children: [
+      onCancel && /* @__PURE__ */ jsx118(Button_default, { type: "button", variant: "outline", onClick: onCancel, disabled: loading, children: t("organization.create.buttons.cancel.text") }),
+      /* @__PURE__ */ jsx118(Button_default, { type: "submit", variant: "solid", color: "primary", disabled: loading, form: "create-organization-form", children: loading ? t("organization.create.buttons.create_organization.loading.text") : t("organization.create.buttons.create_organization.text") })
     ] })
   ] }) });
   if (mode === "popup") {
-    return /* @__PURE__ */ jsx111(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs51(Dialog_default.Content, { children: [
-      /* @__PURE__ */ jsx111(Dialog_default.Heading, { children: title }),
-      /* @__PURE__ */ jsx111("div", { className: styles["popup"], children: createOrganizationContent })
+    return /* @__PURE__ */ jsx118(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs53(Dialog_default.Content, { children: [
+      /* @__PURE__ */ jsx118(Dialog_default.Heading, { children: title }),
+      /* @__PURE__ */ jsx118("div", { className: styles["popup"], children: createOrganizationContent })
     ] }) });
   }
   return createOrganizationContent;
@@ -16409,7 +17369,7 @@ var createOrganization = async ({
 var createOrganization_default = createOrganization;
 
 // src/components/presentation/CreateOrganization/CreateOrganization.tsx
-import { Fragment as Fragment23, jsx as jsx112 } from "react/jsx-runtime";
+import { Fragment as Fragment23, jsx as jsx119 } from "react/jsx-runtime";
 var CreateOrganization = ({
   onCreateOrganization,
   fallback = null,
@@ -16419,13 +17379,13 @@ var CreateOrganization = ({
 }) => {
   const { isSignedIn, baseUrl, instanceId } = useAsgardeo_default();
   const { currentOrganization, revalidateMyOrganizations } = useOrganization_default();
-  const [loading, setLoading] = useState33(false);
-  const [error, setError] = useState33(null);
+  const [loading, setLoading] = useState35(false);
+  const [error, setError] = useState35(null);
   if (!isSignedIn && fallback) {
     return fallback;
   }
   if (!isSignedIn) {
-    return /* @__PURE__ */ jsx112(Fragment23, {});
+    return /* @__PURE__ */ jsx119(Fragment23, {});
   }
   const parentId = defaultParentId || currentOrganization?.id || "";
   const handleSubmit = async (payload) => {
@@ -16460,7 +17420,7 @@ var CreateOrganization = ({
       setLoading(false);
     }
   };
-  return /* @__PURE__ */ jsx112(
+  return /* @__PURE__ */ jsx119(
     BaseCreateOrganization,
     {
       onSubmit: handleSubmit,
@@ -16474,11 +17434,11 @@ var CreateOrganization = ({
 };
 
 // src/components/presentation/OrganizationList/OrganizationList.tsx
-import { cx as cx36 } from "@emotion/css";
-import { useEffect as useEffect24, useState as useState34 } from "react";
+import { cx as cx38 } from "@emotion/css";
+import { useEffect as useEffect26, useState as useState36 } from "react";
 
 // src/components/presentation/OrganizationList/BaseOrganizationList.tsx
-import { cx as cx35 } from "@emotion/css";
+import { cx as cx37 } from "@emotion/css";
 import { useMemo as useMemo43 } from "react";
 
 // src/components/presentation/OrganizationList/BaseOrganizationList.styles.ts
@@ -16708,23 +17668,23 @@ var useStyles31 = (theme, colorScheme) => useMemo42(() => {
 var BaseOrganizationList_styles_default = useStyles31;
 
 // src/components/presentation/OrganizationList/BaseOrganizationList.tsx
-import { jsx as jsx113, jsxs as jsxs52 } from "react/jsx-runtime";
-var defaultRenderOrganization = (organization, styles, t, onOrganizationSelect, showStatus) => /* @__PURE__ */ jsxs52("div", { className: cx35(styles.organizationItem), children: [
-  /* @__PURE__ */ jsxs52("div", { className: cx35(styles.organizationContent), children: [
-    /* @__PURE__ */ jsx113(Avatar, { variant: "square", name: organization.name, size: 48, alt: `${organization.name} logo` }),
-    /* @__PURE__ */ jsxs52("div", { className: cx35(styles.organizationInfo), children: [
-      /* @__PURE__ */ jsx113(Typography_default, { variant: "h6", className: cx35(styles.organizationName), children: organization.name }),
-      /* @__PURE__ */ jsxs52(Typography_default, { variant: "body2", color: "textSecondary", className: cx35(styles.organizationHandle), children: [
+import { jsx as jsx120, jsxs as jsxs54 } from "react/jsx-runtime";
+var defaultRenderOrganization = (organization, styles, t, onOrganizationSelect, showStatus) => /* @__PURE__ */ jsxs54("div", { className: cx37(styles.organizationItem), children: [
+  /* @__PURE__ */ jsxs54("div", { className: cx37(styles.organizationContent), children: [
+    /* @__PURE__ */ jsx120(Avatar, { variant: "square", name: organization.name, size: 48, alt: `${organization.name} logo` }),
+    /* @__PURE__ */ jsxs54("div", { className: cx37(styles.organizationInfo), children: [
+      /* @__PURE__ */ jsx120(Typography_default, { variant: "h6", className: cx37(styles.organizationName), children: organization.name }),
+      /* @__PURE__ */ jsxs54(Typography_default, { variant: "body2", color: "textSecondary", className: cx37(styles.organizationHandle), children: [
         "@",
         organization.orgHandle
       ] }),
-      showStatus && /* @__PURE__ */ jsxs52(Typography_default, { variant: "body2", color: "textSecondary", className: cx35(styles.organizationStatus), children: [
+      showStatus && /* @__PURE__ */ jsxs54(Typography_default, { variant: "body2", color: "textSecondary", className: cx37(styles.organizationStatus), children: [
         t("organization.switcher.status.label"),
         " ",
-        /* @__PURE__ */ jsx113(
+        /* @__PURE__ */ jsx120(
           "span",
           {
-            className: cx35(
+            className: cx37(
               styles.statusText,
               organization.status === "ACTIVE" ? styles.statusTextActive : styles.statusTextInactive
             ),
@@ -16734,7 +17694,7 @@ var defaultRenderOrganization = (organization, styles, t, onOrganizationSelect,
       ] })
     ] })
   ] }),
-  organization.canSwitch && /* @__PURE__ */ jsx113("div", { className: cx35(styles.organizationActions), children: /* @__PURE__ */ jsx113(
+  organization.canSwitch && /* @__PURE__ */ jsx120("div", { className: cx37(styles.organizationActions), children: /* @__PURE__ */ jsx120(
     Button_default,
     {
       onClick: (e) => {
@@ -16747,17 +17707,17 @@ var defaultRenderOrganization = (organization, styles, t, onOrganizationSelect,
     }
   ) })
 ] }, organization.id);
-var defaultRenderLoading = (t, styles) => /* @__PURE__ */ jsxs52("div", { className: cx35(styles.loadingContainer), children: [
-  /* @__PURE__ */ jsx113(Spinner_default, { size: "medium" }),
-  /* @__PURE__ */ jsx113(Typography_default, { variant: "body1", color: "textSecondary", className: cx35(styles.loadingText), children: t("organization.switcher.loading.placeholder.organizations") })
+var defaultRenderLoading = (t, styles) => /* @__PURE__ */ jsxs54("div", { className: cx37(styles.loadingContainer), children: [
+  /* @__PURE__ */ jsx120(Spinner_default, { size: "medium" }),
+  /* @__PURE__ */ jsx120(Typography_default, { variant: "body1", color: "textSecondary", className: cx37(styles.loadingText), children: t("organization.switcher.loading.placeholder.organizations") })
 ] });
-var defaultRenderError = (errorMessage, t, styles) => /* @__PURE__ */ jsx113("div", { className: cx35(styles.errorContainer), children: /* @__PURE__ */ jsxs52(Typography_default, { variant: "body1", color: "error", children: [
-  /* @__PURE__ */ jsx113("strong", { children: t("organization.switcher.error.prefix") }),
+var defaultRenderError = (errorMessage, t, styles) => /* @__PURE__ */ jsx120("div", { className: cx37(styles.errorContainer), children: /* @__PURE__ */ jsxs54(Typography_default, { variant: "body1", color: "error", children: [
+  /* @__PURE__ */ jsx120("strong", { children: t("organization.switcher.error.prefix") }),
   " ",
   errorMessage
 ] }) });
-var defaultRenderLoadMore = (onLoadMore, isLoadingMore, t, styles) => /* @__PURE__ */ jsx113(Button_default, { onClick: onLoadMore, disabled: isLoadingMore, className: cx35(styles.loadMoreButton), type: "button", fullWidth: true, children: isLoadingMore ? t("organization.switcher.loading.more") : t("organization.switcher.buttons.load_more.text") });
-var defaultRenderEmpty = (t, styles) => /* @__PURE__ */ jsx113("div", { className: cx35(styles.emptyContainer), children: /* @__PURE__ */ jsx113(Typography_default, { variant: "body1", color: "textSecondary", className: cx35(styles.emptyText), children: t("organization.switcher.no.organizations") }) });
+var defaultRenderLoadMore = (onLoadMore, isLoadingMore, t, styles) => /* @__PURE__ */ jsx120(Button_default, { onClick: onLoadMore, disabled: isLoadingMore, className: cx37(styles.loadMoreButton), type: "button", fullWidth: true, children: isLoadingMore ? t("organization.switcher.loading.more") : t("organization.switcher.buttons.load_more.text") });
+var defaultRenderEmpty = (t, styles) => /* @__PURE__ */ jsx120("div", { className: cx37(styles.emptyContainer), children: /* @__PURE__ */ jsx120(Typography_default, { variant: "body1", color: "textSecondary", className: cx37(styles.emptyText), children: t("organization.switcher.no.organizations") }) });
 var BaseOrganizationList = ({
   className = "",
   allOrganizations,
@@ -16801,46 +17761,46 @@ var BaseOrganizationList = ({
   const renderLoadMoreWithStyles = renderLoadMore || ((onLoadMore, loadingMore) => defaultRenderLoadMore(onLoadMore, loadingMore, t, styles));
   const renderOrganizationWithStyles = renderOrganization || ((org) => defaultRenderOrganization(org, styles, t, onOrganizationSelect, showStatus));
   if (isLoading && organizationsWithSwitchAccess?.length === 0) {
-    const loadingContent = /* @__PURE__ */ jsx113("div", { className: cx35(styles["root"], className), style, children: renderLoadingWithStyles() });
+    const loadingContent = /* @__PURE__ */ jsx120("div", { className: cx37(styles["root"], className), style, children: renderLoadingWithStyles() });
     if (mode === "popup") {
-      return /* @__PURE__ */ jsx113(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs52(Dialog_default.Content, { children: [
-        /* @__PURE__ */ jsx113(Dialog_default.Heading, { children: title }),
-        /* @__PURE__ */ jsx113("div", { className: cx35(styles["popupContent"]), children: loadingContent })
+      return /* @__PURE__ */ jsx120(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs54(Dialog_default.Content, { children: [
+        /* @__PURE__ */ jsx120(Dialog_default.Heading, { children: title }),
+        /* @__PURE__ */ jsx120("div", { className: cx37(styles["popupContent"]), children: loadingContent })
       ] }) });
     }
     return loadingContent;
   }
   if (error && organizationsWithSwitchAccess?.length === 0) {
-    const errorContent = /* @__PURE__ */ jsx113("div", { className: cx35(styles["root"], className), style, children: renderErrorWithStyles(error) });
+    const errorContent = /* @__PURE__ */ jsx120("div", { className: cx37(styles["root"], className), style, children: renderErrorWithStyles(error) });
     if (mode === "popup") {
-      return /* @__PURE__ */ jsx113(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs52(Dialog_default.Content, { children: [
-        /* @__PURE__ */ jsx113(Dialog_default.Heading, { children: title }),
-        /* @__PURE__ */ jsx113("div", { className: cx35(styles["popupContent"]), children: errorContent })
+      return /* @__PURE__ */ jsx120(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs54(Dialog_default.Content, { children: [
+        /* @__PURE__ */ jsx120(Dialog_default.Heading, { children: title }),
+        /* @__PURE__ */ jsx120("div", { className: cx37(styles["popupContent"]), children: errorContent })
       ] }) });
     }
     return errorContent;
   }
   if (!isLoading && organizationsWithSwitchAccess?.length === 0) {
-    const emptyContent = /* @__PURE__ */ jsx113("div", { className: cx35(styles["root"], className), style, children: renderEmptyWithStyles() });
+    const emptyContent = /* @__PURE__ */ jsx120("div", { className: cx37(styles["root"], className), style, children: renderEmptyWithStyles() });
     if (mode === "popup") {
-      return /* @__PURE__ */ jsx113(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs52(Dialog_default.Content, { children: [
-        /* @__PURE__ */ jsx113(Dialog_default.Heading, { children: title }),
-        /* @__PURE__ */ jsx113("div", { className: cx35(styles["popupContent"]), children: emptyContent })
+      return /* @__PURE__ */ jsx120(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs54(Dialog_default.Content, { children: [
+        /* @__PURE__ */ jsx120(Dialog_default.Heading, { children: title }),
+        /* @__PURE__ */ jsx120("div", { className: cx37(styles["popupContent"]), children: emptyContent })
       ] }) });
     }
     return emptyContent;
   }
-  const organizationListContent = /* @__PURE__ */ jsxs52("div", { className: cx35(styles["root"], className), style, children: [
-    /* @__PURE__ */ jsxs52("div", { className: cx35(styles["header"]), children: [
-      /* @__PURE__ */ jsx113("div", { className: cx35(styles["headerInfo"]), children: /* @__PURE__ */ jsx113(Typography_default, { variant: "body2", color: "textSecondary", className: cx35(styles["subtitle"]), children: t("organization.switcher.showing.count", {
+  const organizationListContent = /* @__PURE__ */ jsxs54("div", { className: cx37(styles["root"], className), style, children: [
+    /* @__PURE__ */ jsxs54("div", { className: cx37(styles["header"]), children: [
+      /* @__PURE__ */ jsx120("div", { className: cx37(styles["headerInfo"]), children: /* @__PURE__ */ jsx120(Typography_default, { variant: "body2", color: "textSecondary", className: cx37(styles["subtitle"]), children: t("organization.switcher.showing.count", {
         showing: organizationsWithSwitchAccess?.length,
         total: allOrganizations?.organizations?.length || 0
       }) }) }),
-      onRefresh && /* @__PURE__ */ jsx113(
+      onRefresh && /* @__PURE__ */ jsx120(
         Button_default,
         {
           onClick: onRefresh,
-          className: cx35(styles["refreshButton"]),
+          className: cx37(styles["refreshButton"]),
           type: "button",
           variant: "outline",
           size: "small",
@@ -16848,16 +17808,16 @@ var BaseOrganizationList = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx113("div", { className: cx35(styles["listContainer"]), children: organizationsWithSwitchAccess?.map(
+    /* @__PURE__ */ jsx120("div", { className: cx37(styles["listContainer"]), children: organizationsWithSwitchAccess?.map(
       (organization, index) => renderOrganizationWithStyles(organization, index)
     ) }),
-    error && organizationsWithSwitchAccess?.length > 0 && /* @__PURE__ */ jsx113("div", { className: cx35(styles["errorMargin"]), children: renderErrorWithStyles(error) }),
-    hasMore && fetchMore && /* @__PURE__ */ jsx113("div", { className: cx35(styles["loadMoreMargin"]), children: renderLoadMoreWithStyles(fetchMore, isLoadingMore) })
+    error && organizationsWithSwitchAccess?.length > 0 && /* @__PURE__ */ jsx120("div", { className: cx37(styles["errorMargin"]), children: renderErrorWithStyles(error) }),
+    hasMore && fetchMore && /* @__PURE__ */ jsx120("div", { className: cx37(styles["loadMoreMargin"]), children: renderLoadMoreWithStyles(fetchMore, isLoadingMore) })
   ] });
   if (mode === "popup") {
-    return /* @__PURE__ */ jsx113(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs52(Dialog_default.Content, { children: [
-      /* @__PURE__ */ jsx113(Dialog_default.Heading, { children: title }),
-      /* @__PURE__ */ jsx113("div", { className: cx35(styles["popupContent"]), children: organizationListContent })
+    return /* @__PURE__ */ jsx120(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs54(Dialog_default.Content, { children: [
+      /* @__PURE__ */ jsx120(Dialog_default.Heading, { children: title }),
+      /* @__PURE__ */ jsx120("div", { className: cx37(styles["popupContent"]), children: organizationListContent })
     ] }) });
   }
   return organizationListContent;
@@ -16927,22 +17887,22 @@ var useStyles32 = (theme, colorScheme) => useMemo44(() => {
 var OrganizationList_styles_default = useStyles32;
 
 // src/components/presentation/OrganizationList/OrganizationList.tsx
-import { jsx as jsx114 } from "react/jsx-runtime";
+import { jsx as jsx121 } from "react/jsx-runtime";
 var OrganizationList = (props) => {
   const { onOrganizationSelect, className = "", style, ...baseProps } = props;
   const { autoFetch, filter, limit, recursive, ...filteredBaseProps } = baseProps;
   const { theme, colorScheme } = useTheme_default();
   const styles = OrganizationList_styles_default(theme, colorScheme);
   const { getAllOrganizations: getAllOrganizations2, error, isLoading, myOrganizations } = useOrganization_default();
-  const [allOrganizations, setAllOrganizations] = useState34({
+  const [allOrganizations, setAllOrganizations] = useState36({
     organizations: []
   });
-  useEffect24(() => {
+  useEffect26(() => {
     (async () => {
       setAllOrganizations(await getAllOrganizations2());
     })();
   }, []);
-  return /* @__PURE__ */ jsx114("div", { className: cx36(styles["root"], className), style, children: /* @__PURE__ */ jsx114("div", { className: cx36(styles["container"]), children: /* @__PURE__ */ jsx114(
+  return /* @__PURE__ */ jsx121("div", { className: cx38(styles["root"], className), style, children: /* @__PURE__ */ jsx121("div", { className: cx38(styles["container"]), children: /* @__PURE__ */ jsx121(
     BaseOrganizationList,
     {
       allOrganizations,
@@ -16958,12 +17918,12 @@ var OrganizationList_default = OrganizationList;
 
 // src/components/presentation/OrganizationProfile/OrganizationProfile.tsx
 import { createPackageComponentLogger as createPackageComponentLogger10 } from "@asgardeo/browser";
-import { useEffect as useEffect25, useState as useState37 } from "react";
+import { useEffect as useEffect27, useState as useState39 } from "react";
 
 // src/components/presentation/OrganizationProfile/BaseOrganizationProfile.tsx
 import { formatDate } from "@asgardeo/browser";
-import { cx as cx38 } from "@emotion/css";
-import { useState as useState36, useCallback as useCallback22 } from "react";
+import { cx as cx40 } from "@emotion/css";
+import { useState as useState38, useCallback as useCallback25 } from "react";
 
 // src/components/presentation/OrganizationProfile/BaseOrganizationProfile.styles.ts
 import { css as css34 } from "@emotion/css";
@@ -17122,9 +18082,9 @@ var useStyles33 = (theme, colorScheme) => useMemo45(
 var BaseOrganizationProfile_styles_default = useStyles33;
 
 // src/components/primitives/KeyValueInput/KeyValueInput.tsx
-import { withVendorCSSClassPrefix as withVendorCSSClassPrefix31, bem as bem22 } from "@asgardeo/browser";
-import { cx as cx37 } from "@emotion/css";
-import { useState as useState35, useCallback as useCallback21 } from "react";
+import { withVendorCSSClassPrefix as withVendorCSSClassPrefix33, bem as bem22 } from "@asgardeo/browser";
+import { cx as cx39 } from "@emotion/css";
+import { useState as useState37, useCallback as useCallback24 } from "react";
 
 // src/components/primitives/KeyValueInput/KeyValueInput.styles.ts
 import { css as css35 } from "@emotion/css";
@@ -17281,7 +18241,7 @@ var useStyles34 = (theme, colorScheme, disabled, readOnly, hasError) => useMemo4
 var KeyValueInput_styles_default = useStyles34;
 
 // src/components/primitives/KeyValueInput/KeyValueInput.tsx
-import { jsx as jsx115, jsxs as jsxs53 } from "react/jsx-runtime";
+import { jsx as jsx122, jsxs as jsxs55 } from "react/jsx-runtime";
 var KeyValueInput = ({
   className = "",
   disabled = false,
@@ -17304,10 +18264,10 @@ var KeyValueInput = ({
   const { theme, colorScheme } = useTheme_default();
   const styles = KeyValueInput_styles_default(theme, colorScheme, disabled, readOnly, !!error);
   const initialPairs = Array.isArray(value) ? value : Object.entries(value).map(([key, val]) => ({ key, value: String(val) }));
-  const [pairs, setPairs] = useState35(initialPairs);
-  const [newKey, setNewKey] = useState35("");
-  const [newValue, setNewValue] = useState35("");
-  const handleAddPair = useCallback21(() => {
+  const [pairs, setPairs] = useState37(initialPairs);
+  const [newKey, setNewKey] = useState37("");
+  const [newValue, setNewValue] = useState37("");
+  const handleAddPair = useCallback24(() => {
     if (!newKey.trim() || !newValue.trim()) return;
     if (maxPairs && pairs.length >= maxPairs) return;
     const newPair = {
@@ -17325,7 +18285,7 @@ var KeyValueInput = ({
       onAdd(newPair);
     }
   }, [newKey, newValue, pairs, maxPairs, onChange, onAdd]);
-  const handleRemovePair = useCallback21(
+  const handleRemovePair = useCallback24(
     (index) => {
       const pairToRemove = pairs[index];
       const updatedPairs = pairs.filter((_, i) => i !== index);
@@ -17339,7 +18299,7 @@ var KeyValueInput = ({
     },
     [pairs, onChange, onRemove]
   );
-  const handleUpdatePair = useCallback21(
+  const handleUpdatePair = useCallback24(
     (index, field, newVal) => {
       const updatedPairs = pairs.map((pair, i) => {
         if (i === index) {
@@ -17358,21 +18318,21 @@ var KeyValueInput = ({
   const isAddDisabled = disabled || readOnly || !canAddMore || !newKey.trim() || !newValue.trim();
   const renderReadOnlyContent = () => {
     if (pairs.length === 0) {
-      return /* @__PURE__ */ jsx115("div", { className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "empty-state")), styles["emptyState"]), children: "No attributes defined" });
+      return /* @__PURE__ */ jsx122("div", { className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "empty-state")), styles["emptyState"]), children: "No attributes defined" });
     }
-    return pairs.map((pair, index) => /* @__PURE__ */ jsxs53(
+    return pairs.map((pair, index) => /* @__PURE__ */ jsxs55(
       "div",
       {
-        className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "readonly-pair")), styles["readOnlyPair"]),
+        className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "readonly-pair")), styles["readOnlyPair"]),
         children: [
-          /* @__PURE__ */ jsxs53("span", { className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "readonly-key")), styles["readOnlyKey"]), children: [
+          /* @__PURE__ */ jsxs55("span", { className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "readonly-key")), styles["readOnlyKey"]), children: [
             pair.key,
             ":"
           ] }),
-          /* @__PURE__ */ jsx115(
+          /* @__PURE__ */ jsx122(
             "span",
             {
-              className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "readonly-value")), styles["readOnlyValue"]),
+              className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "readonly-value")), styles["readOnlyValue"]),
               children: pair.value
             }
           )
@@ -17381,83 +18341,83 @@ var KeyValueInput = ({
       `${pair.key}-${index}`
     ));
   };
-  return /* @__PURE__ */ jsxs53("div", { className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input")), styles["container"], className), children: [
-    label && /* @__PURE__ */ jsxs53("label", { className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "label")), styles["label"]), children: [
+  return /* @__PURE__ */ jsxs55("div", { className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input")), styles["container"], className), children: [
+    label && /* @__PURE__ */ jsxs55("label", { className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "label")), styles["label"]), children: [
       label,
-      required && /* @__PURE__ */ jsx115(
+      required && /* @__PURE__ */ jsx122(
         "span",
         {
-          className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "required")), styles["requiredIndicator"]),
+          className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "required")), styles["requiredIndicator"]),
           children: " *"
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs53("div", { className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "pairs-list")), styles["pairsList"]), children: [
-      readOnly ? renderReadOnlyContent() : pairs.map((pair, index) => /* @__PURE__ */ jsxs53(
+    /* @__PURE__ */ jsxs55("div", { className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "pairs-list")), styles["pairsList"]), children: [
+      readOnly ? renderReadOnlyContent() : pairs.map((pair, index) => /* @__PURE__ */ jsxs55(
         "div",
         {
-          className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "pair-row")), styles["pairRow"]),
+          className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "pair-row")), styles["pairRow"]),
           children: [
-            /* @__PURE__ */ jsx115(
+            /* @__PURE__ */ jsx122(
               TextField_default,
               {
                 placeholder: keyPlaceholder,
                 value: pair.key,
                 onChange: (e) => handleUpdatePair(index, "key", e.target.value),
                 disabled: disabled || readOnly,
-                className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "pair-input")), styles["pairInput"]),
+                className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "pair-input")), styles["pairInput"]),
                 "aria-label": `${keyLabel} ${index + 1}`
               }
             ),
-            /* @__PURE__ */ jsx115(
+            /* @__PURE__ */ jsx122(
               TextField_default,
               {
                 placeholder: valuePlaceholder,
                 value: pair.value,
                 onChange: (e) => handleUpdatePair(index, "value", e.target.value),
                 disabled: disabled || readOnly,
-                className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "pair-input")), styles["pairInput"]),
+                className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "pair-input")), styles["pairInput"]),
                 "aria-label": `${valueLabel} ${index + 1}`
               }
             ),
-            !readOnly && /* @__PURE__ */ jsx115(
+            !readOnly && /* @__PURE__ */ jsx122(
               "button",
               {
                 type: "button",
                 onClick: () => handleRemovePair(index),
                 disabled,
-                className: cx37(
-                  withVendorCSSClassPrefix31(bem22("key-value-input", "remove-button")),
+                className: cx39(
+                  withVendorCSSClassPrefix33(bem22("key-value-input", "remove-button")),
                   styles["removeButton"]
                 ),
                 "aria-label": `${removeButtonText} ${pair.key}`,
-                children: /* @__PURE__ */ jsx115(X_default, { width: 16, height: 16 })
+                children: /* @__PURE__ */ jsx122(X_default, { width: 16, height: 16 })
               }
             )
           ]
         },
         `${pair.key}-${index}`
       )),
-      !readOnly && /* @__PURE__ */ jsxs53("div", { className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "add-row")), styles["addRow"]), children: [
-        /* @__PURE__ */ jsx115(
+      !readOnly && /* @__PURE__ */ jsxs55("div", { className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "add-row")), styles["addRow"]), children: [
+        /* @__PURE__ */ jsx122(
           TextField_default,
           {
             placeholder: keyPlaceholder,
             value: newKey,
             onChange: (e) => setNewKey(e.target.value),
             disabled,
-            className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "pair-input")), styles["pairInput"]),
+            className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "pair-input")), styles["pairInput"]),
             "aria-label": "New key"
           }
         ),
-        /* @__PURE__ */ jsx115(
+        /* @__PURE__ */ jsx122(
           TextField_default,
           {
             placeholder: valuePlaceholder,
             value: newValue,
             onChange: (e) => setNewValue(e.target.value),
             disabled,
-            className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "pair-input")), styles["pairInput"]),
+            className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "pair-input")), styles["pairInput"]),
             "aria-label": "New value",
             onKeyPress: (e) => {
               if (e.key === "Enter" && !isAddDisabled) {
@@ -17466,21 +18426,21 @@ var KeyValueInput = ({
             }
           }
         ),
-        /* @__PURE__ */ jsx115(
+        /* @__PURE__ */ jsx122(
           "button",
           {
             type: "button",
             onClick: handleAddPair,
             disabled: isAddDisabled,
-            className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "add-button")), styles["addButton"]),
+            className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "add-button")), styles["addButton"]),
             "aria-label": "Add new key-value pair",
-            children: /* @__PURE__ */ jsx115(Plus_default, { width: 16, height: 16 })
+            children: /* @__PURE__ */ jsx122(Plus_default, { width: 16, height: 16 })
           }
         )
       ] })
     ] }),
-    (helperText || error) && /* @__PURE__ */ jsx115("div", { className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "helper-text")), styles["helperText"]), children: error || helperText }),
-    maxPairs && /* @__PURE__ */ jsxs53("div", { className: cx37(withVendorCSSClassPrefix31(bem22("key-value-input", "counter")), styles["counterText"]), children: [
+    (helperText || error) && /* @__PURE__ */ jsx122("div", { className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "helper-text")), styles["helperText"]), children: error || helperText }),
+    maxPairs && /* @__PURE__ */ jsxs55("div", { className: cx39(withVendorCSSClassPrefix33(bem22("key-value-input", "counter")), styles["counterText"]), children: [
       pairs.length,
       " of ",
       maxPairs,
@@ -17491,7 +18451,7 @@ var KeyValueInput = ({
 var KeyValueInput_default = KeyValueInput;
 
 // src/components/presentation/OrganizationProfile/BaseOrganizationProfile.tsx
-import { Fragment as Fragment24, jsx as jsx116, jsxs as jsxs54 } from "react/jsx-runtime";
+import { Fragment as Fragment24, jsx as jsx123, jsxs as jsxs56 } from "react/jsx-runtime";
 var BaseOrganizationProfile = ({
   fallback = null,
   className = "",
@@ -17538,9 +18498,9 @@ var BaseOrganizationProfile = ({
 }) => {
   const { theme, colorScheme } = useTheme_default();
   const styles = BaseOrganizationProfile_styles_default(theme, colorScheme);
-  const [editedOrganization, setEditedOrganization] = useState36(organization);
-  const [editingFields, setEditingFields] = useState36({});
-  const PencilIcon = () => /* @__PURE__ */ jsx116(
+  const [editedOrganization, setEditedOrganization] = useState38(organization);
+  const [editingFields, setEditingFields] = useState38({});
+  const PencilIcon = () => /* @__PURE__ */ jsx123(
     "svg",
     {
       width: "16",
@@ -17551,16 +18511,16 @@ var BaseOrganizationProfile = ({
       strokeWidth: "2",
       strokeLinecap: "round",
       strokeLinejoin: "round",
-      children: /* @__PURE__ */ jsx116("path", { d: "M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z" })
+      children: /* @__PURE__ */ jsx123("path", { d: "M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z" })
     }
   );
-  const toggleFieldEdit = useCallback22((fieldName) => {
+  const toggleFieldEdit = useCallback25((fieldName) => {
     setEditingFields((prev) => ({
       ...prev,
       [fieldName]: !prev[fieldName]
     }));
   }, []);
-  const getFieldPlaceholder = useCallback22((fieldKey) => {
+  const getFieldPlaceholder = useCallback25((fieldKey) => {
     const fieldLabels = {
       description: "organization description",
       name: "organization name",
@@ -17571,7 +18531,7 @@ var BaseOrganizationProfile = ({
     const fieldLabel = fieldLabels[fieldKey] || fieldKey.toLowerCase();
     return `Enter ${fieldLabel}`;
   }, []);
-  const handleFieldSave = useCallback22(
+  const handleFieldSave = useCallback25(
     (fieldKey) => {
       if (!onUpdate || !fieldKey) return;
       let fieldValue;
@@ -17590,7 +18550,7 @@ var BaseOrganizationProfile = ({
     },
     [editedOrganization, organization, onUpdate, toggleFieldEdit]
   );
-  const handleFieldCancel = useCallback22(
+  const handleFieldCancel = useCallback25(
     (fieldKey) => {
       setEditedOrganization((prev) => ({
         ...prev,
@@ -17612,7 +18572,7 @@ var BaseOrganizationProfile = ({
     if (isEditing && onEditValue && fieldEditable && editable) {
       const fieldValue = editedOrganization && key && editedOrganization[key] !== void 0 ? editedOrganization[key] : value || "";
       const commonProps = {
-        className: cx38(styles["fieldInput"]),
+        className: cx40(styles["fieldInput"]),
         label: void 0,
         onChange: (e) => onEditValue(e.target ? e.target.value : e),
         placeholder: getFieldPlaceholder(key),
@@ -17621,7 +18581,7 @@ var BaseOrganizationProfile = ({
       let fieldInput;
       if (key === "attributes") {
         const attributesValue = typeof fieldValue === "object" && fieldValue !== null ? fieldValue : {};
-        fieldInput = /* @__PURE__ */ jsx116(
+        fieldInput = /* @__PURE__ */ jsx123(
           KeyValueInput_default,
           {
             value: attributesValue,
@@ -17659,26 +18619,26 @@ var BaseOrganizationProfile = ({
           }
         );
       } else {
-        fieldInput = /* @__PURE__ */ jsx116(TextField_default, { ...commonProps });
+        fieldInput = /* @__PURE__ */ jsx123(TextField_default, { ...commonProps });
       }
-      return /* @__PURE__ */ jsxs54(Fragment24, { children: [
-        /* @__PURE__ */ jsx116("span", { className: cx38(styles["label"]), children: label }),
-        /* @__PURE__ */ jsx116("div", { className: cx38(styles["value"]), children: fieldInput })
+      return /* @__PURE__ */ jsxs56(Fragment24, { children: [
+        /* @__PURE__ */ jsx123("span", { className: cx40(styles["label"]), children: label }),
+        /* @__PURE__ */ jsx123("div", { className: cx40(styles["value"]), children: fieldInput })
       ] });
     }
     const hasValue = value !== void 0 && value !== null && value !== "";
     const isFieldEditable = editable && fieldEditable;
     let displayValue;
     if (hasValue) {
-      displayValue = key === "attributes" && typeof value === "object" && value !== null ? /* @__PURE__ */ jsx116(KeyValueInput_default, { value, readOnly: true, label: "" }) : String(renderedValue);
+      displayValue = key === "attributes" && typeof value === "object" && value !== null ? /* @__PURE__ */ jsx123(KeyValueInput_default, { value, readOnly: true, label: "" }) : String(renderedValue);
     } else if (isFieldEditable) {
       displayValue = getFieldPlaceholder(key);
     } else {
       displayValue = "-";
     }
-    return /* @__PURE__ */ jsxs54(Fragment24, { children: [
-      /* @__PURE__ */ jsx116("span", { className: cx38(styles["label"]), children: label }),
-      /* @__PURE__ */ jsx116("div", { className: cx38(styles["value"], !hasValue && styles["valueEmpty"]), children: !hasValue && isFieldEditable && onStartEdit ? /* @__PURE__ */ jsx116(
+    return /* @__PURE__ */ jsxs56(Fragment24, { children: [
+      /* @__PURE__ */ jsx123("span", { className: cx40(styles["label"]), children: label }),
+      /* @__PURE__ */ jsx123("div", { className: cx40(styles["value"], !hasValue && styles["valueEmpty"]), children: !hasValue && isFieldEditable && onStartEdit ? /* @__PURE__ */ jsx123(
         Button_default,
         {
           onClick: onStartEdit,
@@ -17686,7 +18646,7 @@ var BaseOrganizationProfile = ({
           color: "secondary",
           size: "small",
           title: "Click to edit",
-          className: cx38(styles["placeholderButton"]),
+          className: cx40(styles["placeholderButton"]),
           children: displayValue
         }
       ) : displayValue })
@@ -17701,8 +18661,8 @@ var BaseOrganizationProfile = ({
     if (!shouldShow) {
       return null;
     }
-    return /* @__PURE__ */ jsxs54("div", { className: cx38(styles["field"]), children: [
-      /* @__PURE__ */ jsx116("div", { className: cx38(styles["fieldContent"]), children: renderField(
+    return /* @__PURE__ */ jsxs56("div", { className: cx40(styles["field"]), children: [
+      /* @__PURE__ */ jsx123("div", { className: cx40(styles["fieldContent"]), children: renderField(
         field,
         isFieldEditing,
         (value) => {
@@ -17712,8 +18672,8 @@ var BaseOrganizationProfile = ({
         },
         () => toggleFieldEdit(field.key)
       ) }),
-      isFieldEditable && /* @__PURE__ */ jsx116("div", { className: cx38(styles["fieldActions"]), children: isFieldEditing ? /* @__PURE__ */ jsxs54(Fragment24, { children: [
-        /* @__PURE__ */ jsx116(
+      isFieldEditable && /* @__PURE__ */ jsx123("div", { className: cx40(styles["fieldActions"]), children: isFieldEditing ? /* @__PURE__ */ jsxs56(Fragment24, { children: [
+        /* @__PURE__ */ jsx123(
           Button_default,
           {
             onClick: () => handleFieldSave(field.key),
@@ -17724,7 +18684,7 @@ var BaseOrganizationProfile = ({
             children: saveButtonText
           }
         ),
-        /* @__PURE__ */ jsx116(
+        /* @__PURE__ */ jsx123(
           Button_default,
           {
             onClick: () => handleFieldCancel(field.key),
@@ -17735,7 +18695,7 @@ var BaseOrganizationProfile = ({
             children: cancelButtonText
           }
         )
-      ] }) : hasValue && /* @__PURE__ */ jsx116(
+      ] }) : hasValue && /* @__PURE__ */ jsx123(
         Button_default,
         {
           onClick: () => toggleFieldEdit(field.key),
@@ -17743,8 +18703,8 @@ var BaseOrganizationProfile = ({
           color: "secondary",
           size: "small",
           title: "Edit field",
-          className: cx38(styles["editButton"]),
-          children: /* @__PURE__ */ jsx116(PencilIcon, {})
+          className: cx40(styles["editButton"]),
+          children: /* @__PURE__ */ jsx123(PencilIcon, {})
         }
       ) })
     ] }, field.key);
@@ -17752,23 +18712,23 @@ var BaseOrganizationProfile = ({
   if (!organization) {
     return fallback;
   }
-  const profileContent = /* @__PURE__ */ jsxs54(Card_default, { className: cx38(styles["root"], cardLayout && styles["card"], className), children: [
-    /* @__PURE__ */ jsxs54("div", { className: cx38(styles["header"]), children: [
-      /* @__PURE__ */ jsx116(Avatar, { name: getOrgInitials(organization.name), size: 80, alt: `${organization.name} logo` }),
-      /* @__PURE__ */ jsxs54("div", { className: cx38(styles["orgInfo"]), children: [
-        /* @__PURE__ */ jsx116("h2", { className: cx38(styles["name"]), children: organization.name }),
-        organization.orgHandle && /* @__PURE__ */ jsxs54("p", { className: cx38(styles["handle"]), children: [
+  const profileContent = /* @__PURE__ */ jsxs56(Card_default, { className: cx40(styles["root"], cardLayout && styles["card"], className), children: [
+    /* @__PURE__ */ jsxs56("div", { className: cx40(styles["header"]), children: [
+      /* @__PURE__ */ jsx123(Avatar, { name: getOrgInitials(organization.name), size: 80, alt: `${organization.name} logo` }),
+      /* @__PURE__ */ jsxs56("div", { className: cx40(styles["orgInfo"]), children: [
+        /* @__PURE__ */ jsx123("h2", { className: cx40(styles["name"]), children: organization.name }),
+        organization.orgHandle && /* @__PURE__ */ jsxs56("p", { className: cx40(styles["handle"]), children: [
           "@",
           organization.orgHandle
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsx116("div", { className: cx38(styles["infoContainer"]), children: fields.map((field) => renderOrganizationField(field)) })
+    /* @__PURE__ */ jsx123("div", { className: cx40(styles["infoContainer"]), children: fields.map((field) => renderOrganizationField(field)) })
   ] });
   if (mode === "popup") {
-    return /* @__PURE__ */ jsx116(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs54(Dialog_default.Content, { children: [
-      /* @__PURE__ */ jsx116(Dialog_default.Heading, { children: title }),
-      /* @__PURE__ */ jsx116("div", { className: cx38(styles["popup"]), children: profileContent })
+    return /* @__PURE__ */ jsx123(Dialog_default, { open, onOpenChange, children: /* @__PURE__ */ jsxs56(Dialog_default.Content, { children: [
+      /* @__PURE__ */ jsx123(Dialog_default.Heading, { children: title }),
+      /* @__PURE__ */ jsx123("div", { className: cx40(styles["popup"]), children: profileContent })
     ] }) });
   }
   return profileContent;
@@ -17844,7 +18804,7 @@ var updateOrganization = async ({
 var updateOrganization_default = updateOrganization;
 
 // src/components/presentation/OrganizationProfile/OrganizationProfile.tsx
-import { jsx as jsx117 } from "react/jsx-runtime";
+import { jsx as jsx124 } from "react/jsx-runtime";
 var logger12 = createPackageComponentLogger10(
   "@asgardeo/react",
   "OrganizationProfile"
@@ -17863,7 +18823,7 @@ var OrganizationProfile = ({
 }) => {
   const { baseUrl, instanceId } = useAsgardeo_default();
   const { t } = useTranslation_default(preferences?.i18n);
-  const [organization, setOrganization] = useState37(null);
+  const [organization, setOrganization] = useState39(null);
   const fetchOrganization = async () => {
     if (!baseUrl || !organizationId) {
       return;
@@ -17880,7 +18840,7 @@ var OrganizationProfile = ({
       setOrganization(null);
     }
   };
-  useEffect25(() => {
+  useEffect27(() => {
     fetchOrganization();
   }, [baseUrl, organizationId]);
   const handleOrganizationUpdate = async (payload) => {
@@ -17902,7 +18862,7 @@ var OrganizationProfile = ({
       throw err;
     }
   };
-  return /* @__PURE__ */ jsx117(
+  return /* @__PURE__ */ jsx124(
     BaseOrganizationProfile_default,
     {
       organization,
@@ -17919,7 +18879,7 @@ var OrganizationProfile = ({
 var OrganizationProfile_default = OrganizationProfile;
 
 // src/components/presentation/OrganizationSwitcher/OrganizationSwitcher.tsx
-import { Fragment as Fragment25, jsx as jsx118, jsxs as jsxs55 } from "react/jsx-runtime";
+import { Fragment as Fragment25, jsx as jsx125, jsxs as jsxs57 } from "react/jsx-runtime";
 var OrganizationSwitcher = ({
   currentOrganization: propCurrentOrganization,
   fallback = null,
@@ -17936,15 +18896,15 @@ var OrganizationSwitcher = ({
     isLoading,
     error
   } = useOrganization_default();
-  const [isCreateOrgOpen, setIsCreateOrgOpen] = useState38(false);
-  const [isProfileOpen, setIsProfileOpen] = useState38(false);
-  const [isOrganizationListOpen, setIsOrganizationListOpen] = useState38(false);
+  const [isCreateOrgOpen, setIsCreateOrgOpen] = useState40(false);
+  const [isProfileOpen, setIsProfileOpen] = useState40(false);
+  const [isOrganizationListOpen, setIsOrganizationListOpen] = useState40(false);
   const { t } = useTranslation_default(preferences?.i18n);
   if (!isSignedIn && fallback) {
     return fallback;
   }
   if (!isSignedIn) {
-    return /* @__PURE__ */ jsx118(Fragment25, {});
+    return /* @__PURE__ */ jsx125(Fragment25, {});
   }
   const organizations = propOrganizations || contextOrganizations || [];
   const currentOrganization = propCurrentOrganization || contextCurrentOrganization;
@@ -17958,19 +18918,19 @@ var OrganizationSwitcher = ({
   const defaultMenuItems = [];
   if (currentOrganization) {
     defaultMenuItems.push({
-      icon: /* @__PURE__ */ jsx118(BuildingAlt_default, {}),
+      icon: /* @__PURE__ */ jsx125(BuildingAlt_default, {}),
       label: t("organization.switcher.manage.organizations"),
       onClick: handleManageOrganizations
     });
   }
   defaultMenuItems.push({
-    icon: /* @__PURE__ */ jsx118("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx118("path", { d: "M12 5v14m-7-7h14" }) }),
+    icon: /* @__PURE__ */ jsx125("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx125("path", { d: "M12 5v14m-7-7h14" }) }),
     label: t("organization.switcher.create.organization"),
     onClick: () => setIsCreateOrgOpen(true)
   });
   const menuItems = props.menuItems ? [...defaultMenuItems, ...props.menuItems] : defaultMenuItems;
-  return /* @__PURE__ */ jsxs55(Fragment25, { children: [
-    /* @__PURE__ */ jsx118(
+  return /* @__PURE__ */ jsxs57(Fragment25, { children: [
+    /* @__PURE__ */ jsx125(
       BaseOrganizationSwitcher,
       {
         organizations,
@@ -17984,7 +18944,7 @@ var OrganizationSwitcher = ({
         ...props
       }
     ),
-    /* @__PURE__ */ jsx118(
+    /* @__PURE__ */ jsx125(
       CreateOrganization,
       {
         mode: "popup",
@@ -17998,7 +18958,7 @@ var OrganizationSwitcher = ({
         }
       }
     ),
-    currentOrganization && /* @__PURE__ */ jsx118(
+    currentOrganization && /* @__PURE__ */ jsx125(
       OrganizationProfile_default,
       {
         organizationId: currentOrganization.id,
@@ -18006,11 +18966,11 @@ var OrganizationSwitcher = ({
         open: isProfileOpen,
         onOpenChange: setIsProfileOpen,
         cardLayout: true,
-        loadingFallback: /* @__PURE__ */ jsx118("div", { children: t("organization.profile.loading") }),
-        errorFallback: /* @__PURE__ */ jsx118("div", { children: t("organization.profile.error") })
+        loadingFallback: /* @__PURE__ */ jsx125("div", { children: t("organization.profile.loading") }),
+        errorFallback: /* @__PURE__ */ jsx125("div", { children: t("organization.profile.error") })
       }
     ),
-    /* @__PURE__ */ jsx118(
+    /* @__PURE__ */ jsx125(
       OrganizationList_default,
       {
         mode: "popup",
@@ -18030,7 +18990,7 @@ var OrganizationSwitcher = ({
 var OrganizationSwitcher_default = OrganizationSwitcher;
 
 // src/components/presentation/LanguageSwitcher/BaseLanguageSwitcher.tsx
-import { cx as cx39 } from "@emotion/css";
+import { cx as cx41 } from "@emotion/css";
 import {
   autoUpdate as autoUpdate3,
   flip as flip3,
@@ -18044,7 +19004,7 @@ import {
   useInteractions as useInteractions4,
   useRole as useRole4
 } from "@floating-ui/react";
-import { useEffect as useEffect26, useState as useState39 } from "react";
+import { useEffect as useEffect28, useState as useState41 } from "react";
 
 // src/components/presentation/LanguageSwitcher/BaseLanguageSwitcher.styles.ts
 import { css as css36 } from "@emotion/css";
@@ -18159,7 +19119,7 @@ var useStyles35 = (theme, colorScheme) => useMemo47(() => {
 var BaseLanguageSwitcher_styles_default = useStyles35;
 
 // src/components/presentation/LanguageSwitcher/BaseLanguageSwitcher.tsx
-import { Fragment as Fragment26, jsx as jsx119, jsxs as jsxs56 } from "react/jsx-runtime";
+import { Fragment as Fragment26, jsx as jsx126, jsxs as jsxs58 } from "react/jsx-runtime";
 var BaseLanguageSwitcher = ({
   children,
   className,
@@ -18170,9 +19130,9 @@ var BaseLanguageSwitcher = ({
 }) => {
   const { theme, colorScheme } = useTheme_default();
   const styles = BaseLanguageSwitcher_styles_default(theme, colorScheme);
-  const [isOpen, setIsOpen] = useState39(false);
+  const [isOpen, setIsOpen] = useState41(false);
   const hasMultipleLanguages = languages.length > 1;
-  useEffect26(() => {
+  useEffect28(() => {
     if (!hasMultipleLanguages && isOpen) {
       setIsOpen(false);
     }
@@ -18189,15 +19149,15 @@ var BaseLanguageSwitcher = ({
   const { getReferenceProps, getFloatingProps } = useInteractions4([click, dismiss, role]);
   const currentOption = languages.find((l) => l.code === currentLanguage);
   if (children) {
-    return /* @__PURE__ */ jsx119(Fragment26, { children: children({
+    return /* @__PURE__ */ jsx126(Fragment26, { children: children({
       currentLanguage,
       isLoading,
       languages,
       onLanguageChange
     }) });
   }
-  return /* @__PURE__ */ jsxs56("div", { className: cx39(styles["root"], className), children: [
-    /* @__PURE__ */ jsxs56(
+  return /* @__PURE__ */ jsxs58("div", { className: cx41(styles["root"], className), children: [
+    /* @__PURE__ */ jsxs58(
       "button",
       {
         ref: refs.setReference,
@@ -18207,13 +19167,13 @@ var BaseLanguageSwitcher = ({
         ...getReferenceProps(),
         className: styles["trigger"],
         children: [
-          currentOption && /* @__PURE__ */ jsx119("span", { className: styles["triggerEmoji"], children: currentOption.emoji }),
-          /* @__PURE__ */ jsx119("span", { className: styles["triggerLabel"], children: currentOption?.displayName ?? currentLanguage }),
-          hasMultipleLanguages && /* @__PURE__ */ jsx119(ChevronDown_default, {})
+          currentOption && /* @__PURE__ */ jsx126("span", { className: styles["triggerEmoji"], children: currentOption.emoji }),
+          /* @__PURE__ */ jsx126("span", { className: styles["triggerLabel"], children: currentOption?.displayName ?? currentLanguage }),
+          hasMultipleLanguages && /* @__PURE__ */ jsx126(ChevronDown_default, {})
         ]
       }
     ),
-    isOpen && hasMultipleLanguages && /* @__PURE__ */ jsx119(FloatingPortal4, { children: /* @__PURE__ */ jsx119(FloatingFocusManager4, { context, modal: false, children: /* @__PURE__ */ jsx119(
+    isOpen && hasMultipleLanguages && /* @__PURE__ */ jsx126(FloatingPortal4, { children: /* @__PURE__ */ jsx126(FloatingFocusManager4, { context, modal: false, children: /* @__PURE__ */ jsx126(
       "div",
       {
         ref: refs.setFloating,
@@ -18222,21 +19182,21 @@ var BaseLanguageSwitcher = ({
         className: styles["content"],
         role: "listbox",
         "aria-label": "Select language",
-        children: languages.map((lang) => /* @__PURE__ */ jsxs56(
+        children: languages.map((lang) => /* @__PURE__ */ jsxs58(
           "button",
           {
             type: "button",
             role: "option",
             "aria-selected": lang.code === currentLanguage,
-            className: cx39(styles["option"], lang.code === currentLanguage && styles["optionActive"]),
+            className: cx41(styles["option"], lang.code === currentLanguage && styles["optionActive"]),
             onClick: () => {
               onLanguageChange(lang.code);
               setIsOpen(false);
             },
             children: [
-              /* @__PURE__ */ jsx119("span", { className: styles["optionEmoji"], children: lang.emoji }),
-              /* @__PURE__ */ jsx119("span", { className: styles["optionLabel"], children: lang.displayName }),
-              lang.code === currentLanguage && /* @__PURE__ */ jsx119("span", { className: styles["checkIcon"], children: /* @__PURE__ */ jsx119(Check_default, {}) })
+              /* @__PURE__ */ jsx126("span", { className: styles["optionEmoji"], children: lang.emoji }),
+              /* @__PURE__ */ jsx126("span", { className: styles["optionLabel"], children: lang.displayName }),
+              lang.code === currentLanguage && /* @__PURE__ */ jsx126("span", { className: styles["checkIcon"], children: /* @__PURE__ */ jsx126(Check_default, {}) })
             ]
           },
           lang.code
@@ -18249,12 +19209,12 @@ var BaseLanguageSwitcher_default = BaseLanguageSwitcher;
 
 // src/components/presentation/LanguageSwitcher/LanguageSwitcher.tsx
 import { resolveLocaleDisplayName, resolveLocaleEmoji } from "@asgardeo/browser";
-import { useEffect as useEffect27, useMemo as useMemo48 } from "react";
+import { useEffect as useEffect29, useMemo as useMemo48 } from "react";
 
 // src/contexts/FlowMeta/useFlowMeta.ts
-import { useContext as useContext16 } from "react";
+import { useContext as useContext17 } from "react";
 var useFlowMeta = () => {
-  const context = useContext16(FlowMetaContext_default);
+  const context = useContext17(FlowMetaContext_default);
   if (!context) {
     throw new Error("useFlowMeta must be used within a FlowMetaProvider");
   }
@@ -18263,7 +19223,7 @@ var useFlowMeta = () => {
 var useFlowMeta_default = useFlowMeta;
 
 // src/components/presentation/LanguageSwitcher/LanguageSwitcher.tsx
-import { jsx as jsx120 } from "react/jsx-runtime";
+import { jsx as jsx127 } from "react/jsx-runtime";
 var LanguageSwitcher = ({ children, className }) => {
   const { meta, switchLanguage, isLoading } = useFlowMeta_default();
   const { currentLanguage } = useTranslation_default();
@@ -18281,7 +19241,7 @@ var LanguageSwitcher = ({ children, className }) => {
     })),
     [effectiveLanguageCodes]
   );
-  useEffect27(() => {
+  useEffect29(() => {
     if (availableLanguageCodes.length > 0 && !availableLanguageCodes.includes(currentLanguage)) {
       switchLanguage(availableLanguageCodes[0]);
     }
@@ -18291,7 +19251,7 @@ var LanguageSwitcher = ({ children, className }) => {
       switchLanguage(language);
     }
   };
-  return /* @__PURE__ */ jsx120(
+  return /* @__PURE__ */ jsx127(
     BaseLanguageSwitcher_default,
     {
       currentLanguage,
@@ -18325,7 +19285,9 @@ import {
   EmbeddedFlowTextVariantV2,
   EmbeddedFlowEventTypeV2,
   EmbeddedSignInFlowStatusV2 as EmbeddedSignInFlowStatusV23,
-  EmbeddedSignInFlowTypeV2 as EmbeddedSignInFlowTypeV22
+  EmbeddedSignInFlowTypeV2 as EmbeddedSignInFlowTypeV22,
+  EmbeddedRecoveryFlowStatusV2,
+  EmbeddedRecoveryFlowTypeV2
 } from "@asgardeo/browser";
 export {
   AcceptInvite_default as AcceptInvite,
@@ -18341,6 +19303,7 @@ export {
   BaseOrganizationList_default as BaseOrganizationList,
   BaseOrganizationProfile_default as BaseOrganizationProfile,
   BaseOrganizationSwitcher_default as BaseOrganizationSwitcher,
+  BaseRecovery_default3 as BaseRecovery,
   BaseSignIn_default3 as BaseSignIn,
   BaseSignInButton_default as BaseSignInButton,
   BaseSignOutButton_default as BaseSignOutButton,
@@ -18369,6 +19332,8 @@ export {
   EmbeddedFlowComponentTypeV2 as EmbeddedFlowComponentType,
   EmbeddedFlowEventTypeV2 as EmbeddedFlowEventType,
   EmbeddedFlowTextVariantV2 as EmbeddedFlowTextVariant,
+  EmbeddedRecoveryFlowStatusV2 as EmbeddedRecoveryFlowStatus,
+  EmbeddedRecoveryFlowTypeV2 as EmbeddedRecoveryFlowType,
   EmbeddedSignInFlowStatusV23 as EmbeddedSignInFlowStatus,
   EmbeddedSignInFlowTypeV22 as EmbeddedSignInFlowType,
   Eye_default as Eye,
@@ -18405,6 +19370,7 @@ export {
   OrganizationUnitPicker_default as OrganizationUnitPicker,
   OtpField_default as OtpField,
   PasswordField_default as PasswordField,
+  Recovery_default3 as Recovery,
   Select_default as Select,
   SignIn_default2 as SignIn,
   SignInButton_default as SignInButton,