@asgardeo/vue 0.3.10 → 0.4.0

package/dist/cjs/index.js

@@ -37,7 +37,7 @@ __export(index_exports, {
   ArrowLeftRightIcon: () => ArrowLeftRightIcon,
   AsgardeoPlugin: () => AsgardeoPlugin_default,
   AsgardeoProvider: () => AsgardeoProvider_default,
-  AsgardeoRuntimeError: () => import_browser77.AsgardeoRuntimeError,
+  AsgardeoRuntimeError: () => import_browser79.AsgardeoRuntimeError,
   AsgardeoVueClient: () => AsgardeoVueClient_default,
   BRANDING_KEY: () => BRANDING_KEY,
   BaseAcceptInvite: () => BaseAcceptInvite_default,
@@ -67,19 +67,19 @@ __export(index_exports, {
   CreateOrganization: () => CreateOrganization_default,
   DatePicker: () => DatePicker_default,
   Divider: () => Divider_default,
-  EmbeddedFlowActionVariant: () => import_browser77.EmbeddedFlowActionVariantV2,
-  EmbeddedFlowComponentType: () => import_browser77.EmbeddedFlowComponentTypeV2,
-  EmbeddedFlowEventType: () => import_browser77.EmbeddedFlowEventTypeV2,
-  EmbeddedFlowTextVariant: () => import_browser77.EmbeddedFlowTextVariantV2,
-  EmbeddedSignInFlowStatus: () => import_browser77.EmbeddedSignInFlowStatusV2,
-  EmbeddedSignInFlowType: () => import_browser77.EmbeddedSignInFlowTypeV2,
+  EmbeddedFlowActionVariant: () => import_browser79.EmbeddedFlowActionVariantV2,
+  EmbeddedFlowComponentType: () => import_browser79.EmbeddedFlowComponentTypeV2,
+  EmbeddedFlowEventType: () => import_browser79.EmbeddedFlowEventTypeV2,
+  EmbeddedFlowTextVariant: () => import_browser79.EmbeddedFlowTextVariantV2,
+  EmbeddedSignInFlowStatus: () => import_browser79.EmbeddedSignInFlowStatusV2,
+  EmbeddedSignInFlowType: () => import_browser79.EmbeddedSignInFlowTypeV2,
   EyeIcon: () => EyeIcon,
   EyeOffIcon: () => EyeOffIcon,
   FLOW_KEY: () => FLOW_KEY,
   FLOW_META_KEY: () => FLOW_META_KEY,
   FacebookButton: () => FacebookButton_default,
   FieldFactory: () => FieldFactory_default,
-  FieldType: () => import_browser76.FieldType,
+  FieldType: () => import_browser78.FieldType,
   FlowMetaProvider: () => FlowMetaProvider_default,
   FlowProvider: () => FlowProvider_default,
   GitHubButton: () => GitHubButton_default,
@@ -95,7 +95,7 @@ __export(index_exports, {
   Logo: () => Logo_default,
   MicrosoftButton: () => MicrosoftButton_default,
   ORGANIZATION_KEY: () => ORGANIZATION_KEY,
-  OrganizationComponent: () => Organization_default,
+  Organization: () => Organization_default,
   OrganizationList: () => OrganizationList_default,
   OrganizationProfile: () => OrganizationProfile_default,
   OrganizationProvider: () => OrganizationProvider_default,
@@ -119,7 +119,7 @@ __export(index_exports, {
   TriangleAlertIcon: () => TriangleAlertIcon,
   Typography: () => Typography_default,
   USER_KEY: () => USER_KEY,
-  UserComponent: () => User_default,
+  User: () => User_default,
   UserDropdown: () => UserDropdown_default,
   UserIcon: () => UserIcon,
   UserProfile: () => UserProfile_default,
@@ -128,17 +128,17 @@ __export(index_exports, {
   buildThemeConfigFromFlowMeta: () => buildThemeConfigFromFlowMeta_default,
   createAsgardeoGuard: () => createAsgardeoGuard,
   createCallbackRoute: () => createCallbackRoute,
-  createClassObserver: () => import_browser75.createClassObserver,
+  createClassObserver: () => import_browser77.createClassObserver,
   createField: () => createField,
-  createMediaQueryListener: () => import_browser75.createMediaQueryListener,
-  detectThemeMode: () => import_browser75.detectThemeMode,
-  getActiveTheme: () => import_browser74.getActiveTheme,
+  createMediaQueryListener: () => import_browser77.createMediaQueryListener,
+  detectThemeMode: () => import_browser77.detectThemeMode,
+  getActiveTheme: () => import_browser76.getActiveTheme,
   getAuthComponentHeadings: () => getAuthComponentHeadings_default,
-  handleWebAuthnAuthentication: () => import_browser70.handleWebAuthnAuthentication,
-  hasAuthParamsInUrl: () => import_browser71.hasAuthParamsInUrl,
-  http: () => import_browser73.http,
+  handleWebAuthnAuthentication: () => import_browser72.handleWebAuthnAuthentication,
+  hasAuthParamsInUrl: () => import_browser73.hasAuthParamsInUrl,
+  http: () => import_browser75.http,
   initiateOAuthRedirect: () => initiateOAuthRedirect,
-  navigate: () => import_browser72.navigate,
+  navigate: () => import_browser74.navigate,
   useAsgardeo: () => useAsgardeo_default,
   useBranding: () => useBranding_default,
   useFlow: () => useFlow_default,
@@ -924,17 +924,13 @@ var import_vue7 = require("vue");
 var UserProvider = (0, import_vue7.defineComponent)({
   name: "UserProvider",
   props: {
-    /** The flattened profile (top-level attribute map). */
-    flattenedProfile: { default: null, type: Object },
-    /** Optional callback run after the profile is updated locally. */
+    /** Callback to sync a successfully-saved profile back up to AsgardeoProvider. */
     onUpdateProfile: { default: void 0, type: Function },
     /** The full user profile data (nested + flat + schemas). */
     profile: { default: null, type: Object },
     /** Re-fetch the user profile from the server. */
     revalidateProfile: { default: async () => {
     }, type: Function },
-    /** The SCIM2 schemas describing user profile attributes. */
-    schemas: { default: null, type: Array },
     /** Update the user profile via SCIM2 PATCH. */
     updateProfile: {
       default: void 0,
@@ -942,11 +938,13 @@ var UserProvider = (0, import_vue7.defineComponent)({
     }
   },
   setup(props, { slots }) {
-    const flattenedProfileRef = (0, import_vue7.computed)(() => props.flattenedProfile);
     const profileRef = (0, import_vue7.computed)(() => props.profile);
-    const schemasRef = (0, import_vue7.computed)(() => props.schemas);
+    const flattenedProfileRef = (0, import_vue7.computed)(() => props.profile?.flattenedProfile ?? null);
+    const schemasRef = (0, import_vue7.computed)(() => props.profile?.schemas ?? null);
     const context = {
       flattenedProfile: flattenedProfileRef,
+      onUpdateProfile: props.onUpdateProfile ?? (() => {
+      }),
       profile: profileRef,
       revalidateProfile: props.revalidateProfile,
       schemas: schemasRef,
@@ -1662,8 +1660,6 @@ var AsgardeoProvider = (0, import_vue8.defineComponent)({
     const currentOrganization = (0, import_vue8.shallowRef)(null);
     const myOrganizations = (0, import_vue8.shallowRef)([]);
     const userProfile = (0, import_vue8.shallowRef)(null);
-    const flattenedProfile = (0, import_vue8.shallowRef)(null);
-    const schemas = (0, import_vue8.shallowRef)([]);
     const resolvedBaseUrl = (0, import_vue8.ref)(props.baseUrl);
     let isUpdatingSession = false;
     let signInCheckInterval;
@@ -1700,6 +1696,12 @@ var AsgardeoProvider = (0, import_vue8.defineComponent)({
         if (config.platform === import_browser13.Platform.AsgardeoV2) {
           const claims = (0, import_browser13.extractUserClaimsFromIdToken)(decodedToken);
           user.value = claims;
+          const profileData = {
+            flattenedProfile: claims,
+            profile: claims,
+            schemas: []
+          };
+          userProfile.value = profileData;
         } else {
           try {
             const fetchedUser = await asgardeo.getUser({ baseUrl });
@@ -1719,8 +1721,6 @@ var AsgardeoProvider = (0, import_vue8.defineComponent)({
           try {
             const profileData = await asgardeo.getUserProfile({ baseUrl });
             userProfile.value = profileData;
-            flattenedProfile.value = profileData.flattenedProfile || null;
-            schemas.value = profileData.schemas || [];
           } catch {
           }
         }
@@ -1940,19 +1940,42 @@ var AsgardeoProvider = (0, import_vue8.defineComponent)({
                 default: () => (0, import_vue8.h)(
                   UserProvider_default,
                   {
-                    flattenedProfile: flattenedProfile.value,
+                    onUpdateProfile: (updatedUser) => {
+                      user.value = updatedUser;
+                      userProfile.value = {
+                        flattenedProfile: (0, import_browser13.generateFlattenedUserProfile)(
+                          updatedUser,
+                          userProfile.value?.schemas
+                        ),
+                        profile: updatedUser,
+                        schemas: userProfile.value?.schemas ?? []
+                      };
+                    },
                     profile: userProfile.value,
                     revalidateProfile: async () => {
-                      const baseUrl = resolvedBaseUrl.value;
+                      const revalConfig = buildConfig();
+                      if (revalConfig.platform === import_browser13.Platform.AsgardeoV2) {
+                        try {
+                          const decodedToken = await asgardeo.getDecodedIdToken();
+                          const claims = (0, import_browser13.extractUserClaimsFromIdToken)(decodedToken);
+                          user.value = claims;
+                          userProfile.value = {
+                            flattenedProfile: claims,
+                            profile: claims,
+                            schemas: []
+                          };
+                        } catch {
+                        }
+                        return;
+                      }
                       try {
-                        const profileData = await asgardeo.getUserProfile({ baseUrl });
+                        const profileData = await asgardeo.getUserProfile({
+                          baseUrl: resolvedBaseUrl.value
+                        });
                         userProfile.value = profileData;
-                        flattenedProfile.value = profileData.flattenedProfile || null;
-                        schemas.value = profileData.schemas || [];
                       } catch {
                       }
-                    },
-                    schemas: schemas.value
+                    }
                   },
                   {
                     default: () => (0, import_vue8.h)(
@@ -2699,68 +2722,90 @@ var USER_DROPDOWN_CSS = `
   font-family: var(--asgardeo-typography-fontFamily);
 }
 
-/* Trigger ---------------------------------------------------- */
+/* \u2500\u2500 Trigger \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-dropdown__trigger {
   display: inline-flex;
   align-items: center;
-  gap: calc(var(--asgardeo-spacing-unit) * 0.75);
-  padding: calc(var(--asgardeo-spacing-unit) * 0.5) calc(var(--asgardeo-spacing-unit) * 1)
-    calc(var(--asgardeo-spacing-unit) * 0.5) calc(var(--asgardeo-spacing-unit) * 0.5);
+  gap: calc(var(--asgardeo-spacing-unit) * 0.5);
+  padding: 3px;
   background: none;
-  border: 1px solid var(--asgardeo-color-border);
-  border-radius: 9999px;
+  border: 2px solid transparent;
+  border-radius: var(--asgardeo-border-radius-full);
   cursor: pointer;
   color: var(--asgardeo-color-text-primary);
-  font-family: var(--asgardeo-typography-fontFamily);
-  font-size: var(--asgardeo-typography-fontSize-md);
   transition:
-    background-color var(--asgardeo-transition-fast),
     border-color var(--asgardeo-transition-fast),
     box-shadow var(--asgardeo-transition-fast);
   box-sizing: border-box;
+  outline: none;
 }
 
 .asgardeo-user-dropdown__trigger:hover {
-  background-color: var(--asgardeo-color-action-hover);
   border-color: var(--asgardeo-color-primary-main);
 }
 
+.asgardeo-user-dropdown__trigger--open {
+  border-color: var(--asgardeo-color-primary-main);
+  box-shadow: 0 0 0 3px var(--asgardeo-focus-ring-color);
+}
+
 .asgardeo-user-dropdown__trigger:focus-visible {
-  outline: none;
+  border-color: var(--asgardeo-color-primary-main);
   box-shadow: 0 0 0 var(--asgardeo-focus-ring-width) var(--asgardeo-focus-ring-color);
 }
 
-/* Avatar ---------------------------------------------------- */
+/* \u2500\u2500 Trigger avatar \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-dropdown__avatar {
   display: flex;
   align-items: center;
   justify-content: center;
-  width: calc(var(--asgardeo-spacing-unit) * 3);
-  height: calc(var(--asgardeo-spacing-unit) * 3);
+  width: 32px;
+  height: 32px;
   border-radius: 50%;
-  background-color: var(--asgardeo-color-primary-main);
-  color: var(--asgardeo-color-primary-contrastText);
+  color: #ffffff;
   flex-shrink: 0;
   font-size: var(--asgardeo-typography-fontSize-sm);
-  font-weight: var(--asgardeo-typography-fontWeight-medium);
+  font-weight: var(--asgardeo-typography-fontWeight-semibold);
+  line-height: 1;
+  user-select: none;
+  pointer-events: none;
+}
+
+/* sm \u2014 28 px */
+.asgardeo-user-dropdown__avatar--sm {
+  width: 28px;
+  height: 28px;
+  font-size: var(--asgardeo-typography-fontSize-xs);
 }
 
-/* Name ------------------------------------------------------ */
+/* lg \u2014 38 px */
+.asgardeo-user-dropdown__avatar--lg {
+  width: 38px;
+  height: 38px;
+  font-size: var(--asgardeo-typography-fontSize-md);
+}
 
-.asgardeo-user-dropdown__name {
-  max-width: 140px;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
+/* \u2500\u2500 Chevron \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+
+.asgardeo-user-dropdown__chevron {
+  display: inline-flex;
+  align-items: center;
+  color: var(--asgardeo-color-text-secondary);
+  transition: transform var(--asgardeo-transition-normal);
+  padding-right: calc(var(--asgardeo-spacing-unit) * 0.25);
+}
+
+.asgardeo-user-dropdown__trigger--open .asgardeo-user-dropdown__chevron {
+  transform: rotate(180deg);
 }
 
-/* Dropdown menu --------------------------------------------- */
+/* \u2500\u2500 Dropdown menu \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-dropdown__menu {
   position: absolute;
-  top: calc(100% + calc(var(--asgardeo-spacing-unit) * 0.5));
+  top: calc(100% + calc(var(--asgardeo-spacing-unit) * 0.75));
   right: 0;
   z-index: 1000;
   background-color: var(--asgardeo-color-background-surface);
@@ -2768,20 +2813,141 @@ var USER_DROPDOWN_CSS = `
   border-radius: var(--asgardeo-dropdown-borderRadius);
   box-shadow: var(--asgardeo-dropdown-shadow);
   overflow: hidden;
-  min-width: 160px;
+  min-width: 220px;
   display: flex;
   flex-direction: column;
-  padding: calc(var(--asgardeo-spacing-unit) * 0.5) 0;
+  animation: asgardeo-dropdown-enter var(--asgardeo-transition-fast) ease;
+}
+
+/* Alignment */
+
+.asgardeo-user-dropdown__menu--align-left {
+  right: auto;
+  left: 0;
+}
+
+/* Size: sm */
+
+.asgardeo-user-dropdown__menu--size-sm {
+  min-width: 180px;
+}
+
+.asgardeo-user-dropdown__menu--size-sm .asgardeo-user-dropdown__menu-header {
+  padding: calc(var(--asgardeo-spacing-unit) * 1.25) calc(var(--asgardeo-spacing-unit) * 1.5);
+  gap: calc(var(--asgardeo-spacing-unit) * 1);
+}
+
+.asgardeo-user-dropdown__menu--size-sm .asgardeo-user-dropdown__menu-header-avatar {
+  width: 30px;
+  height: 30px;
+  font-size: var(--asgardeo-typography-fontSize-sm);
+}
+
+.asgardeo-user-dropdown__menu--size-sm .asgardeo-user-dropdown__item {
+  padding: calc(var(--asgardeo-spacing-unit) * 0.75) calc(var(--asgardeo-spacing-unit) * 1.5);
+  font-size: var(--asgardeo-typography-fontSize-xs);
+}
+
+/* Size: lg */
+
+.asgardeo-user-dropdown__menu--size-lg {
+  min-width: 280px;
+}
+
+.asgardeo-user-dropdown__menu--size-lg .asgardeo-user-dropdown__menu-header {
+  padding: calc(var(--asgardeo-spacing-unit) * 2) calc(var(--asgardeo-spacing-unit) * 2);
+  gap: calc(var(--asgardeo-spacing-unit) * 1.5);
+}
+
+.asgardeo-user-dropdown__menu--size-lg .asgardeo-user-dropdown__menu-header-avatar {
+  width: 42px;
+  height: 42px;
+  font-size: var(--asgardeo-typography-fontSize-lg);
+}
+
+.asgardeo-user-dropdown__menu--size-lg .asgardeo-user-dropdown__item {
+  padding: calc(var(--asgardeo-spacing-unit) * 1.25) calc(var(--asgardeo-spacing-unit) * 2);
+  font-size: var(--asgardeo-typography-fontSize-md);
+}
+
+@keyframes asgardeo-dropdown-enter {
+  from {
+    opacity: 0;
+    transform: translateY(-6px) scale(0.97);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0) scale(1);
+  }
+}
+
+/* \u2500\u2500 Menu header (user identity) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+
+.asgardeo-user-dropdown__menu-header {
+  display: flex;
+  align-items: center;
+  gap: calc(var(--asgardeo-spacing-unit) * 1.25);
+  padding: calc(var(--asgardeo-spacing-unit) * 1.5) calc(var(--asgardeo-spacing-unit) * 1.75);
+}
+
+.asgardeo-user-dropdown__menu-header-avatar {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 36px;
+  height: 36px;
+  border-radius: 50%;
+  color: #ffffff;
+  flex-shrink: 0;
+  font-size: var(--asgardeo-typography-fontSize-md);
+  font-weight: var(--asgardeo-typography-fontWeight-semibold);
+  line-height: 1;
+  user-select: none;
+}
+
+.asgardeo-user-dropdown__menu-header-info {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  min-width: 0;
+}
+
+.asgardeo-user-dropdown__menu-header-name {
+  font-size: var(--asgardeo-typography-fontSize-sm);
+  font-weight: var(--asgardeo-typography-fontWeight-semibold);
+  color: var(--asgardeo-color-text-primary);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  line-height: var(--asgardeo-typography-lineHeight-tight);
+}
+
+.asgardeo-user-dropdown__menu-header-subtitle {
+  font-size: var(--asgardeo-typography-fontSize-xs);
+  color: var(--asgardeo-color-text-secondary);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  line-height: var(--asgardeo-typography-lineHeight-normal);
+}
+
+/* \u2500\u2500 Menu divider \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+
+.asgardeo-user-dropdown__menu-divider {
+  height: 1px;
+  background-color: var(--asgardeo-color-border);
+  margin: calc(var(--asgardeo-spacing-unit) * 0.5) 0;
+  flex-shrink: 0;
 }
 
-/* Menu items ------------------------------------------------ */
+/* \u2500\u2500 Menu items \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-dropdown__item {
   display: flex;
   align-items: center;
-  gap: calc(var(--asgardeo-spacing-unit) * 0.75);
+  gap: calc(var(--asgardeo-spacing-unit) * 1);
   width: 100%;
-  padding: var(--asgardeo-dropdown-itemPaddingY) var(--asgardeo-dropdown-itemPaddingX);
+  padding: calc(var(--asgardeo-spacing-unit) * 1) calc(var(--asgardeo-spacing-unit) * 1.75);
   background: none;
   border: none;
   cursor: pointer;
@@ -2802,36 +2968,61 @@ var USER_DROPDOWN_CSS = `
   background-color: var(--asgardeo-color-action-focus);
 }
 
-/* Modal overlay ------------------------------------------------ */
+/* Danger variant (sign-out) */
+
+.asgardeo-user-dropdown__item--danger {
+  color: var(--asgardeo-color-error-main);
+}
+
+.asgardeo-user-dropdown__item--danger:hover {
+  background-color: var(--asgardeo-color-error-light);
+}
+
+/* \u2500\u2500 Modal overlay \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-dropdown__modal-overlay {
   position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-color: rgba(0, 0, 0, 0.4);
+  inset: 0;
+  background-color: rgba(0, 0, 0, 0.45);
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 9999;
-  backdrop-filter: blur(2px);
+  backdrop-filter: blur(3px);
+  animation: asgardeo-overlay-enter var(--asgardeo-transition-fast) ease;
+}
+
+@keyframes asgardeo-overlay-enter {
+  from { opacity: 0; }
+  to   { opacity: 1; }
 }
 
-/* Modal content ------------------------------------------------ */
+/* \u2500\u2500 Modal content \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-dropdown__modal-content {
   background: var(--asgardeo-color-background-surface);
-  border-radius: var(--asgardeo-border-radius-medium);
+  border-radius: var(--asgardeo-border-radius-large);
   box-shadow: var(--asgardeo-shadow-large);
-  max-width: 460px;
-  width: 90%;
+  max-width: 480px;
+  width: 92%;
   max-height: 90vh;
   overflow-y: auto;
   position: relative;
+  animation: asgardeo-modal-enter var(--asgardeo-transition-normal) ease;
+}
+
+@keyframes asgardeo-modal-enter {
+  from {
+    opacity: 0;
+    transform: translateY(12px) scale(0.97);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0) scale(1);
+  }
 }
 
-/* Modal close button ------------------------------------------ */
+/* \u2500\u2500 Modal close button \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-dropdown__modal-close {
   position: absolute;
@@ -2844,7 +3035,7 @@ var USER_DROPDOWN_CSS = `
   display: flex;
   align-items: center;
   justify-content: center;
-  padding: calc(var(--asgardeo-spacing-unit) * 0.5);
+  padding: calc(var(--asgardeo-spacing-unit) * 0.625);
   border-radius: var(--asgardeo-border-radius-small);
   z-index: 10001;
   transition:
@@ -2868,74 +3059,154 @@ var UserDropdown_css_default = USER_DROPDOWN_CSS;
 // src/components/presentation/user-profile/UserProfile.css.ts
 var USER_PROFILE_CSS = `
 /* ============================================================
-   UserProfile
+   UserProfile  (modern redesign)
    ============================================================ */
 
 .asgardeo-user-profile {
   display: flex;
   flex-direction: column;
   min-width: 320px;
-  padding: 0;
   overflow: hidden;
+  font-family: var(--asgardeo-typography-fontFamily);
 }
 
-/* Header ---------------------------------------------------- */
+/* \u2500\u2500 Header \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-profile__header {
-  padding: calc(var(--asgardeo-spacing-unit) * 2) calc(var(--asgardeo-spacing-unit) * 2.5);
-  padding-bottom: calc(var(--asgardeo-spacing-unit) * 1.5);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: calc(var(--asgardeo-spacing-unit) * 2) calc(var(--asgardeo-spacing-unit) * 2.5)
+    calc(var(--asgardeo-spacing-unit) * 1.75);
 }
 
 .asgardeo-user-profile__title {
   margin: 0;
+  font-size: var(--asgardeo-typography-fontSize-md);
+  font-weight: var(--asgardeo-typography-fontWeight-semibold);
+  color: var(--asgardeo-color-text-primary);
+  letter-spacing: var(--asgardeo-typography-letterSpacing-tight);
 }
 
 .asgardeo-user-profile__header-divider {
   margin: 0;
 }
 
-/* Avatar ---------------------------------------------------- */
+/* \u2500\u2500 Hero (avatar + name + subtitle) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
-.asgardeo-user-profile__avatar-section {
+.asgardeo-user-profile__hero {
   display: flex;
-  justify-content: center;
-  padding: calc(var(--asgardeo-spacing-unit) * 2) 0 calc(var(--asgardeo-spacing-unit) * 1.25);
+  flex-direction: column;
+  align-items: center;
+  padding: calc(var(--asgardeo-spacing-unit) * 3) calc(var(--asgardeo-spacing-unit) * 2.5)
+    calc(var(--asgardeo-spacing-unit) * 2);
+  gap: calc(var(--asgardeo-spacing-unit) * 1.25);
+  background: linear-gradient(
+    180deg,
+    var(--asgardeo-color-primary-light) 0%,
+    var(--asgardeo-color-background-surface) 100%
+  );
+  border-bottom: 1px solid var(--asgardeo-color-border);
+}
+
+.asgardeo-user-profile__avatar-wrapper {
+  position: relative;
+  border-radius: 50%;
+  padding: 3px;
+  background: linear-gradient(
+    135deg,
+    var(--asgardeo-color-primary-main),
+    var(--asgardeo-color-primary-dark)
+  );
+  box-shadow: 0 4px 14px rgba(75, 110, 245, 0.28);
 }
 
 .asgardeo-user-profile__avatar {
-  width: var(--asgardeo-avatar-size);
-  height: var(--asgardeo-avatar-size);
+  width: var(--asgardeo-avatar-size, 72px);
+  height: var(--asgardeo-avatar-size, 72px);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
+  border: 2px solid var(--asgardeo-color-background-surface);
+}
+
+/* Avatar size variants */
+
+.asgardeo-user-profile__avatar--sm {
+  width: 48px;
+  height: 48px;
+}
+
+.asgardeo-user-profile__avatar--sm .asgardeo-user-profile__avatar-initials {
+  font-size: 1rem;
+}
+
+.asgardeo-user-profile__avatar--md {
+  width: 64px;
+  height: 64px;
+}
+
+.asgardeo-user-profile__avatar--md .asgardeo-user-profile__avatar-initials {
+  font-size: 1.25rem;
+}
+
+.asgardeo-user-profile__avatar--lg {
+  width: 80px;
+  height: 80px;
+}
+
+.asgardeo-user-profile__avatar--lg .asgardeo-user-profile__avatar-initials {
+  font-size: 1.625rem;
 }
 
 .asgardeo-user-profile__avatar-initials {
   color: #ffffff;
-  font-size: var(--asgardeo-avatar-fontSize);
-  font-weight: 600;
+  font-weight: var(--asgardeo-typography-fontWeight-semibold);
   line-height: 1;
   letter-spacing: 0.02em;
   pointer-events: none;
   user-select: none;
 }
 
-/* Alerts & loading ------------------------------------------ */
+.asgardeo-user-profile__hero-info {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: calc(var(--asgardeo-spacing-unit) * 0.375);
+  text-align: center;
+}
+
+.asgardeo-user-profile__hero-name {
+  font-size: var(--asgardeo-typography-fontSize-lg);
+  font-weight: var(--asgardeo-typography-fontWeight-semibold);
+  color: var(--asgardeo-color-text-primary);
+  line-height: var(--asgardeo-typography-lineHeight-tight);
+  letter-spacing: var(--asgardeo-typography-letterSpacing-tight);
+}
+
+.asgardeo-user-profile__hero-subtitle {
+  font-size: var(--asgardeo-typography-fontSize-sm);
+  color: var(--asgardeo-color-text-secondary);
+  line-height: var(--asgardeo-typography-lineHeight-normal);
+}
+
+/* \u2500\u2500 Alerts & loading \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-profile__error {
-  margin: 0 calc(var(--asgardeo-spacing-unit) * 2.5) calc(var(--asgardeo-spacing-unit) * 1.25);
+  margin: calc(var(--asgardeo-spacing-unit) * 1.5) calc(var(--asgardeo-spacing-unit) * 2.5)
+    calc(var(--asgardeo-spacing-unit) * 0.5);
 }
 
 .asgardeo-user-profile__loading {
   display: flex;
   align-items: center;
   justify-content: center;
-  padding: calc(var(--asgardeo-spacing-unit) * 3) 0;
+  padding: calc(var(--asgardeo-spacing-unit) * 3.5) 0;
 }
 
-/* Fields ---------------------------------------------------- */
+/* \u2500\u2500 Fields \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-profile__fields {
   display: flex;
@@ -2944,9 +3215,9 @@ var USER_PROFILE_CSS = `
 
 .asgardeo-user-profile__field {
   display: grid;
-  grid-template-columns: 36% 64%;
-  align-items: center;
-  padding: calc(var(--asgardeo-spacing-unit) * 1.25) calc(var(--asgardeo-spacing-unit) * 2.5);
+  grid-template-columns: 38% 62%;
+  align-items: start;
+  padding: calc(var(--asgardeo-spacing-unit) * 1.5) calc(var(--asgardeo-spacing-unit) * 2.5);
   gap: calc(var(--asgardeo-spacing-unit) * 0.75);
   box-sizing: border-box;
   transition: background-color var(--asgardeo-transition-fast);
@@ -2960,17 +3231,11 @@ var USER_PROFILE_CSS = `
   border-top: 1px solid var(--asgardeo-color-border);
 }
 
-.asgardeo-user-profile__field-label-col {
-  /* label column */
-}
-
 .asgardeo-user-profile__field-label {
   color: var(--asgardeo-color-text-secondary);
   font-size: var(--asgardeo-typography-fontSize-sm);
-}
-
-.asgardeo-user-profile__field-value-col {
-  /* value column */
+  font-weight: var(--asgardeo-typography-fontWeight-medium);
+  padding-top: 2px;
 }
 
 .asgardeo-user-profile__field-display {
@@ -2990,16 +3255,22 @@ var USER_PROFILE_CSS = `
 
 .asgardeo-user-profile__field-placeholder {
   color: var(--asgardeo-color-primary-main);
-  font-style: italic;
   font-size: var(--asgardeo-typography-fontSize-sm);
+  font-style: italic;
   flex: 1;
   cursor: pointer;
   text-decoration: underline;
   text-decoration-style: dotted;
   text-underline-offset: 2px;
+  opacity: 0.8;
+  transition: opacity var(--asgardeo-transition-fast);
 }
 
-/* Edit button (pencil icon) --------------------------------- */
+.asgardeo-user-profile__field-placeholder:hover {
+  opacity: 1;
+}
+
+/* \u2500\u2500 Edit button (pencil) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-profile__field-edit-btn {
   display: inline-flex;
@@ -3035,12 +3306,13 @@ var USER_PROFILE_CSS = `
   box-shadow: 0 0 0 var(--asgardeo-focus-ring-width) var(--asgardeo-focus-ring-color);
 }
 
-/* Edit mode ------------------------------------------------- */
+/* \u2500\u2500 Edit mode \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-profile__field-edit {
   display: flex;
   flex-direction: column;
   gap: calc(var(--asgardeo-spacing-unit) * 0.75);
+  padding: calc(var(--asgardeo-spacing-unit) * 0.25) 0;
 }
 
 .asgardeo-user-profile__field-edit-actions {
@@ -3049,12 +3321,35 @@ var USER_PROFILE_CSS = `
   gap: calc(var(--asgardeo-spacing-unit) * 0.75);
 }
 
-/* Footer slot ----------------------------------------------- */
+/* \u2500\u2500 Footer slot \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
 
 .asgardeo-user-profile__footer {
   padding: calc(var(--asgardeo-spacing-unit) * 1.5) calc(var(--asgardeo-spacing-unit) * 2.5);
   border-top: 1px solid var(--asgardeo-color-border);
 }
+
+/* \u2500\u2500 Compact modifier \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
+
+.asgardeo-user-profile--compact .asgardeo-user-profile__hero {
+  padding: calc(var(--asgardeo-spacing-unit) * 2) calc(var(--asgardeo-spacing-unit) * 2);
+}
+
+.asgardeo-user-profile--compact .asgardeo-user-profile__avatar--lg {
+  width: 56px;
+  height: 56px;
+}
+
+.asgardeo-user-profile--compact .asgardeo-user-profile__avatar--lg .asgardeo-user-profile__avatar-initials {
+  font-size: 1.125rem;
+}
+
+.asgardeo-user-profile--compact .asgardeo-user-profile__field {
+  padding: calc(var(--asgardeo-spacing-unit) * 1) calc(var(--asgardeo-spacing-unit) * 2);
+}
+
+.asgardeo-user-profile--compact .asgardeo-user-profile__hero-name {
+  font-size: var(--asgardeo-typography-fontSize-md);
+}
 `;
 var UserProfile_css_default = USER_PROFILE_CSS;
 
@@ -5617,114 +5912,24 @@ var Callback = (0, import_vue39.defineComponent)({
 });
 var Callback_default = Callback;
 
-// src/components/control/SignedIn.ts
-var import_vue40 = require("vue");
-var SignedIn = (0, import_vue40.defineComponent)({
-  name: "SignedIn",
-  setup(_props, { slots }) {
-    const { isSignedIn } = useAsgardeo_default();
-    return () => {
-      if (!isSignedIn.value) {
-        const fallbackContent = slots["fallback"]?.();
-        return fallbackContent ? (0, import_vue40.h)(import_vue40.Fragment, {}, fallbackContent) : null;
-      }
-      const defaultContent = slots["default"]?.();
-      return defaultContent ? (0, import_vue40.h)(import_vue40.Fragment, {}, defaultContent) : null;
-    };
-  }
-});
-var SignedIn_default = SignedIn;
+// src/components/auth/sign-in/SignIn.ts
+var import_browser44 = require("@asgardeo/browser");
+var import_vue51 = require("vue");
 
-// src/components/control/SignedOut.ts
-var import_vue41 = require("vue");
-var SignedOut = (0, import_vue41.defineComponent)({
-  name: "SignedOut",
-  setup(_props, { slots }) {
-    const { isSignedIn } = useAsgardeo_default();
-    return () => {
-      if (isSignedIn.value) {
-        const fallbackContent = slots["fallback"]?.();
-        return fallbackContent ? (0, import_vue41.h)(import_vue41.Fragment, {}, fallbackContent) : null;
-      }
-      const defaultContent = slots["default"]?.();
-      return defaultContent ? (0, import_vue41.h)(import_vue41.Fragment, {}, defaultContent) : null;
-    };
-  }
-});
-var SignedOut_default = SignedOut;
-
-// src/components/control/Loading.ts
-var import_vue42 = require("vue");
-var Loading = (0, import_vue42.defineComponent)({
-  name: "Loading",
-  setup(_props, { slots }) {
-    const { isLoading } = useAsgardeo_default();
-    return () => {
-      if (!isLoading.value) {
-        const fallbackContent = slots["fallback"]?.();
-        return fallbackContent ? (0, import_vue42.h)(import_vue42.Fragment, {}, fallbackContent) : null;
-      }
-      const defaultContent = slots["default"]?.();
-      return defaultContent ? (0, import_vue42.h)(import_vue42.Fragment, {}, defaultContent) : null;
-    };
-  }
-});
-var Loading_default = Loading;
-
-// src/components/control/user/User.ts
-var import_vue43 = require("vue");
-var User5 = (0, import_vue43.defineComponent)({
-  name: "User",
-  setup(_props, { slots }) {
-    const { user } = useAsgardeo_default();
-    return () => {
-      if (!user.value) {
-        const fallbackContent = slots["fallback"]?.();
-        return fallbackContent ? (0, import_vue43.h)(import_vue43.Fragment, {}, fallbackContent) : null;
-      }
-      const defaultContent = slots["default"]?.({ user: user.value });
-      return defaultContent ? (0, import_vue43.h)(import_vue43.Fragment, {}, defaultContent) : null;
-    };
-  }
-});
-var User_default = User5;
-
-// src/components/control/organization/Organization.ts
-var import_vue44 = require("vue");
-var Organization5 = (0, import_vue44.defineComponent)({
-  name: "Organization",
-  setup(_props, { slots }) {
-    const { currentOrganization } = useOrganization_default();
-    return () => {
-      if (!currentOrganization?.value) {
-        const fallbackContent = slots["fallback"]?.();
-        return fallbackContent ? (0, import_vue44.h)(import_vue44.Fragment, {}, fallbackContent) : null;
-      }
-      const defaultContent = slots["default"]?.({ organization: currentOrganization.value });
-      return defaultContent ? (0, import_vue44.h)(import_vue44.Fragment, {}, defaultContent) : null;
-    };
-  }
-});
-var Organization_default = Organization5;
-
-// src/components/presentation/sign-in/SignIn.ts
-var import_browser44 = require("@asgardeo/browser");
-var import_vue56 = require("vue");
-
-// src/components/presentation/sign-in/v1/SignIn.ts
-var import_vue52 = require("vue");
+// src/components/auth/sign-in/v1/SignIn.ts
+var import_vue47 = require("vue");
 
-// src/components/presentation/sign-in/v1/BaseSignIn.ts
+// src/components/auth/sign-in/v1/BaseSignIn.ts
 var import_browser37 = require("@asgardeo/browser");
-var import_vue51 = require("vue");
+var import_vue46 = require("vue");
 
-// src/components/presentation/sign-in/v1/options/SignInOptionFactory.ts
+// src/components/auth/sign-in/v1/options/SignInOptionFactory.ts
 var import_browser36 = require("@asgardeo/browser");
-var import_vue50 = require("vue");
+var import_vue45 = require("vue");
 
 // src/components/adapters/FacebookButton.ts
-var import_vue45 = require("vue");
-var FacebookButton = (0, import_vue45.defineComponent)({
+var import_vue40 = require("vue");
+var FacebookButton = (0, import_vue40.defineComponent)({
   emits: ["click"],
   name: "FacebookButton",
   props: {
@@ -5732,17 +5937,17 @@ var FacebookButton = (0, import_vue45.defineComponent)({
   },
   setup(props, { slots, emit, attrs }) {
     const { t } = useI18n_default();
-    const facebookIcon = () => (0, import_vue45.h)("svg", { height: "18", viewBox: "0 0 512 512", width: "18", xmlns: "http://www.w3.org/2000/svg" }, [
-      (0, import_vue45.h)("path", {
+    const facebookIcon = () => (0, import_vue40.h)("svg", { height: "18", viewBox: "0 0 512 512", width: "18", xmlns: "http://www.w3.org/2000/svg" }, [
+      (0, import_vue40.h)("path", {
         d: "M448,0H64C28.704,0,0,28.704,0,64v384c0,35.296,28.704,64,64,64h384c35.296,0,64-28.704,64-64V64C512,28.704,483.296,0,448,0z",
         fill: "#1976D2"
       }),
-      (0, import_vue45.h)("path", {
+      (0, import_vue40.h)("path", {
         d: "M432,256h-80v-64c0-17.664,14.336-16,32-16h32V96h-64l0,0c-53.024,0-96,42.976-96,96v64h-64v80h64v176h96V336h48L432,256z",
         fill: "#FAFAFA"
       })
     ]);
-    return () => (0, import_vue45.h)(
+    return () => (0, import_vue40.h)(
       Button_default,
       {
         ...attrs,
@@ -5761,8 +5966,8 @@ var FacebookButton = (0, import_vue45.defineComponent)({
 var FacebookButton_default = FacebookButton;
 
 // src/components/adapters/GitHubButton.ts
-var import_vue46 = require("vue");
-var GitHubButton = (0, import_vue46.defineComponent)({
+var import_vue41 = require("vue");
+var GitHubButton = (0, import_vue41.defineComponent)({
   emits: ["click"],
   name: "GitHubButton",
   props: {
@@ -5770,15 +5975,15 @@ var GitHubButton = (0, import_vue46.defineComponent)({
   },
   setup(props, { slots, emit, attrs }) {
     const { t } = useI18n_default();
-    const gitHubIcon = () => (0, import_vue46.h)("svg", { height: "18", viewBox: "0 0 67.91 66.233", width: "18", xmlns: "http://www.w3.org/2000/svg" }, [
-      (0, import_vue46.h)("g", { transform: "translate(-386.96 658.072)" }, [
-        (0, import_vue46.h)("path", {
+    const gitHubIcon = () => (0, import_vue41.h)("svg", { height: "18", viewBox: "0 0 67.91 66.233", width: "18", xmlns: "http://www.w3.org/2000/svg" }, [
+      (0, import_vue41.h)("g", { transform: "translate(-386.96 658.072)" }, [
+        (0, import_vue41.h)("path", {
           d: "M420.915-658.072a33.956,33.956,0,0,0-33.955,33.955,33.963,33.963,0,0,0,23.221,32.22c1.7.314,2.32-.737,2.32-1.633,0-.81-.031-3.484-.046-6.322-9.446,2.054-11.44-4.006-11.44-4.006-1.545-3.925-3.77-4.968-3.77-4.968-3.081-2.107.232-2.064.232-2.064,3.41.239,5.205,3.5,5.205,3.5,3.028,5.19,7.943,3.69,9.881,2.822a7.23,7.23,0,0,1,2.156-4.54c-7.542-.859-15.47-3.77-15.47-16.781a13.141,13.141,0,0,1,3.5-9.114,12.2,12.2,0,0,1,.329-8.986s2.851-.913,9.34,3.48a32.545,32.545,0,0,1,8.5-1.143,32.629,32.629,0,0,1,8.506,1.143c6.481-4.393,9.328-3.48,9.328-3.48a12.185,12.185,0,0,1,.333,8.986,13.115,13.115,0,0,1,3.495,9.114c0,13.042-7.943,15.913-15.5,16.754,1.218,1.054,2.3,3.12,2.3,6.288,0,4.543-.039,8.2-.039,9.318,0,.9.611,1.962,2.332,1.629a33.959,33.959,0,0,0,23.2-32.215,33.955,33.955,0,0,0-33.955-33.955",
           fill: "currentColor"
         })
       ])
     ]);
-    return () => (0, import_vue46.h)(
+    return () => (0, import_vue41.h)(
       Button_default,
       {
         ...attrs,
@@ -5797,8 +6002,8 @@ var GitHubButton = (0, import_vue46.defineComponent)({
 var GitHubButton_default = GitHubButton;
 
 // src/components/adapters/GoogleButton.ts
-var import_vue47 = require("vue");
-var GoogleButton = (0, import_vue47.defineComponent)({
+var import_vue42 = require("vue");
+var GoogleButton = (0, import_vue42.defineComponent)({
   emits: ["click"],
   name: "GoogleButton",
   props: {
@@ -5806,31 +6011,31 @@ var GoogleButton = (0, import_vue47.defineComponent)({
   },
   setup(props, { slots, emit, attrs }) {
     const { t } = useI18n_default();
-    const googleIcon = () => (0, import_vue47.h)("svg", { height: "18", viewBox: "0 0 67.91 67.901", width: "18", xmlns: "http://www.w3.org/2000/svg" }, [
-      (0, import_vue47.h)("g", { transform: "translate(-0.001 -0.001)" }, [
-        (0, import_vue47.h)("path", {
+    const googleIcon = () => (0, import_vue42.h)("svg", { height: "18", viewBox: "0 0 67.91 67.901", width: "18", xmlns: "http://www.w3.org/2000/svg" }, [
+      (0, import_vue42.h)("g", { transform: "translate(-0.001 -0.001)" }, [
+        (0, import_vue42.h)("path", {
           d: "M15.049,160.965l-2.364,8.824-8.639.183a34.011,34.011,0,0,1-.25-31.7h0l7.691,1.41,3.369,7.645a20.262,20.262,0,0,0,.19,13.642Z",
           fill: "#fbbb00",
           transform: "translate(0 -119.93)"
         }),
-        (0, import_vue47.h)("path", {
+        (0, import_vue42.h)("path", {
           d: "M294.24,208.176A33.939,33.939,0,0,1,282.137,241h0l-9.687-.494-1.371-8.559a20.235,20.235,0,0,0,8.706-10.333H261.628V208.176Z",
           fill: "#518ef8",
           transform: "translate(-226.93 -180.567)"
         }),
-        (0, import_vue47.h)("path", {
+        (0, import_vue42.h)("path", {
           d: "M81.668,328.8h0a33.962,33.962,0,0,1-51.161-10.387l11-9.006a20.192,20.192,0,0,0,29.1,10.338Z",
           fill: "#28b446",
           transform: "translate(-26.463 -268.374)"
         }),
-        (0, import_vue47.h)("path", {
+        (0, import_vue42.h)("path", {
           d: "M80.451,7.816l-11,9A20.19,20.19,0,0,0,39.686,27.393l-11.06-9.055h0A33.959,33.959,0,0,1,80.451,7.816Z",
           fill: "#f14336",
           transform: "translate(-24.828)"
         })
       ])
     ]);
-    return () => (0, import_vue47.h)(
+    return () => (0, import_vue42.h)(
       Button_default,
       {
         ...attrs,
@@ -5849,8 +6054,8 @@ var GoogleButton = (0, import_vue47.defineComponent)({
 var GoogleButton_default = GoogleButton;
 
 // src/components/adapters/MicrosoftButton.ts
-var import_vue48 = require("vue");
-var MicrosoftButton = (0, import_vue48.defineComponent)({
+var import_vue43 = require("vue");
+var MicrosoftButton = (0, import_vue43.defineComponent)({
   emits: ["click"],
   name: "MicrosoftButton",
   props: {
@@ -5858,14 +6063,14 @@ var MicrosoftButton = (0, import_vue48.defineComponent)({
   },
   setup(props, { slots, emit, attrs }) {
     const { t } = useI18n_default();
-    const microsoftIcon = () => (0, import_vue48.h)("svg", { height: "14", viewBox: "0 0 23 23", width: "14", xmlns: "http://www.w3.org/2000/svg" }, [
-      (0, import_vue48.h)("path", { d: "M0 0h23v23H0z", fill: "#f3f3f3" }),
-      (0, import_vue48.h)("path", { d: "M1 1h10v10H1z", fill: "#f35325" }),
-      (0, import_vue48.h)("path", { d: "M12 1h10v10H12z", fill: "#81bc06" }),
-      (0, import_vue48.h)("path", { d: "M1 12h10v10H1z", fill: "#05a6f0" }),
-      (0, import_vue48.h)("path", { d: "M12 12h10v10H12z", fill: "#ffba08" })
+    const microsoftIcon = () => (0, import_vue43.h)("svg", { height: "14", viewBox: "0 0 23 23", width: "14", xmlns: "http://www.w3.org/2000/svg" }, [
+      (0, import_vue43.h)("path", { d: "M0 0h23v23H0z", fill: "#f3f3f3" }),
+      (0, import_vue43.h)("path", { d: "M1 1h10v10H1z", fill: "#f35325" }),
+      (0, import_vue43.h)("path", { d: "M12 1h10v10H12z", fill: "#81bc06" }),
+      (0, import_vue43.h)("path", { d: "M1 12h10v10H1z", fill: "#05a6f0" }),
+      (0, import_vue43.h)("path", { d: "M12 12h10v10H12z", fill: "#ffba08" })
     ]);
-    return () => (0, import_vue48.h)(
+    return () => (0, import_vue43.h)(
       Button_default,
       {
         ...attrs,
@@ -5885,7 +6090,7 @@ var MicrosoftButton_default = MicrosoftButton;
 
 // src/components/factories/FieldFactory.ts
 var import_browser35 = require("@asgardeo/browser");
-var import_vue49 = require("vue");
+var import_vue44 = require("vue");
 var validateFieldValue = (value, type, required = false, touched = false) => {
   if (required && touched && (!value || value.trim() === "")) {
     return "This field is required";
@@ -5937,44 +6142,44 @@ var createField = (config) => {
   };
   switch (type) {
     case import_browser35.FieldType.Password:
-      return (0, import_vue49.h)(PasswordField_default, {
+      return (0, import_vue44.h)(PasswordField_default, {
         ...commonProps,
         "onUpdate:modelValue": onChange
       });
     case import_browser35.FieldType.Text:
-      return (0, import_vue49.h)(TextField_default, {
+      return (0, import_vue44.h)(TextField_default, {
         ...commonProps,
         autocomplete: "off",
         "onUpdate:modelValue": onChange,
         type: "text"
       });
     case import_browser35.FieldType.Email:
-      return (0, import_vue49.h)(TextField_default, {
+      return (0, import_vue44.h)(TextField_default, {
         ...commonProps,
         autocomplete: "email",
         "onUpdate:modelValue": onChange,
         type: "email"
       });
     case import_browser35.FieldType.Date:
-      return (0, import_vue49.h)(DatePicker_default, {
+      return (0, import_vue44.h)(DatePicker_default, {
         ...commonProps,
         "onUpdate:modelValue": onChange
       });
     case import_browser35.FieldType.Checkbox: {
       const isChecked = value === "true" || value === true;
-      return (0, import_vue49.h)(Checkbox_default, {
+      return (0, import_vue44.h)(Checkbox_default, {
         ...commonProps,
         modelValue: isChecked,
         "onUpdate:modelValue": (checked) => onChange(checked.toString())
       });
     }
     case import_browser35.FieldType.Otp:
-      return (0, import_vue49.h)(OtpField_default, {
+      return (0, import_vue44.h)(OtpField_default, {
         ...commonProps,
         "onUpdate:modelValue": onChange
       });
     case import_browser35.FieldType.Number:
-      return (0, import_vue49.h)(TextField_default, {
+      return (0, import_vue44.h)(TextField_default, {
         ...commonProps,
         helperText: "Enter a numeric value",
         "onUpdate:modelValue": onChange,
@@ -5983,14 +6188,14 @@ var createField = (config) => {
     case import_browser35.FieldType.Select: {
       const fieldOptions = options.length > 0 ? options : [];
       if (fieldOptions.length > 0) {
-        return (0, import_vue49.h)(Select_default, {
+        return (0, import_vue44.h)(Select_default, {
           ...commonProps,
           helperText: "Select from available options",
           "onUpdate:modelValue": onChange,
           options: fieldOptions
         });
       }
-      return (0, import_vue49.h)(TextField_default, {
+      return (0, import_vue44.h)(TextField_default, {
         ...commonProps,
         helperText: "Enter multiple values separated by commas (e.g., value1, value2, value3)",
         "onUpdate:modelValue": onChange,
@@ -5999,7 +6204,7 @@ var createField = (config) => {
       });
     }
     default:
-      return (0, import_vue49.h)(TextField_default, {
+      return (0, import_vue44.h)(TextField_default, {
         ...commonProps,
         helperText: "Unknown field type, treating as text",
         "onUpdate:modelValue": onChange,
@@ -6007,7 +6212,7 @@ var createField = (config) => {
       });
   }
 };
-var FieldFactory = (0, import_vue49.defineComponent)({
+var FieldFactory = (0, import_vue44.defineComponent)({
   emits: ["change", "blur"],
   name: "FieldFactory",
   props: {
@@ -6043,12 +6248,12 @@ var FieldFactory = (0, import_vue49.defineComponent)({
 });
 var FieldFactory_default = FieldFactory;
 
-// src/components/presentation/sign-in/v1/options/SignInOptionFactory.ts
+// src/components/auth/sign-in/v1/options/SignInOptionFactory.ts
 var renderFormFields = (props) => {
   const { authenticator, formValues, touchedFields, isLoading, onInputChange, inputClassName, buttonClassName, t } = props;
   const formFields = authenticator.metadata?.params?.sort((a, b) => a.order - b.order)?.filter((param) => param.param !== "totp") || [];
   const fieldNodes = formFields.map(
-    (param) => (0, import_vue50.h)(
+    (param) => (0, import_vue45.h)(
       "div",
       { key: param.param },
       createField({
@@ -6068,7 +6273,7 @@ var renderFormFields = (props) => {
     )
   );
   fieldNodes.push(
-    (0, import_vue50.h)(
+    (0, import_vue45.h)(
       Button_default,
       {
         class: buttonClassName,
@@ -6098,10 +6303,10 @@ var renderMultiOptionButton = (props) => {
     [import_browser36.ApplicationNativeAuthenticationConstants.SupportedAuthenticators.Totp]: "M12 1L3 5v6c0 5.55 3.84 10.74 9 12c5.16-1.26 9-6.45 9-12V5z"
   };
   const iconPath = iconPathMap[authenticator.authenticatorId] || "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2m-2 15l-5-5l1.41-1.41L10 14.17l7.59-7.59L19 8z";
-  const icon2 = (0, import_vue50.h)("svg", { height: "18", viewBox: "0 0 24 24", width: "18", xmlns: "http://www.w3.org/2000/svg" }, [
-    (0, import_vue50.h)("path", { d: iconPath, fill: "currentColor" })
+  const icon2 = (0, import_vue45.h)("svg", { height: "18", viewBox: "0 0 24 24", width: "18", xmlns: "http://www.w3.org/2000/svg" }, [
+    (0, import_vue45.h)("path", { d: iconPath, fill: "currentColor" })
   ]);
-  return (0, import_vue50.h)(
+  return (0, import_vue45.h)(
     Button_default,
     {
       class: buttonClassName,
@@ -6118,17 +6323,17 @@ var renderMultiOptionButton = (props) => {
 };
 var renderSocialButton = (props) => {
   const { authenticator, isLoading, onSubmit, buttonClassName, t } = props;
-  const socialIcon = (0, import_vue50.h)(
+  const socialIcon = (0, import_vue45.h)(
     "svg",
     { height: "18", viewBox: "0 0 24 24", width: "18", xmlns: "http://www.w3.org/2000/svg" },
     [
-      (0, import_vue50.h)("path", {
+      (0, import_vue45.h)("path", {
         d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z",
         fill: "currentColor"
       })
     ]
   );
-  return (0, import_vue50.h)(
+  return (0, import_vue45.h)(
     Button_default,
     {
       class: buttonClassName,
@@ -6149,27 +6354,27 @@ var createSignInOption = (props) => {
   switch (authenticator.authenticatorId) {
     case import_browser36.ApplicationNativeAuthenticationConstants.SupportedAuthenticators.UsernamePassword:
     case import_browser36.ApplicationNativeAuthenticationConstants.SupportedAuthenticators.IdentifierFirst:
-      return (0, import_vue50.h)("div", {}, renderFormFields(props));
+      return (0, import_vue45.h)("div", {}, renderFormFields(props));
     case import_browser36.ApplicationNativeAuthenticationConstants.SupportedAuthenticators.Google:
-      return (0, import_vue50.h)(GoogleButton_default, {
+      return (0, import_vue45.h)(GoogleButton_default, {
         class: buttonClassName,
         isLoading,
         onClick: () => onSubmit(authenticator)
       });
     case import_browser36.ApplicationNativeAuthenticationConstants.SupportedAuthenticators.GitHub:
-      return (0, import_vue50.h)(GitHubButton_default, {
+      return (0, import_vue45.h)(GitHubButton_default, {
         class: buttonClassName,
         isLoading,
         onClick: () => onSubmit(authenticator)
       });
     case import_browser36.ApplicationNativeAuthenticationConstants.SupportedAuthenticators.Microsoft:
-      return (0, import_vue50.h)(MicrosoftButton_default, {
+      return (0, import_vue45.h)(MicrosoftButton_default, {
         class: buttonClassName,
         isLoading,
         onClick: () => onSubmit(authenticator)
       });
     case import_browser36.ApplicationNativeAuthenticationConstants.SupportedAuthenticators.Facebook:
-      return (0, import_vue50.h)(FacebookButton_default, {
+      return (0, import_vue45.h)(FacebookButton_default, {
         class: buttonClassName,
         isLoading,
         onClick: () => onSubmit(authenticator)
@@ -6177,12 +6382,12 @@ var createSignInOption = (props) => {
     case import_browser36.ApplicationNativeAuthenticationConstants.SupportedAuthenticators.EmailOtp:
     case import_browser36.ApplicationNativeAuthenticationConstants.SupportedAuthenticators.Totp:
     case import_browser36.ApplicationNativeAuthenticationConstants.SupportedAuthenticators.SmsOtp:
-      return hasParams ? (0, import_vue50.h)("div", {}, renderFormFields(props)) : renderMultiOptionButton(props);
+      return hasParams ? (0, import_vue45.h)("div", {}, renderFormFields(props)) : renderMultiOptionButton(props);
     default:
       if (authenticator.idp !== import_browser36.EmbeddedSignInFlowAuthenticatorKnownIdPType.Local) {
         return renderSocialButton(props);
       }
-      return hasParams ? (0, import_vue50.h)("div", {}, renderFormFields(props)) : renderMultiOptionButton(props);
+      return hasParams ? (0, import_vue45.h)("div", {}, renderFormFields(props)) : renderMultiOptionButton(props);
   }
 };
 var createSignInOptionFromAuthenticator = (authenticator, formValues, touchedFields, isLoading, onInputChange, onSubmit, t, options) => createSignInOption({
@@ -6196,10 +6401,10 @@ var createSignInOptionFromAuthenticator = (authenticator, formValues, touchedFie
   ...options
 });
 
-// src/components/presentation/sign-in/v1/BaseSignIn.ts
+// src/components/auth/sign-in/v1/BaseSignIn.ts
 var HIDDEN_AUTHENTICATORS = ["T3JnYW5pemF0aW9uQXV0aGVudGljYXRvcjpTU08"];
 var isPasskeyAuthenticator = (authenticator) => authenticator.authenticatorId === import_browser37.ApplicationNativeAuthenticationConstants.SupportedAuthenticators.Passkey && authenticator.metadata?.promptType === import_browser37.EmbeddedSignInFlowAuthenticatorPromptType.InternalPrompt && !!authenticator.metadata?.additionalData?.challengeData;
-var BaseSignIn = (0, import_vue51.defineComponent)({
+var BaseSignIn = (0, import_vue46.defineComponent)({
   emits: ["error", "flowChange", "success"],
   name: "BaseSignInV1",
   props: {
@@ -6224,14 +6429,14 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
   setup(props, { emit }) {
     const { t } = useI18n_default();
     const { title: flowTitle, subtitle: flowSubtitle, messages: flowMessages } = useFlow_default();
-    const isInitRequestLoading = (0, import_vue51.ref)(false);
-    const isInitialized = (0, import_vue51.ref)(false);
-    const currentFlow = (0, import_vue51.ref)(null);
-    const currentAuthenticator = (0, import_vue51.ref)(null);
-    const error = (0, import_vue51.ref)(null);
-    const messages = (0, import_vue51.ref)([]);
-    const formValues = (0, import_vue51.ref)({});
-    const touchedFields = (0, import_vue51.ref)({});
+    const isInitRequestLoading = (0, import_vue46.ref)(false);
+    const isInitialized = (0, import_vue46.ref)(false);
+    const currentFlow = (0, import_vue46.ref)(null);
+    const currentAuthenticator = (0, import_vue46.ref)(null);
+    const error = (0, import_vue46.ref)(null);
+    const messages = (0, import_vue46.ref)([]);
+    const formValues = (0, import_vue46.ref)({});
+    const touchedFields = (0, import_vue46.ref)({});
     const isLoading = () => props.isLoading || isInitRequestLoading.value;
     const setupFormFields = (authenticator) => {
       const vals = {};
@@ -6537,7 +6742,7 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
       return currentFlow.value.nextStep.authenticators;
     };
     let initAttempted = false;
-    (0, import_vue51.watch)(
+    (0, import_vue46.watch)(
       () => props.isLoading,
       (loading) => {
         if (!loading && !initAttempted && props.onInitialize) {
@@ -6588,9 +6793,9 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
       return "info";
     };
     const renderMessages = () => messages.value.map(
-      (msg, i) => (0, import_vue51.h)(Alert_default, { key: i, severity: renderAlertVariant(msg.type) }, { default: () => msg.message })
+      (msg, i) => (0, import_vue46.h)(Alert_default, { key: i, severity: renderAlertVariant(msg.type) }, { default: () => msg.message })
     );
-    const renderError = () => error.value ? (0, import_vue51.h)(Alert_default, { severity: "error" }, { default: () => error.value }) : null;
+    const renderError = () => error.value ? (0, import_vue46.h)(Alert_default, { severity: "error" }, { default: () => error.value }) : null;
     return () => {
       const cardClass = [
         (0, import_browser37.withVendorCSSClassPrefix)("signin"),
@@ -6599,16 +6804,16 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
         props.className
       ].filter(Boolean).join(" ");
       if (!isInitialized.value && isLoading()) {
-        return (0, import_vue51.h)("div", {}, [
-          props.showLogo ? (0, import_vue51.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__logo") }, [(0, import_vue51.h)(Logo_default)]) : null,
-          (0, import_vue51.h)(
+        return (0, import_vue46.h)("div", {}, [
+          props.showLogo ? (0, import_vue46.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__logo") }, [(0, import_vue46.h)(Logo_default)]) : null,
+          (0, import_vue46.h)(
             Card_default,
             { class: cardClass, variant: props.variant },
             {
               default: () => [
-                (0, import_vue51.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__loading") }, [
-                  (0, import_vue51.h)(Spinner_default, { size: "medium" }),
-                  (0, import_vue51.h)(Typography_default, { variant: "body1" }, { default: () => t("messages.loading.placeholder") })
+                (0, import_vue46.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__loading") }, [
+                  (0, import_vue46.h)(Spinner_default, { size: "medium" }),
+                  (0, import_vue46.h)(Typography_default, { variant: "body1" }, { default: () => t("messages.loading.placeholder") })
                 ])
               ]
             }
@@ -6621,9 +6826,9 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
           (auth) => auth.metadata?.promptType === import_browser37.EmbeddedSignInFlowAuthenticatorPromptType.UserPrompt || auth.idp === "LOCAL" && auth.metadata?.params && auth.metadata.params.length > 0
         );
         const optionAuths = available.filter((auth) => !userPromptAuths.includes(auth)).filter((auth) => !HIDDEN_AUTHENTICATORS.includes(auth.authenticatorId));
-        return (0, import_vue51.h)("div", {}, [
-          props.showLogo ? (0, import_vue51.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__logo") }, [(0, import_vue51.h)(Logo_default)]) : null,
-          (0, import_vue51.h)(
+        return (0, import_vue46.h)("div", {}, [
+          props.showLogo ? (0, import_vue46.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__logo") }, [(0, import_vue46.h)(Logo_default)]) : null,
+          (0, import_vue46.h)(
             Card_default,
             { class: cardClass, variant: props.variant },
             {
@@ -6631,9 +6836,9 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
                 const children = [];
                 if (props.showTitle || props.showSubtitle) {
                   children.push(
-                    (0, import_vue51.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__header") }, [
-                      props.showTitle ? (0, import_vue51.h)(Typography_default, { variant: "h2" }, { default: () => flowTitle.value || t("signin.heading") }) : null,
-                      props.showSubtitle ? (0, import_vue51.h)(
+                    (0, import_vue46.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__header") }, [
+                      props.showTitle ? (0, import_vue46.h)(Typography_default, { variant: "h2" }, { default: () => flowTitle.value || t("signin.heading") }) : null,
+                      props.showSubtitle ? (0, import_vue46.h)(
                         Typography_default,
                         { variant: "body1" },
                         { default: () => flowSubtitle.value || t("signin.subheading") }
@@ -6643,22 +6848,22 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
                 }
                 if (flowMessages.value?.length > 0) {
                   children.push(
-                    (0, import_vue51.h)(
+                    (0, import_vue46.h)(
                       "div",
                       { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__flow-messages") },
                       flowMessages.value.map(
-                        (fm, i) => (0, import_vue51.h)(Alert_default, { key: fm.id || i, severity: fm.type }, { default: () => fm.message })
+                        (fm, i) => (0, import_vue46.h)(Alert_default, { key: fm.id || i, severity: fm.type }, { default: () => fm.message })
                       )
                     )
                   );
                 }
-                if (messages.value.length > 0) children.push((0, import_vue51.h)("div", {}, renderMessages()));
+                if (messages.value.length > 0) children.push((0, import_vue46.h)("div", {}, renderMessages()));
                 const errNode = renderError();
                 if (errNode) children.push(errNode);
                 userPromptAuths.forEach((auth, index) => {
-                  if (index > 0) children.push((0, import_vue51.h)(Divider_default, {}, { default: () => "OR" }));
+                  if (index > 0) children.push((0, import_vue46.h)(Divider_default, {}, { default: () => "OR" }));
                   children.push(
-                    (0, import_vue51.h)(
+                    (0, import_vue46.h)(
                       "form",
                       {
                         onSubmit: (e) => {
@@ -6690,11 +6895,11 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
                   );
                 });
                 if (userPromptAuths.length > 0 && optionAuths.length > 0) {
-                  children.push((0, import_vue51.h)(Divider_default, {}, { default: () => "OR" }));
+                  children.push((0, import_vue46.h)(Divider_default, {}, { default: () => "OR" }));
                 }
                 optionAuths.forEach((auth) => {
                   children.push(
-                    (0, import_vue51.h)("div", { key: auth.authenticatorId }, [
+                    (0, import_vue46.h)("div", { key: auth.authenticatorId }, [
                       createSignInOptionFromAuthenticator(
                         auth,
                         formValues.value,
@@ -6719,15 +6924,15 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
         ]);
       }
       if (!currentAuthenticator.value) {
-        return (0, import_vue51.h)("div", {}, [
-          props.showLogo ? (0, import_vue51.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__logo") }, [(0, import_vue51.h)(Logo_default)]) : null,
-          (0, import_vue51.h)(
+        return (0, import_vue46.h)("div", {}, [
+          props.showLogo ? (0, import_vue46.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__logo") }, [(0, import_vue46.h)(Logo_default)]) : null,
+          (0, import_vue46.h)(
             Card_default,
             { class: cardClass, variant: props.variant },
             {
               default: () => {
                 const errNode = renderError();
-                return errNode ? [errNode] : [(0, import_vue51.h)(Typography_default, { variant: "body1" }, { default: () => t("messages.loading.placeholder") })];
+                return errNode ? [errNode] : [(0, import_vue46.h)(Typography_default, { variant: "body1" }, { default: () => t("messages.loading.placeholder") })];
               }
             }
           )
@@ -6735,16 +6940,16 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
       }
       if (isPasskeyAuthenticator(currentAuthenticator.value) && !isLoading()) {
         handleAuthenticatorSelection(currentAuthenticator.value);
-        return (0, import_vue51.h)("div", {}, [
-          props.showLogo ? (0, import_vue51.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__logo") }, [(0, import_vue51.h)(Logo_default)]) : null,
-          (0, import_vue51.h)(
+        return (0, import_vue46.h)("div", {}, [
+          props.showLogo ? (0, import_vue46.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__logo") }, [(0, import_vue46.h)(Logo_default)]) : null,
+          (0, import_vue46.h)(
             Card_default,
             { class: cardClass, variant: props.variant },
             {
               default: () => [
-                (0, import_vue51.h)("div", { style: "text-align:center" }, [
-                  (0, import_vue51.h)(Spinner_default, { size: "large" }),
-                  (0, import_vue51.h)(
+                (0, import_vue46.h)("div", { style: "text-align:center" }, [
+                  (0, import_vue46.h)(Spinner_default, { size: "large" }),
+                  (0, import_vue46.h)(
                     Typography_default,
                     { variant: "body1" },
                     { default: () => t("passkey.authenticating") || "Authenticating with passkey..." }
@@ -6755,36 +6960,36 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
           )
         ]);
       }
-      return (0, import_vue51.h)("div", {}, [
-        props.showLogo ? (0, import_vue51.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__logo") }, [(0, import_vue51.h)(Logo_default)]) : null,
-        (0, import_vue51.h)(
+      return (0, import_vue46.h)("div", {}, [
+        props.showLogo ? (0, import_vue46.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__logo") }, [(0, import_vue46.h)(Logo_default)]) : null,
+        (0, import_vue46.h)(
           Card_default,
           { class: cardClass, variant: props.variant },
           {
             default: () => {
               const children = [];
               children.push(
-                (0, import_vue51.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__header") }, [
-                  (0, import_vue51.h)(Typography_default, { variant: "h2" }, { default: () => flowTitle.value || t("signin.heading") }),
-                  (0, import_vue51.h)(Typography_default, { variant: "body1" }, { default: () => flowSubtitle.value || t("signin.subheading") })
+                (0, import_vue46.h)("div", { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__header") }, [
+                  (0, import_vue46.h)(Typography_default, { variant: "h2" }, { default: () => flowTitle.value || t("signin.heading") }),
+                  (0, import_vue46.h)(Typography_default, { variant: "body1" }, { default: () => flowSubtitle.value || t("signin.subheading") })
                 ])
               );
               if (flowMessages.value?.length > 0) {
                 children.push(
-                  (0, import_vue51.h)(
+                  (0, import_vue46.h)(
                     "div",
                     { class: (0, import_browser37.withVendorCSSClassPrefix)("signin__flow-messages") },
                     flowMessages.value.map(
-                      (fm, i) => (0, import_vue51.h)(Alert_default, { key: fm.id || i, severity: fm.type }, { default: () => fm.message })
+                      (fm, i) => (0, import_vue46.h)(Alert_default, { key: fm.id || i, severity: fm.type }, { default: () => fm.message })
                     )
                   )
                 );
               }
-              if (messages.value.length > 0) children.push((0, import_vue51.h)("div", {}, renderMessages()));
+              if (messages.value.length > 0) children.push((0, import_vue46.h)("div", {}, renderMessages()));
               const errNode = renderError();
               if (errNode) children.push(errNode);
               children.push(
-                (0, import_vue51.h)(
+                (0, import_vue46.h)(
                   "form",
                   {
                     class: (0, import_browser37.withVendorCSSClassPrefix)("signin__form"),
@@ -6825,8 +7030,8 @@ var BaseSignIn = (0, import_vue51.defineComponent)({
 });
 var BaseSignIn_default = BaseSignIn;
 
-// src/components/presentation/sign-in/v1/SignIn.ts
-var SignIn = (0, import_vue52.defineComponent)({
+// src/components/auth/sign-in/v1/SignIn.ts
+var SignIn = (0, import_vue47.defineComponent)({
   emits: ["error", "success"],
   name: "SignInV1",
   props: {
@@ -6856,7 +7061,7 @@ var SignIn = (0, import_vue52.defineComponent)({
         window.location.href = url.toString();
       }
     };
-    return () => (0, import_vue52.h)(BaseSignIn_default, {
+    return () => (0, import_vue47.h)(BaseSignIn_default, {
       ...attrs,
       afterSignInUrl,
       class: props.className,
@@ -6875,18 +7080,18 @@ var SignIn = (0, import_vue52.defineComponent)({
 });
 var SignIn_default = SignIn;
 
-// src/components/presentation/sign-in/v2/SignIn.ts
+// src/components/auth/sign-in/v2/SignIn.ts
 var import_browser43 = require("@asgardeo/browser");
-var import_vue55 = require("vue");
+var import_vue50 = require("vue");
 
-// src/components/presentation/sign-in/v2/BaseSignIn.ts
+// src/components/auth/sign-in/v2/BaseSignIn.ts
 var import_browser40 = require("@asgardeo/browser");
-var import_vue54 = require("vue");
+var import_vue49 = require("vue");
 
-// src/components/presentation/sign-in/AuthOptionFactoryCore.ts
+// src/components/auth/sign-in/AuthOptionFactoryCore.ts
 var import_browser38 = require("@asgardeo/browser");
 var import_dompurify = __toESM(require("dompurify"), 1);
-var import_vue53 = require("vue");
+var import_vue48 = require("vue");
 var logger5 = createVueLogger("AuthOptionFactory");
 var getConsentOptionalKey = (purposeId, attr) => `consent_${purposeId}_${attr}`;
 var resolveEmojiUrisInHtml = (html) => {
@@ -7012,30 +7217,30 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
         }
       };
       if (matchesSocialProvider(actionId, eventType, buttonText, "google")) {
-        return (0, import_vue53.h)(GoogleButton_default, { class: options.buttonClassName, key, onClick: handleClick });
+        return (0, import_vue48.h)(GoogleButton_default, { class: options.buttonClassName, key, onClick: handleClick });
       }
       if (matchesSocialProvider(actionId, eventType, buttonText, "github")) {
-        return (0, import_vue53.h)(GitHubButton_default, { class: options.buttonClassName, key, onClick: handleClick });
+        return (0, import_vue48.h)(GitHubButton_default, { class: options.buttonClassName, key, onClick: handleClick });
       }
       if (matchesSocialProvider(actionId, eventType, buttonText, "facebook")) {
-        return (0, import_vue53.h)(FacebookButton_default, { class: options.buttonClassName, key, onClick: handleClick });
+        return (0, import_vue48.h)(FacebookButton_default, { class: options.buttonClassName, key, onClick: handleClick });
       }
       if (matchesSocialProvider(actionId, eventType, buttonText, "microsoft")) {
-        return (0, import_vue53.h)(MicrosoftButton_default, { class: options.buttonClassName, key, onClick: handleClick });
+        return (0, import_vue48.h)(MicrosoftButton_default, { class: options.buttonClassName, key, onClick: handleClick });
       }
-      const startIconVNode = component.startIcon ? (0, import_vue53.h)("img", {
+      const startIconVNode = component.startIcon ? (0, import_vue48.h)("img", {
         alt: "",
         "aria-hidden": "true",
         src: component.startIcon,
         style: { height: "1.25em", objectFit: "contain", width: "1.25em" }
       }) : null;
-      const endIconVNode = component.endIcon ? (0, import_vue53.h)("img", {
+      const endIconVNode = component.endIcon ? (0, import_vue48.h)("img", {
         alt: "",
         "aria-hidden": "true",
         src: component.endIcon,
         style: { height: "1.25em", objectFit: "contain", width: "1.25em" }
       }) : null;
-      return (0, import_vue53.h)(
+      return (0, import_vue48.h)(
         Button_default,
         {
           class: options.buttonClassName,
@@ -7055,7 +7260,7 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
     case import_browser38.EmbeddedFlowComponentTypeV2.Text: {
       const variant = getTypographyVariant(component.variant);
       const align = typeof component["align"] === "string" ? component["align"] : "left";
-      return (0, import_vue53.h)(
+      return (0, import_vue48.h)(
         Typography_default,
         {
           key,
@@ -7067,7 +7272,7 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
     }
     case import_browser38.EmbeddedFlowComponentTypeV2.Divider: {
       const dividerLabel = resolve(component.label) || "";
-      return (0, import_vue53.h)(Divider_default, { key }, dividerLabel ? { default: () => dividerLabel } : void 0);
+      return (0, import_vue48.h)(Divider_default, { key }, dividerLabel ? { default: () => dividerLabel } : void 0);
     }
     case import_browser38.EmbeddedFlowComponentTypeV2.Select: {
       const identifier = component.ref;
@@ -7080,7 +7285,7 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
           value: typeof opt === "string" ? opt : String(opt.value ?? "")
         })
       );
-      return (0, import_vue53.h)(Select_default, {
+      return (0, import_vue48.h)(Select_default, {
         class: options.inputClassName,
         error,
         key,
@@ -7111,12 +7316,12 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
             }
           )
         ).filter(Boolean);
-        return (0, import_vue53.h)("form", { id: component.id, key }, blockChildren);
+        return (0, import_vue48.h)("form", { id: component.id, key }, blockChildren);
       }
       return null;
     }
     case import_browser38.EmbeddedFlowComponentTypeV2.RichText: {
-      return (0, import_vue53.h)("div", {
+      return (0, import_vue48.h)("div", {
         innerHTML: import_dompurify.default.sanitize(resolveEmojiUrisInHtml(resolve(component.label))),
         key,
         style: { overflowWrap: "anywhere" }
@@ -7125,7 +7330,7 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
     case import_browser38.EmbeddedFlowComponentTypeV2.Image: {
       const explicitHeight = resolve(component.height?.toString());
       const explicitWidth = resolve(component.width?.toString());
-      return (0, import_vue53.h)("img", {
+      return (0, import_vue48.h)("img", {
         alt: resolve(component.alt) || resolve(component.label) || "Image",
         key,
         src: resolve(component.src),
@@ -7169,7 +7374,7 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
           }
         )
       ) : [];
-      return (0, import_vue53.h)("div", { key, style: stackStyle }, stackChildren.filter(Boolean));
+      return (0, import_vue48.h)("div", { key, style: stackStyle }, stackChildren.filter(Boolean));
     }
     case import_browser38.EmbeddedFlowComponentTypeV2.Consent: {
       logger5.warn(`Consent component type is not yet fully supported in the Vue SDK.`);
@@ -7180,7 +7385,7 @@ var createAuthComponentFromFlow = (component, formValues, touchedFields, formErr
       const timeoutMs = Number(options.additionalData?.["stepTimeout"]) || 0;
       const expiresIn = timeoutMs > 0 ? Math.max(0, Math.floor((timeoutMs - Date.now()) / 1e3)) : 0;
       const timerText = textTemplate.replace("{time}", String(expiresIn));
-      return (0, import_vue53.h)("div", { class: "asgardeo-flow-timer", key }, timerText);
+      return (0, import_vue48.h)("div", { class: "asgardeo-flow-timer", key }, timerText);
     }
     default:
       logger5.warn(`Unsupported component type: ${component.type}. Skipping render.`);
@@ -7358,7 +7563,7 @@ var normalizeFlowResponse = (response, t, options = {}, meta) => {
   };
 };
 
-// src/components/presentation/sign-in/v2/BaseSignIn.ts
+// src/components/auth/sign-in/v2/BaseSignIn.ts
 var extractFormFields = (flowComponents) => {
   const fields = [];
   const process = (comps) => {
@@ -7374,7 +7579,7 @@ var extractFormFields = (flowComponents) => {
   process(flowComponents);
   return fields;
 };
-var BaseSignIn2 = (0, import_vue54.defineComponent)({
+var BaseSignIn2 = (0, import_vue49.defineComponent)({
   emits: ["error", "success"],
   name: "BaseSignIn",
   props: {
@@ -7407,12 +7612,12 @@ var BaseSignIn2 = (0, import_vue54.defineComponent)({
     const { meta: metaRef } = useFlowMeta_default();
     const { t } = useI18n_default();
     const { subtitle: flowSubtitle, title: flowTitle, messages: flowMessages, addMessage, clearMessages } = useFlow_default();
-    const isSubmitting = (0, import_vue54.ref)(false);
-    const apiError = (0, import_vue54.ref)(null);
-    const isLoading = (0, import_vue54.computed)(() => props.isLoading || isSubmitting.value);
-    const formValues = (0, import_vue54.ref)({});
-    const touchedFields = (0, import_vue54.ref)({});
-    (0, import_vue54.watch)(
+    const isSubmitting = (0, import_vue49.ref)(false);
+    const apiError = (0, import_vue49.ref)(null);
+    const isLoading = (0, import_vue49.computed)(() => props.isLoading || isSubmitting.value);
+    const formValues = (0, import_vue49.ref)({});
+    const touchedFields = (0, import_vue49.ref)({});
+    (0, import_vue49.watch)(
       () => props.components,
       (newComponents) => {
         const fields = extractFormFields(newComponents || []);
@@ -7425,7 +7630,7 @@ var BaseSignIn2 = (0, import_vue54.defineComponent)({
       },
       { deep: false, immediate: true }
     );
-    const formErrors = (0, import_vue54.computed)(() => {
+    const formErrors = (0, import_vue49.computed)(() => {
       const fields = extractFormFields(props.components || []);
       const errors = {};
       fields.forEach((field) => {
@@ -7440,7 +7645,7 @@ var BaseSignIn2 = (0, import_vue54.defineComponent)({
       });
       return errors;
     });
-    const isFormValid = (0, import_vue54.computed)(() => Object.keys(formErrors.value).length === 0);
+    const isFormValid = (0, import_vue49.computed)(() => Object.keys(formErrors.value).length === 0);
     const handleError = (error) => {
       const errorMessage = error?.failureReason || extractErrorMessage(error, t);
       apiError.value = error instanceof Error ? error : new Error(errorMessage);
@@ -7540,23 +7745,23 @@ var BaseSignIn2 = (0, import_vue54.defineComponent)({
           validateForm,
           values: formValues.value
         };
-        return (0, import_vue54.h)("div", { class: containerClass, ...attrs }, slots["default"](renderProps));
+        return (0, import_vue49.h)("div", { class: containerClass, ...attrs }, slots["default"](renderProps));
       }
       if (isLoading.value && (!props.components || props.components.length === 0)) {
-        return (0, import_vue54.h)(
+        return (0, import_vue49.h)(
           Card_default,
           { class: containerClass, variant: props.variant },
-          () => (0, import_vue54.h)("div", { style: "display:flex;justify-content:center;padding:2rem" }, (0, import_vue54.h)(Spinner_default))
+          () => (0, import_vue49.h)("div", { style: "display:flex;justify-content:center;padding:2rem" }, (0, import_vue49.h)(Spinner_default))
         );
       }
       if (!props.components || props.components.length === 0) {
-        return (0, import_vue54.h)(
+        return (0, import_vue49.h)(
           Card_default,
           { class: containerClass, variant: props.variant },
-          () => (0, import_vue54.h)(
+          () => (0, import_vue49.h)(
             Alert_default,
             { severity: "warning" },
-            () => (0, import_vue54.h)(
+            () => (0, import_vue49.h)(
               Typography_default,
               { variant: "body1" },
               () => t("errors.signin.components.not.available") || "No sign-in options available"
@@ -7566,24 +7771,24 @@ var BaseSignIn2 = (0, import_vue54.defineComponent)({
       }
       const messages = flowMessages.value || [];
       const externalError = props.error;
-      return (0, import_vue54.h)(Card_default, { class: containerClass, ...attrs, variant: props.variant }, () => [
+      return (0, import_vue49.h)(Card_default, { class: containerClass, ...attrs, variant: props.variant }, () => [
         // Show errors and flow messages
-        (externalError || messages.length > 0) && (0, import_vue54.h)(
+        (externalError || messages.length > 0) && (0, import_vue49.h)(
           "div",
           { class: [(0, import_browser40.withVendorCSSClassPrefix)("signin__messages"), props.messageClassName].filter(Boolean).join(" ") },
           [
-            externalError && (0, import_vue54.h)(Alert_default, { severity: "error" }, () => (0, import_vue54.h)(Typography_default, { variant: "body2" }, () => externalError.message)),
+            externalError && (0, import_vue49.h)(Alert_default, { severity: "error" }, () => (0, import_vue49.h)(Typography_default, { variant: "body2" }, () => externalError.message)),
             ...messages.map(
-              (msg, index) => (0, import_vue54.h)(
+              (msg, index) => (0, import_vue49.h)(
                 Alert_default,
                 { key: index, severity: msg.type === "error" ? "error" : "info" },
-                () => (0, import_vue54.h)(Typography_default, { variant: "body2" }, () => msg.message)
+                () => (0, import_vue49.h)(Typography_default, { variant: "body2" }, () => msg.message)
               )
             )
           ]
         ),
         // Render flow components
-        (0, import_vue54.h)("div", { class: (0, import_browser40.withVendorCSSClassPrefix)("signin__content") }, renderComponents())
+        (0, import_vue49.h)("div", { class: (0, import_browser40.withVendorCSSClassPrefix)("signin__content") }, renderComponents())
       ]);
     };
   }
@@ -7757,10 +7962,10 @@ var handlePasskeyAuthentication = async (challengeData) => {
   }
 };
 
-// src/components/presentation/sign-in/v2/SignIn.ts
+// src/components/auth/sign-in/v2/SignIn.ts
 var EXECUTION_ID_STORAGE_KEY = "asgardeo_execution_id";
 var AUTH_ID_STORAGE_KEY = "asgardeo_auth_id";
-var SignIn2 = (0, import_vue55.defineComponent)({
+var SignIn2 = (0, import_vue50.defineComponent)({
   emits: ["error", "success"],
   name: "SignIn",
   props: {
@@ -7778,14 +7983,14 @@ var SignIn2 = (0, import_vue55.defineComponent)({
     const { applicationId, afterSignInUrl, signIn, isInitialized, isLoading: sdkLoading } = useAsgardeo_default();
     const { meta: flowMeta } = useFlowMeta_default();
     const { t } = useI18n_default();
-    const components = (0, import_vue55.ref)([]);
-    const additionalData = (0, import_vue55.ref)({});
-    const currentExecutionId = (0, import_vue55.ref)(null);
-    const isFlowInitialized = (0, import_vue55.ref)(false);
-    const flowError = (0, import_vue55.ref)(null);
-    const isSubmitting = (0, import_vue55.ref)(false);
-    const isTimeoutDisabled = (0, import_vue55.ref)(false);
-    const passkeyState = (0, import_vue55.ref)({
+    const components = (0, import_vue50.ref)([]);
+    const additionalData = (0, import_vue50.ref)({});
+    const currentExecutionId = (0, import_vue50.ref)(null);
+    const isFlowInitialized = (0, import_vue50.ref)(false);
+    const flowError = (0, import_vue50.ref)(null);
+    const isSubmitting = (0, import_vue50.ref)(false);
+    const isTimeoutDisabled = (0, import_vue50.ref)(false);
+    const passkeyState = (0, import_vue50.ref)({
       actionId: null,
       challenge: null,
       creationOptions: null,
@@ -8044,16 +8249,16 @@ var SignIn2 = (0, import_vue55.defineComponent)({
         setError(new Error(t("errors.signin.timeout") || "Time allowed to complete the step has expired."));
       }, remaining * 1e3);
     };
-    (0, import_vue55.watch)(
+    (0, import_vue50.watch)(
       () => [additionalData.value?.["stepTimeout"], isFlowInitialized.value],
       ([timeoutMs]) => {
         scheduleTimeout(Number(timeoutMs) || 0);
       }
     );
-    (0, import_vue55.onUnmounted)(() => {
+    (0, import_vue50.onUnmounted)(() => {
       if (timeoutHandle) clearTimeout(timeoutHandle);
     });
-    (0, import_vue55.watch)(
+    (0, import_vue50.watch)(
       () => passkeyState.value,
       async (state) => {
         if (!state.isActive || !state.challenge && !state.creationOptions || !state.executionId) return;
@@ -8115,13 +8320,13 @@ var SignIn2 = (0, import_vue55.defineComponent)({
       processedFlag: oauthCodeProcessedFlag,
       setExecutionId: persistExecutionId
     });
-    (0, import_vue55.onMounted)(() => {
+    (0, import_vue50.onMounted)(() => {
       const urlParams = getUrlParams2();
       if (urlParams.authId) {
         sessionStorage.setItem(AUTH_ID_STORAGE_KEY, urlParams.authId);
       }
     });
-    (0, import_vue55.watch)(
+    (0, import_vue50.watch)(
       () => [
         isInitialized.value,
         sdkLoading.value,
@@ -8153,9 +8358,9 @@ var SignIn2 = (0, import_vue55.defineComponent)({
           meta: flowMeta.value,
           onSubmit: handleSubmit
         };
-        return (0, import_vue55.h)("div", {}, slots["default"](renderProps));
+        return (0, import_vue50.h)("div", {}, slots["default"](renderProps));
       }
-      return (0, import_vue55.h)(BaseSignIn_default2, {
+      return (0, import_vue50.h)(BaseSignIn_default2, {
         ...attrs,
         additionalData: additionalData.value,
         class: props.className,
@@ -8173,8 +8378,8 @@ var SignIn2 = (0, import_vue55.defineComponent)({
 });
 var SignIn_default2 = SignIn2;
 
-// src/components/presentation/sign-in/SignIn.ts
-var SignIn3 = (0, import_vue56.defineComponent)({
+// src/components/auth/sign-in/SignIn.ts
+var SignIn3 = (0, import_vue51.defineComponent)({
   emits: ["error", "success"],
   name: "SignIn",
   props: {
@@ -8192,7 +8397,7 @@ var SignIn3 = (0, import_vue56.defineComponent)({
     const { platform } = useAsgardeo_default();
     return () => {
       if (platform === import_browser44.Platform.AsgardeoV2) {
-        return (0, import_vue56.h)(
+        return (0, import_vue51.h)(
           SignIn_default2,
           {
             ...attrs,
@@ -8205,7 +8410,7 @@ var SignIn3 = (0, import_vue56.defineComponent)({
           slots
         );
       }
-      return (0, import_vue56.h)(
+      return (0, import_vue51.h)(
         SignIn_default,
         {
           ...attrs,
@@ -8222,39 +8427,39 @@ var SignIn3 = (0, import_vue56.defineComponent)({
 });
 var SignIn_default3 = SignIn3;
 
-// src/components/presentation/sign-in/BaseSignIn.ts
+// src/components/auth/sign-in/BaseSignIn.ts
 var import_browser45 = require("@asgardeo/browser");
-var import_vue57 = require("vue");
-var BaseSignIn3 = (0, import_vue57.defineComponent)({
+var import_vue52 = require("vue");
+var BaseSignIn3 = (0, import_vue52.defineComponent)({
   inheritAttrs: false,
   name: "BaseSignIn",
   setup(_props, { attrs, slots }) {
     const { platform } = useAsgardeo_default();
     return () => {
       if (platform === import_browser45.Platform.AsgardeoV2) {
-        return (0, import_vue57.h)(BaseSignIn_default2, { ...attrs }, slots);
+        return (0, import_vue52.h)(BaseSignIn_default2, { ...attrs }, slots);
       }
-      return (0, import_vue57.h)(BaseSignIn_default, { ...attrs }, slots);
+      return (0, import_vue52.h)(BaseSignIn_default, { ...attrs }, slots);
     };
   }
 });
 var BaseSignIn_default3 = BaseSignIn3;
 
-// src/components/presentation/sign-up/SignUp.ts
+// src/components/auth/sign-up/SignUp.ts
 var import_browser51 = require("@asgardeo/browser");
-var import_vue63 = require("vue");
+var import_vue58 = require("vue");
 
-// src/components/presentation/sign-up/v1/SignUp.ts
+// src/components/auth/sign-up/v1/SignUp.ts
 var import_browser48 = require("@asgardeo/browser");
-var import_vue60 = require("vue");
+var import_vue55 = require("vue");
 
-// src/components/presentation/sign-up/v1/BaseSignUp.ts
+// src/components/auth/sign-up/v1/BaseSignUp.ts
 var import_browser47 = require("@asgardeo/browser");
-var import_vue59 = require("vue");
+var import_vue54 = require("vue");
 
-// src/components/presentation/sign-up/v1/options/SignUpOptionFactory.ts
+// src/components/auth/sign-up/v1/options/SignUpOptionFactory.ts
 var import_browser46 = require("@asgardeo/browser");
-var import_vue58 = require("vue");
+var import_vue53 = require("vue");
 var getInputName = (component) => {
   const cfg = component.config || {};
   return cfg.name || cfg.identifier || component.id;
@@ -8322,7 +8527,7 @@ var createSignUpComponent = (props) => {
   switch (component.type) {
     case import_browser46.EmbeddedFlowComponentType.Typography: {
       const text = String(cfg.text || cfg.label || "");
-      return (0, import_vue58.h)(
+      return (0, import_vue53.h)(
         Typography_default,
         { style: "margin-bottom:0.5rem", variant: inferTypographyVariant(component) },
         { default: () => text }
@@ -8354,18 +8559,18 @@ var createSignUpComponent = (props) => {
       const isPrimary = variant === "PRIMARY";
       const handleClick = () => onSubmit(component, void 0);
       if (matchesSocialProvider2(component, "google")) {
-        return (0, import_vue58.h)(GoogleButton_default, { class: buttonClassName, isLoading, onClick: handleClick });
+        return (0, import_vue53.h)(GoogleButton_default, { class: buttonClassName, isLoading, onClick: handleClick });
       }
       if (matchesSocialProvider2(component, "github")) {
-        return (0, import_vue58.h)(GitHubButton_default, { class: buttonClassName, isLoading, onClick: handleClick });
+        return (0, import_vue53.h)(GitHubButton_default, { class: buttonClassName, isLoading, onClick: handleClick });
       }
       if (matchesSocialProvider2(component, "microsoft")) {
-        return (0, import_vue58.h)(MicrosoftButton_default, { class: buttonClassName, isLoading, onClick: handleClick });
+        return (0, import_vue53.h)(MicrosoftButton_default, { class: buttonClassName, isLoading, onClick: handleClick });
       }
       if (matchesSocialProvider2(component, "facebook")) {
-        return (0, import_vue58.h)(FacebookButton_default, { class: buttonClassName, isLoading, onClick: handleClick });
+        return (0, import_vue53.h)(FacebookButton_default, { class: buttonClassName, isLoading, onClick: handleClick });
       }
-      return (0, import_vue58.h)(
+      return (0, import_vue53.h)(
         Button_default,
         {
           class: buttonClassName,
@@ -8393,7 +8598,7 @@ var createSignUpComponent = (props) => {
       return nodes;
     }
     case import_browser46.EmbeddedFlowComponentType.Divider: {
-      return (0, import_vue58.h)("hr", {
+      return (0, import_vue53.h)("hr", {
         class: "asgardeo-signup__divider",
         style: "margin:0.75rem 0;border:0;border-top:1px solid #e5e7eb"
       });
@@ -8402,12 +8607,12 @@ var createSignUpComponent = (props) => {
       const src = String(cfg.src || cfg.url || "");
       const alt = String(cfg.alt || "");
       if (!src) return null;
-      return (0, import_vue58.h)("img", { alt, src, style: "max-width:100%;height:auto;display:block;margin:0.5rem auto" });
+      return (0, import_vue53.h)("img", { alt, src, style: "max-width:100%;height:auto;display:block;margin:0.5rem auto" });
     }
     default: {
       if (String(component.type).toUpperCase() === "RICH_TEXT") {
         const html = String(cfg.text || cfg.label || "");
-        return (0, import_vue58.h)("div", { class: "asgardeo-signup__rich-text", innerHTML: html });
+        return (0, import_vue53.h)("div", { class: "asgardeo-signup__rich-text", innerHTML: html });
       }
       return null;
     }
@@ -8436,9 +8641,9 @@ var renderSignUpComponents2 = (components, formValues, touchedFields, formErrors
   return result;
 };
 
-// src/components/presentation/sign-up/v1/BaseSignUp.ts
+// src/components/auth/sign-up/v1/BaseSignUp.ts
 var logger6 = createVueLogger("BaseSignUpV1");
-var BaseSignUp = (0, import_vue59.defineComponent)({
+var BaseSignUp = (0, import_vue54.defineComponent)({
   emits: ["error", "flowChange", "complete"],
   name: "BaseSignUpV1",
   props: {
@@ -8473,12 +8678,12 @@ var BaseSignUp = (0, import_vue59.defineComponent)({
   setup(props, { slots, emit }) {
     const { t } = useI18n_default();
     const { title: flowTitle, subtitle: flowSubtitle, messages: flowMessages, addMessage, clearMessages } = useFlow_default();
-    const isLoading = (0, import_vue59.ref)(false);
-    const isFlowInitialized = (0, import_vue59.ref)(false);
-    const currentFlow = (0, import_vue59.ref)(null);
-    const formValues = (0, import_vue59.ref)({});
-    const touchedFields = (0, import_vue59.ref)({});
-    const formErrors = (0, import_vue59.ref)({});
+    const isLoading = (0, import_vue54.ref)(false);
+    const isFlowInitialized = (0, import_vue54.ref)(false);
+    const currentFlow = (0, import_vue54.ref)(null);
+    const formValues = (0, import_vue54.ref)({});
+    const touchedFields = (0, import_vue54.ref)({});
+    const formErrors = (0, import_vue54.ref)({});
     let initializationAttempted = false;
     const handleError = (err) => {
       let errorMessage = t("errors.signup.flow.failure") || "Sign-up failed";
@@ -8668,7 +8873,7 @@ var BaseSignUp = (0, import_vue59.defineComponent)({
         isLoading.value = false;
       }
     };
-    (0, import_vue59.watch)(
+    (0, import_vue54.watch)(
       () => [props.isInitialized, isFlowInitialized.value],
       ([initialized, flowInit]) => {
         if (!initialized || flowInit || initializationAttempted) return;
@@ -8723,20 +8928,20 @@ var BaseSignUp = (0, import_vue59.defineComponent)({
           touched: touchedFields.value,
           values: formValues.value
         };
-        return (0, import_vue59.h)("div", { class: containerClass }, slots["default"](renderProps));
+        return (0, import_vue54.h)("div", { class: containerClass }, slots["default"](renderProps));
       }
       if (!isFlowInitialized.value && isLoading.value) {
-        return (0, import_vue59.h)(
+        return (0, import_vue54.h)(
           Card_default,
           { class: containerClass, variant: props.variant },
-          () => (0, import_vue59.h)("div", { style: "display:flex;justify-content:center;padding:2rem" }, (0, import_vue59.h)(Spinner_default))
+          () => (0, import_vue54.h)("div", { style: "display:flex;justify-content:center;padding:2rem" }, (0, import_vue54.h)(Spinner_default))
         );
       }
       if (!currentFlow.value) {
-        return (0, import_vue59.h)(
+        return (0, import_vue54.h)(
           Card_default,
           { class: containerClass, variant: props.variant },
-          () => (0, import_vue59.h)(
+          () => (0, import_vue54.h)(
             Alert_default,
             { variant: "error" },
             () => t("errors.signup.flow.initialization.failure") || "Failed to initialize sign-up flow"
@@ -8761,33 +8966,33 @@ var BaseSignUp = (0, import_vue59.defineComponent)({
       );
       const cardChildren = [];
       if (props.showLogo) {
-        cardChildren.push((0, import_vue59.h)("div", { style: "display:flex;justify-content:center;margin-bottom:1rem" }, [(0, import_vue59.h)(Logo_default)]));
+        cardChildren.push((0, import_vue54.h)("div", { style: "display:flex;justify-content:center;margin-bottom:1rem" }, [(0, import_vue54.h)(Logo_default)]));
       }
       if (props.showTitle || props.showSubtitle) {
         const headerChildren = [];
         if (props.showTitle) {
           headerChildren.push(
-            (0, import_vue59.h)(Typography_default, { variant: "h2" }, { default: () => flowTitle.value || t("signup.heading") || "Sign Up" })
+            (0, import_vue54.h)(Typography_default, { variant: "h2" }, { default: () => flowTitle.value || t("signup.heading") || "Sign Up" })
           );
         }
         if (props.showSubtitle) {
           headerChildren.push(
-            (0, import_vue59.h)(
+            (0, import_vue54.h)(
               Typography_default,
               { variant: "body1" },
               { default: () => flowSubtitle.value || t("signup.subheading") || "Create your account" }
             )
           );
         }
-        cardChildren.push((0, import_vue59.h)("div", { style: "padding: 0 1rem 1rem" }, headerChildren));
+        cardChildren.push((0, import_vue54.h)("div", { style: "padding: 0 1rem 1rem" }, headerChildren));
       }
       if (flowMessages.value && flowMessages.value.length > 0) {
         cardChildren.push(
-          (0, import_vue59.h)(
+          (0, import_vue54.h)(
             "div",
             { style: "padding: 0 1rem" },
             flowMessages.value.map(
-              (msg, i) => (0, import_vue59.h)(
+              (msg, i) => (0, import_vue54.h)(
                 Alert_default,
                 {
                   class: props.messageClassName,
@@ -8801,7 +9006,7 @@ var BaseSignUp = (0, import_vue59.defineComponent)({
         );
       }
       cardChildren.push(
-        (0, import_vue59.h)(
+        (0, import_vue54.h)(
           "form",
           {
             class: (0, import_browser47.withVendorCSSClassPrefix)("signup__form"),
@@ -8812,7 +9017,7 @@ var BaseSignUp = (0, import_vue59.defineComponent)({
             style: "padding: 1rem;display:flex;flex-direction:column;gap:0.75rem"
           },
           rendered.length > 0 ? rendered : [
-            (0, import_vue59.h)(
+            (0, import_vue54.h)(
               Alert_default,
               { variant: "warning" },
               () => t("errors.signup.components.not.available") || "No components available"
@@ -8820,14 +9025,14 @@ var BaseSignUp = (0, import_vue59.defineComponent)({
           ]
         )
       );
-      return (0, import_vue59.h)(Card_default, { class: containerClass, variant: props.variant }, () => cardChildren);
+      return (0, import_vue54.h)(Card_default, { class: containerClass, variant: props.variant }, () => cardChildren);
     };
   }
 });
 var BaseSignUp_default = BaseSignUp;
 
-// src/components/presentation/sign-up/v1/SignUp.ts
-var SignUp = (0, import_vue60.defineComponent)({
+// src/components/auth/sign-up/v1/SignUp.ts
+var SignUp = (0, import_vue55.defineComponent)({
   name: "SignUpV1",
   props: {
     afterSignUpUrl: { default: void 0, type: String },
@@ -8871,7 +9076,7 @@ var SignUp = (0, import_vue60.defineComponent)({
         }
       }
     };
-    return () => (0, import_vue60.h)(
+    return () => (0, import_vue55.h)(
       BaseSignUp_default,
       {
         afterSignUpUrl: props.afterSignUpUrl,
@@ -8896,13 +9101,13 @@ var SignUp = (0, import_vue60.defineComponent)({
 });
 var SignUp_default = SignUp;
 
-// src/components/presentation/sign-up/v2/SignUp.ts
+// src/components/auth/sign-up/v2/SignUp.ts
 var import_browser50 = require("@asgardeo/browser");
-var import_vue62 = require("vue");
+var import_vue57 = require("vue");
 
-// src/components/presentation/sign-up/v2/BaseSignUp.ts
+// src/components/auth/sign-up/v2/BaseSignUp.ts
 var import_browser49 = require("@asgardeo/browser");
-var import_vue61 = require("vue");
+var import_vue56 = require("vue");
 
 // src/utils/v2/getAuthComponentHeadings.ts
 var getAuthComponentHeadings = (components, flowTitle, flowSubtitle, defaultTitle, defaultSubtitle) => {
@@ -8965,7 +9170,7 @@ var getAuthComponentHeadings = (components, flowTitle, flowSubtitle, defaultTitl
 };
 var getAuthComponentHeadings_default = getAuthComponentHeadings;
 
-// src/components/presentation/sign-up/v2/BaseSignUp.ts
+// src/components/auth/sign-up/v2/BaseSignUp.ts
 var logger7 = createVueLogger("BaseSignUp");
 var extractFormFields2 = (components) => {
   const fields = [];
@@ -8983,7 +9188,7 @@ var extractFormFields2 = (components) => {
   process(components);
   return fields;
 };
-var BaseSignUp2 = (0, import_vue61.defineComponent)({
+var BaseSignUp2 = (0, import_vue56.defineComponent)({
   emits: ["error", "complete", "flowChange"],
   name: "BaseSignUp",
   props: {
@@ -9023,22 +9228,22 @@ var BaseSignUp2 = (0, import_vue61.defineComponent)({
   setup(props, { slots }) {
     const { meta: flowMetaRef } = useFlowMeta_default();
     const { t } = useI18n_default();
-    const isLoading = (0, import_vue61.ref)(false);
-    const isFlowInitialized = (0, import_vue61.ref)(false);
-    const currentFlow = (0, import_vue61.ref)(null);
-    const apiError = (0, import_vue61.ref)(null);
-    const flowMessages = (0, import_vue61.ref)([]);
-    const passkeyState = (0, import_vue61.ref)({
+    const isLoading = (0, import_vue56.ref)(false);
+    const isFlowInitialized = (0, import_vue56.ref)(false);
+    const currentFlow = (0, import_vue56.ref)(null);
+    const apiError = (0, import_vue56.ref)(null);
+    const flowMessages = (0, import_vue56.ref)([]);
+    const passkeyState = (0, import_vue56.ref)({
       actionId: null,
       creationOptions: null,
       error: null,
       flowId: null,
       isActive: false
     });
-    const formValues = (0, import_vue61.ref)({});
-    const touchedFields = (0, import_vue61.ref)({});
-    const formErrors = (0, import_vue61.ref)({});
-    const isFormValid = (0, import_vue61.ref)(true);
+    const formValues = (0, import_vue56.ref)({});
+    const touchedFields = (0, import_vue56.ref)({});
+    const formErrors = (0, import_vue56.ref)({});
+    const isFormValid = (0, import_vue56.ref)(true);
     let initializationAttempted = false;
     let passkeyProcessed = false;
     const handleError = (error) => {
@@ -9255,7 +9460,7 @@ var BaseSignUp2 = (0, import_vue61.defineComponent)({
         isLoading.value = false;
       }
     };
-    (0, import_vue61.watch)(
+    (0, import_vue56.watch)(
       () => passkeyState.value,
       async (state) => {
         if (!state.isActive || !state.creationOptions || !state.flowId) return;
@@ -9293,7 +9498,7 @@ var BaseSignUp2 = (0, import_vue61.defineComponent)({
       },
       { deep: true }
     );
-    (0, import_vue61.watch)(
+    (0, import_vue56.watch)(
       () => [props.isInitialized, isFlowInitialized.value],
       ([initialized, flowInit]) => {
         const urlParams = new URL(window.location.href).searchParams;
@@ -9354,20 +9559,20 @@ var BaseSignUp2 = (0, import_vue61.defineComponent)({
           },
           values: formValues.value
         };
-        return (0, import_vue61.h)("div", { class: containerClass }, slots["default"](renderProps));
+        return (0, import_vue56.h)("div", { class: containerClass }, slots["default"](renderProps));
       }
       if (!isFlowInitialized.value && isLoading.value) {
-        return (0, import_vue61.h)(
+        return (0, import_vue56.h)(
           Card_default,
           { class: containerClass, variant: props.variant },
-          () => (0, import_vue61.h)("div", { style: "display:flex;justify-content:center;padding:2rem" }, (0, import_vue61.h)(Spinner_default))
+          () => (0, import_vue56.h)("div", { style: "display:flex;justify-content:center;padding:2rem" }, (0, import_vue56.h)(Spinner_default))
         );
       }
       if (!currentFlow.value) {
-        return (0, import_vue61.h)(
+        return (0, import_vue56.h)(
           Card_default,
           { class: containerClass, variant: props.variant },
-          () => (0, import_vue61.h)(
+          () => (0, import_vue56.h)(
             Alert_default,
             { variant: "error" },
             () => t("errors.signup.flow.initialization.failure") || "Failed to initialize sign-up flow"
@@ -9402,32 +9607,32 @@ var BaseSignUp2 = (0, import_vue61.defineComponent)({
           variant: props.variant
         }
       ) : [];
-      return (0, import_vue61.h)(Card_default, { class: containerClass, variant: props.variant }, () => [
+      return (0, import_vue56.h)(Card_default, { class: containerClass, variant: props.variant }, () => [
         // Header with title/subtitle
-        props.showTitle || props.showSubtitle ? (0, import_vue61.h)("div", { style: "padding: 1rem 1rem 0" }, [
-          props.showTitle ? (0, import_vue61.h)(Typography_default, { variant: "h5" }, () => title) : null,
-          props.showSubtitle ? (0, import_vue61.h)(Typography_default, { style: "margin-top: 0.25rem", variant: "body1" }, () => subtitle) : null
+        props.showTitle || props.showSubtitle ? (0, import_vue56.h)("div", { style: "padding: 1rem 1rem 0" }, [
+          props.showTitle ? (0, import_vue56.h)(Typography_default, { variant: "h5" }, () => title) : null,
+          props.showSubtitle ? (0, import_vue56.h)(Typography_default, { style: "margin-top: 0.25rem", variant: "body1" }, () => subtitle) : null
         ]) : null,
         // External error
-        props.error ? (0, import_vue61.h)(
+        props.error ? (0, import_vue56.h)(
           "div",
           { style: "padding: 0 1rem" },
-          (0, import_vue61.h)(Alert_default, { variant: "error" }, () => props.error.message)
+          (0, import_vue56.h)(Alert_default, { variant: "error" }, () => props.error.message)
         ) : null,
         // Flow messages
-        flowMessages.value.length > 0 ? (0, import_vue61.h)(
+        flowMessages.value.length > 0 ? (0, import_vue56.h)(
           "div",
           { style: "padding: 0 1rem" },
           flowMessages.value.map(
-            (msg, i) => (0, import_vue61.h)(Alert_default, { key: i, variant: msg.type === "error" ? "error" : "info" }, () => msg.message)
+            (msg, i) => (0, import_vue56.h)(Alert_default, { key: i, variant: msg.type === "error" ? "error" : "info" }, () => msg.message)
           )
         ) : null,
         // Components
-        (0, import_vue61.h)(
+        (0, import_vue56.h)(
           "div",
           { style: "padding: 1rem" },
           renderedComponents.length > 0 ? renderedComponents : [
-            (0, import_vue61.h)(
+            (0, import_vue56.h)(
               Alert_default,
               { variant: "warning" },
               () => t("errors.signup.components.not.available") || "No components available"
@@ -9440,8 +9645,8 @@ var BaseSignUp2 = (0, import_vue61.defineComponent)({
 });
 var BaseSignUp_default2 = BaseSignUp2;
 
-// src/components/presentation/sign-up/v2/SignUp.ts
-var SignUp2 = (0, import_vue62.defineComponent)({
+// src/components/auth/sign-up/v2/SignUp.ts
+var SignUp2 = (0, import_vue57.defineComponent)({
   name: "SignUp",
   props: {
     afterSignUpUrl: { default: void 0, type: String },
@@ -9485,7 +9690,7 @@ var SignUp2 = (0, import_vue62.defineComponent)({
         window.location.href = response.data.redirectURL;
       }
     };
-    return () => (0, import_vue62.h)(
+    return () => (0, import_vue57.h)(
       BaseSignUp_default2,
       {
         afterSignUpUrl: props.afterSignUpUrl,
@@ -9510,75 +9715,237 @@ var SignUp2 = (0, import_vue62.defineComponent)({
 });
 var SignUp_default2 = SignUp2;
 
-// src/components/presentation/sign-up/SignUp.ts
-var SignUp3 = (0, import_vue63.defineComponent)({
+// src/components/auth/sign-up/SignUp.ts
+var SignUp3 = (0, import_vue58.defineComponent)({
   inheritAttrs: false,
   name: "SignUp",
   setup(_props, { attrs, slots }) {
     const { platform } = useAsgardeo_default();
     return () => {
       if (platform === import_browser51.Platform.AsgardeoV2) {
-        return (0, import_vue63.h)(SignUp_default2, { ...attrs }, slots);
+        return (0, import_vue58.h)(SignUp_default2, { ...attrs }, slots);
       }
-      return (0, import_vue63.h)(SignUp_default, { ...attrs }, slots);
+      return (0, import_vue58.h)(SignUp_default, { ...attrs }, slots);
     };
   }
 });
 var SignUp_default3 = SignUp3;
 
-// src/components/presentation/sign-up/BaseSignUp.ts
+// src/components/auth/sign-up/BaseSignUp.ts
 var import_browser52 = require("@asgardeo/browser");
-var import_vue64 = require("vue");
-var BaseSignUp3 = (0, import_vue64.defineComponent)({
+var import_vue59 = require("vue");
+var BaseSignUp3 = (0, import_vue59.defineComponent)({
   inheritAttrs: false,
   name: "BaseSignUp",
   setup(_props, { attrs, slots }) {
     const { platform } = useAsgardeo_default();
     return () => {
       if (platform === import_browser52.Platform.AsgardeoV2) {
-        return (0, import_vue64.h)(BaseSignUp_default2, { ...attrs }, slots);
+        return (0, import_vue59.h)(BaseSignUp_default2, { ...attrs }, slots);
       }
-      return (0, import_vue64.h)(BaseSignUp_default, { ...attrs }, slots);
+      return (0, import_vue59.h)(BaseSignUp_default, { ...attrs }, slots);
     };
   }
 });
 var BaseSignUp_default3 = BaseSignUp3;
 
+// src/components/control/SignedIn.ts
+var import_vue60 = require("vue");
+var SignedIn = (0, import_vue60.defineComponent)({
+  name: "SignedIn",
+  setup(_props, { slots }) {
+    const { isSignedIn } = useAsgardeo_default();
+    return () => {
+      if (!isSignedIn.value) {
+        const fallbackContent = slots["fallback"]?.();
+        return fallbackContent ? (0, import_vue60.h)(import_vue60.Fragment, {}, fallbackContent) : null;
+      }
+      const defaultContent = slots["default"]?.();
+      return defaultContent ? (0, import_vue60.h)(import_vue60.Fragment, {}, defaultContent) : null;
+    };
+  }
+});
+var SignedIn_default = SignedIn;
+
+// src/components/control/SignedOut.ts
+var import_vue61 = require("vue");
+var SignedOut = (0, import_vue61.defineComponent)({
+  name: "SignedOut",
+  setup(_props, { slots }) {
+    const { isSignedIn } = useAsgardeo_default();
+    return () => {
+      if (isSignedIn.value) {
+        const fallbackContent = slots["fallback"]?.();
+        return fallbackContent ? (0, import_vue61.h)(import_vue61.Fragment, {}, fallbackContent) : null;
+      }
+      const defaultContent = slots["default"]?.();
+      return defaultContent ? (0, import_vue61.h)(import_vue61.Fragment, {}, defaultContent) : null;
+    };
+  }
+});
+var SignedOut_default = SignedOut;
+
+// src/components/control/Loading.ts
+var import_vue62 = require("vue");
+var Loading = (0, import_vue62.defineComponent)({
+  name: "Loading",
+  setup(_props, { slots }) {
+    const { isLoading } = useAsgardeo_default();
+    return () => {
+      if (!isLoading.value) {
+        const fallbackContent = slots["fallback"]?.();
+        return fallbackContent ? (0, import_vue62.h)(import_vue62.Fragment, {}, fallbackContent) : null;
+      }
+      const defaultContent = slots["default"]?.();
+      return defaultContent ? (0, import_vue62.h)(import_vue62.Fragment, {}, defaultContent) : null;
+    };
+  }
+});
+var Loading_default = Loading;
+
+// src/components/presentation/user/User.ts
+var import_vue63 = require("vue");
+var User5 = (0, import_vue63.defineComponent)({
+  name: "User",
+  setup(_props, { slots }) {
+    const { user } = useAsgardeo_default();
+    return () => {
+      if (!user.value) {
+        const fallbackContent = slots["fallback"]?.();
+        return fallbackContent ? (0, import_vue63.h)(import_vue63.Fragment, {}, fallbackContent) : null;
+      }
+      const defaultContent = slots["default"]?.({ user: user.value });
+      return defaultContent ? (0, import_vue63.h)(import_vue63.Fragment, {}, defaultContent) : null;
+    };
+  }
+});
+var User_default = User5;
+
+// src/components/presentation/organization/Organization.ts
+var import_vue64 = require("vue");
+var Organization5 = (0, import_vue64.defineComponent)({
+  name: "Organization",
+  setup(_props, { slots }) {
+    const { currentOrganization } = useOrganization_default();
+    return () => {
+      if (!currentOrganization?.value) {
+        const fallbackContent = slots["fallback"]?.();
+        return fallbackContent ? (0, import_vue64.h)(import_vue64.Fragment, {}, fallbackContent) : null;
+      }
+      const defaultContent = slots["default"]?.({ organization: currentOrganization.value });
+      return defaultContent ? (0, import_vue64.h)(import_vue64.Fragment, {}, defaultContent) : null;
+    };
+  }
+});
+var Organization_default = Organization5;
+
 // src/components/presentation/user-profile/UserProfile.ts
-var import_browser54 = require("@asgardeo/browser");
+var import_browser56 = require("@asgardeo/browser");
 var import_vue66 = require("vue");
 
 // src/components/presentation/user-profile/BaseUserProfile.ts
-var import_browser53 = require("@asgardeo/browser");
+var import_browser54 = require("@asgardeo/browser");
 var import_vue65 = require("vue");
-var PROFILE_FIELD_DESCRIPTORS = [
-  { keys: ["userName", "username"], label: "Username", readonly: true },
-  { keys: ["name.givenName", "firstName", "givenName"], label: "First Name", readonly: false },
-  { keys: ["name.familyName", "lastName", "familyName"], label: "Last Name", readonly: false },
-  { keys: ["emails", "email"], label: "Email", readonly: true },
-  { keys: ["country"], label: "Country", readonly: false },
-  { keys: ["dateOfBirth", "birthdate", "birthDate"], label: "Birth Date", readonly: false },
-  { keys: ["phoneNumbers.mobile", "mobile", "mobileNumbers"], label: "Mobile", readonly: false }
-];
-var CORE_USER_SCHEMA_ID = import_browser53.WellKnownSchemaIds.User;
-var setNestedPath = (target, segments, value) => {
-  let cursor = target;
-  for (let i = 0; i < segments.length - 1; i += 1) {
-    const segment = segments[i];
-    if (typeof cursor[segment] !== "object" || cursor[segment] === null) {
-      cursor[segment] = {};
-    }
-    cursor = cursor[segment];
+
+// src/utils/getMappedUserProfileValue.ts
+var import_browser53 = require("@asgardeo/browser");
+var getMappedUserProfileValue = (key, mappings, user) => {
+  if (!key || !mappings || !user) return void 0;
+  const mapping = mappings[key];
+  if (!mapping) return (0, import_browser53.get)(user, key);
+  if (Array.isArray(mapping)) {
+    let foundValue;
+    let found = false;
+    mapping.some((path) => {
+      const value = (0, import_browser53.get)(user, path);
+      if (value !== void 0 && value !== null && value !== "") {
+        foundValue = value;
+        found = true;
+        return true;
+      }
+      return false;
+    });
+    return found ? foundValue : void 0;
   }
-  cursor[segments[segments.length - 1]] = value;
+  return (0, import_browser53.get)(user, mapping);
+};
+var getMappedUserProfileValue_default = getMappedUserProfileValue;
+
+// src/utils/getDisplayName.ts
+var getDisplayName = (mergedMappings, user, displayAttributes) => {
+  if (displayAttributes && displayAttributes.length > 0) {
+    let foundValue;
+    displayAttributes.some((attr) => {
+      const value = getMappedUserProfileValue_default(attr, mergedMappings, user);
+      if (value !== void 0 && value !== null && value !== "") {
+        foundValue = String(value);
+        return true;
+      }
+      return false;
+    });
+    if (foundValue !== void 0) return foundValue;
+  }
+  const firstName = getMappedUserProfileValue_default("firstName", mergedMappings, user);
+  const lastName = getMappedUserProfileValue_default("lastName", mergedMappings, user);
+  if (firstName && lastName) return `${firstName} ${lastName}`;
+  return getMappedUserProfileValue_default("username", mergedMappings, user) || getMappedUserProfileValue_default("email", mergedMappings, user) || getMappedUserProfileValue_default("name", mergedMappings, user) || "User";
+};
+var getDisplayName_default = getDisplayName;
+
+// src/components/presentation/user-profile/BaseUserProfile.ts
+var FIELDS_TO_SKIP = [
+  "roles.default",
+  "active",
+  "groups",
+  "accountLocked",
+  "accountDisabled",
+  "oneTimePassword",
+  "userSourceId",
+  "idpType",
+  "localCredentialExists",
+  "ResourceType",
+  "ExternalID",
+  "MetaData",
+  "verifiedMobileNumbers",
+  "verifiedEmailAddresses",
+  "phoneNumbers.mobile",
+  "emailAddresses",
+  "preferredMFAOption"
+];
+var READONLY_FIELDS = ["username", "userName", "user_name"];
+var DEFAULT_ATTRIBUTE_MAPPINGS = {
+  email: ["emails", "email"],
+  firstName: ["name.givenName", "given_name"],
+  lastName: ["name.familyName", "family_name"],
+  picture: ["profile", "profileUrl", "picture", "URL"],
+  username: ["userName", "username", "user_name"]
 };
-var buildScimPatchValue = (flatKey, rawValue, schemas) => {
-  const list = schemas ?? [];
-  const entry = list.find((s) => s.name === flatKey);
+var AVATAR_GRADIENTS = [
+  "linear-gradient(135deg, #4b6ef5 0%, #7c3aed 100%)",
+  "linear-gradient(135deg, #0ea5e9 0%, #4b6ef5 100%)",
+  "linear-gradient(135deg, #10b981 0%, #0ea5e9 100%)",
+  "linear-gradient(135deg, #f59e0b 0%, #ef4444 100%)",
+  "linear-gradient(135deg, #ec4899 0%, #7c3aed 100%)",
+  "linear-gradient(135deg, #8b5cf6 0%, #4b6ef5 100%)",
+  "linear-gradient(135deg, #14b8a6 0%, #0ea5e9 100%)",
+  "linear-gradient(135deg, #f97316 0%, #ec4899 100%)"
+];
+function getAvatarGradient(seed) {
+  if (!seed) return AVATAR_GRADIENTS[0];
+  let hash = 0;
+  for (let i = 0; i < seed.length; i += 1) {
+    hash = hash * 31 + seed.charCodeAt(i) >>> 0;
+  }
+  return AVATAR_GRADIENTS[Math.abs(hash) % AVATAR_GRADIENTS.length];
+}
+function formatLabel(key) {
+  return key.split(/(?=[A-Z])|[_.]/).map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join(" ");
+}
+function buildScimPatchValue(flatKey, rawValue, schemaId, multiValued) {
   if (flatKey === "phoneNumbers.mobile") {
     return {
       phoneNumbers: [{ type: "mobile", value: rawValue }],
-      [import_browser53.WellKnownSchemaIds.SystemUser]: { mobileNumbers: [rawValue] }
+      [import_browser54.WellKnownSchemaIds.SystemUser]: { mobileNumbers: [rawValue] }
     };
   }
   const complexMultiValued = /* @__PURE__ */ new Set([
@@ -9599,240 +9966,359 @@ var buildScimPatchValue = (flatKey, rawValue, schemas) => {
       return { [head]: [{ type: tail, value: rawValue }] };
     }
   }
-  const value = entry?.multiValued ? [rawValue] : rawValue;
+  const value = multiValued ? [rawValue] : rawValue;
+  if (schemaId && schemaId !== import_browser54.WellKnownSchemaIds.User) {
+    return { [schemaId]: { [flatKey]: value } };
+  }
   const segments = flatKey.split(".");
   const nested = {};
-  setNestedPath(nested, segments, value);
-  const schemaId = entry?.schemaId;
-  if (schemaId && schemaId !== CORE_USER_SCHEMA_ID) {
-    return { [schemaId]: nested };
+  let cursor = nested;
+  for (let i = 0; i < segments.length - 1; i += 1) {
+    cursor[segments[i]] = {};
+    cursor = cursor[segments[i]];
   }
+  cursor[segments[segments.length - 1]] = value;
   return nested;
-};
-var AVATAR_GRADIENTS = [
-  "linear-gradient(135deg, #a855f7 0%, #ec4899 100%)",
-  "linear-gradient(135deg, #3b82f6 0%, #06b6d4 100%)",
-  "linear-gradient(135deg, #22c55e 0%, #10b981 100%)",
-  "linear-gradient(135deg, #f59e0b 0%, #ef4444 100%)",
-  "linear-gradient(135deg, #ec4899 0%, #f43f5e 100%)",
-  "linear-gradient(135deg, #8b5cf6 0%, #6366f1 100%)",
-  "linear-gradient(135deg, #14b8a6 0%, #0ea5e9 100%)",
-  "linear-gradient(135deg, #f97316 0%, #eab308 100%)"
-];
-var getAvatarGradient = (seed) => {
-  if (!seed) return AVATAR_GRADIENTS[0];
-  let hash = 0;
-  for (let i = 0; i < seed.length; i += 1) {
-    const char = seed.charCodeAt(i);
-    hash = hash * 31 + char >>> 0;
-  }
-  return AVATAR_GRADIENTS[Math.abs(hash) % AVATAR_GRADIENTS.length];
-};
-var getUserInitials = (user) => {
-  if (!user) return "?";
-  const given = String(user["givenName"] || user["firstName"] || "");
-  const family = String(user["familyName"] || user["lastName"] || "");
-  if (given || family) return `${given.charAt(0)}${family.charAt(0)}`.toUpperCase();
-  const fallback = String(user["username"] || user["userName"] || user["email"] || user["sub"] || "");
-  return fallback.charAt(0).toUpperCase() || "?";
-};
+}
 var BaseUserProfile = (0, import_vue65.defineComponent)({
   inheritAttrs: false,
   name: "BaseUserProfile",
   props: {
+    /** Avatar circle size. */
+    avatarSize: {
+      default: "lg",
+      type: String
+    },
     cardLayout: { default: true, type: Boolean },
+    /** Shadow / border style of the Card wrapper. */
+    cardVariant: {
+      default: "elevated",
+      type: String
+    },
     className: { default: "", type: String },
+    /** Tighter field spacing for modal / dropdown contexts. */
+    compact: { default: false, type: Boolean },
     editable: { default: true, type: Boolean },
     error: { default: null, type: String },
     flattenedProfile: { default: null, type: Object },
     hideFields: { default: () => [], type: Array },
     isLoading: { default: false, type: Boolean },
-    onUpdate: {
-      default: void 0,
-      type: Function
-    },
+    onUpdate: { default: void 0, type: Function },
     profile: { default: null, type: Object },
     schemas: { default: () => [], type: Array },
+    /** Whether to render the avatar hero banner. */
+    showAvatar: { default: true, type: Boolean },
     showFields: { default: () => [], type: Array },
     title: { default: "Profile", type: String }
   },
   setup(props, { slots }) {
     const editingFields = (0, import_vue65.ref)({});
     const editedValues = (0, import_vue65.ref)({});
-    return () => {
-      if (slots["default"]) {
-        return slots["default"]({
-          error: props.error,
-          isLoading: props.isLoading,
-          profile: props.flattenedProfile || props.profile
-        });
+    const px = import_browser54.withVendorCSSClassPrefix;
+    function shouldShowField(fieldName) {
+      if (FIELDS_TO_SKIP.includes(fieldName)) return false;
+      if (props.hideFields && props.hideFields.length > 0 && props.hideFields.includes(fieldName)) return false;
+      if (props.showFields && props.showFields.length > 0) return props.showFields.includes(fieldName);
+      return true;
+    }
+    function startEditing(fieldName, currentValue) {
+      editedValues.value = { ...editedValues.value, [fieldName]: currentValue ?? "" };
+      editingFields.value = { ...editingFields.value, [fieldName]: true };
+    }
+    function cancelEditing(fieldName) {
+      const data = props.flattenedProfile || props.profile;
+      const originalValue = data?.[fieldName] ?? "";
+      editedValues.value = { ...editedValues.value, [fieldName]: originalValue };
+      editingFields.value = { ...editingFields.value, [fieldName]: false };
+    }
+    function saveField(schema) {
+      if (!props.onUpdate || !schema.name) return;
+      const value = editedValues.value[schema.name] ?? "";
+      const payload = buildScimPatchValue(
+        schema.name,
+        value,
+        schema.schemaId,
+        schema.multiValued
+      );
+      props.onUpdate(payload);
+      editingFields.value = { ...editingFields.value, [schema.name]: false };
+    }
+    function renderInput(schema) {
+      const fieldName = schema.name;
+      const currentValue = editedValues.value[fieldName];
+      switch (schema.type) {
+        case "DATE_TIME":
+          return (0, import_vue65.h)(DatePicker_default, {
+            modelValue: String(currentValue ?? ""),
+            "onUpdate:modelValue": (v) => {
+              editedValues.value = { ...editedValues.value, [fieldName]: v };
+            },
+            placeholder: `Enter your ${(schema.displayName || fieldName).toLowerCase()}`,
+            required: schema.required
+          });
+        case "BOOLEAN":
+          return (0, import_vue65.h)(Checkbox_default, {
+            label: schema.displayName || fieldName,
+            modelValue: Boolean(currentValue),
+            "onUpdate:modelValue": (v) => {
+              editedValues.value = { ...editedValues.value, [fieldName]: v };
+            }
+          });
+        default:
+          return (0, import_vue65.h)(TextField_default, {
+            modelValue: String(currentValue ?? ""),
+            "onUpdate:modelValue": (v) => {
+              editedValues.value = { ...editedValues.value, [fieldName]: v };
+            },
+            placeholder: `Enter your ${(schema.displayName || fieldName).toLowerCase()}`,
+            required: schema.required
+          });
       }
-      const prefix = import_browser53.withVendorCSSClassPrefix;
+    }
+    function renderSchemaFieldRow(schema) {
+      const { name, displayName, description, mutability, value } = schema;
+      if (!name || !shouldShowField(name)) return null;
+      const label = displayName || description || formatLabel(name);
+      const isReadonly = mutability === "READ_ONLY" || READONLY_FIELDS.includes(name);
+      const isEditable = Boolean(props.editable) && !isReadonly;
+      const isEditing = Boolean(editingFields.value[name]);
+      const hasValue = value !== void 0 && value !== null && value !== "";
+      if (!hasValue && !isEditing && !(isEditable && mutability === "READ_WRITE")) return null;
+      const editablePlaceholder = isEditable ? (0, import_vue65.h)(
+        "span",
+        { class: px("user-profile__field-placeholder"), onClick: () => startEditing(name, value) },
+        `Enter your ${label.toLowerCase()}`
+      ) : null;
+      const displayValueNode = hasValue ? (0, import_vue65.h)(Typography_default, { class: px("user-profile__field-value"), variant: "body1" }, () => String(value)) : editablePlaceholder;
+      return (0, import_vue65.h)("div", { class: px("user-profile__field"), key: name }, [
+        (0, import_vue65.h)("div", { class: px("user-profile__field-label-col") }, [
+          (0, import_vue65.h)(Typography_default, { class: px("user-profile__field-label"), variant: "body2" }, () => label)
+        ]),
+        (0, import_vue65.h)("div", { class: px("user-profile__field-value-col") }, [
+          isEditing ? (0, import_vue65.h)("div", { class: px("user-profile__field-edit") }, [
+            renderInput(schema),
+            (0, import_vue65.h)("div", { class: px("user-profile__field-edit-actions") }, [
+              (0, import_vue65.h)(
+                Button_default,
+                { onClick: () => saveField(schema), size: "small", variant: "solid" },
+                () => "Save"
+              ),
+              (0, import_vue65.h)(
+                Button_default,
+                { onClick: () => cancelEditing(name), size: "small", variant: "text" },
+                () => "Cancel"
+              )
+            ])
+          ]) : (0, import_vue65.h)("div", { class: px("user-profile__field-display") }, [
+            displayValueNode,
+            isEditable ? (0, import_vue65.h)(
+              "button",
+              {
+                "aria-label": `Edit ${label}`,
+                class: px("user-profile__field-edit-btn"),
+                onClick: () => startEditing(name, value),
+                type: "button"
+              },
+              [(0, import_vue65.h)(PencilIcon)]
+            ) : null
+          ])
+        ])
+      ]);
+    }
+    function renderProfileWithoutSchemas() {
       const data = props.flattenedProfile || props.profile;
-      const dataRecord = data;
-      const initials = getUserInitials(dataRecord);
+      if (!data) return [];
+      return Object.entries(data).filter(([key, value]) => {
+        if (!shouldShowField(key)) return false;
+        return value !== void 0 && value !== null && value !== "";
+      }).sort(([a], [b]) => a.localeCompare(b)).map(
+        ([key, value]) => (0, import_vue65.h)("div", { class: px("user-profile__field"), key }, [
+          (0, import_vue65.h)("div", { class: px("user-profile__field-label-col") }, [
+            (0, import_vue65.h)(Typography_default, { class: px("user-profile__field-label"), variant: "body2" }, () => formatLabel(key))
+          ]),
+          (0, import_vue65.h)("div", { class: px("user-profile__field-value-col") }, [
+            (0, import_vue65.h)(
+              Typography_default,
+              { class: px("user-profile__field-value"), variant: "body1" },
+              () => typeof value === "object" ? JSON.stringify(value) : String(value)
+            )
+          ])
+        ])
+      );
+    }
+    function renderHero(currentUser) {
+      const displayName = getDisplayName_default(DEFAULT_ATTRIBUTE_MAPPINGS, currentUser);
+      const email = getMappedUserProfileValue_default("email", DEFAULT_ATTRIBUTE_MAPPINGS, currentUser) || getMappedUserProfileValue_default("username", DEFAULT_ATTRIBUTE_MAPPINGS, currentUser);
       const avatarSeed = String(
-        (dataRecord && (dataRecord["username"] || dataRecord["userName"] || dataRecord["email"] || dataRecord["sub"])) ?? initials
+        currentUser["username"] || currentUser["userName"] || currentUser["email"] || currentUser["sub"] || displayName
       );
       const avatarGradient = getAvatarGradient(avatarSeed);
-      const children = [];
-      children.push(
-        (0, import_vue65.h)("div", { class: prefix("user-profile__header") }, [
-          (0, import_vue65.h)(Typography_default, { class: prefix("user-profile__title"), variant: "h5" }, () => props.title)
-        ])
-      );
-      children.push((0, import_vue65.h)(Divider_default, { class: prefix("user-profile__header-divider") }));
-      children.push(
-        (0, import_vue65.h)("div", { class: prefix("user-profile__avatar-section") }, [
+      const initials = displayName.split(" ").map((w) => w.charAt(0)).slice(0, 2).join("").toUpperCase() || "?";
+      const avatarSizeClass = px(`user-profile__avatar--${props.avatarSize ?? "lg"}`);
+      return (0, import_vue65.h)("div", { class: px("user-profile__hero") }, [
+        (0, import_vue65.h)("div", { class: px("user-profile__avatar-wrapper") }, [
           (0, import_vue65.h)(
             "div",
-            {
-              class: prefix("user-profile__avatar"),
-              style: { background: avatarGradient }
-            },
-            [(0, import_vue65.h)("span", { class: prefix("user-profile__avatar-initials") }, initials)]
+            { class: [px("user-profile__avatar"), avatarSizeClass].join(" "), style: { background: avatarGradient } },
+            [(0, import_vue65.h)("span", { class: px("user-profile__avatar-initials") }, initials)]
           )
+        ]),
+        (0, import_vue65.h)("div", { class: px("user-profile__hero-info") }, [
+          (0, import_vue65.h)("span", { class: px("user-profile__hero-name") }, displayName),
+          email ? (0, import_vue65.h)("span", { class: px("user-profile__hero-subtitle") }, String(email)) : null
+        ])
+      ]);
+    }
+    return () => {
+      const data = props.flattenedProfile || props.profile;
+      if (!data && !props.isLoading) {
+        return slots["default"] ? slots["default"]({ error: props.error, isLoading: props.isLoading, profile: null }) : null;
+      }
+      if (slots["default"]) {
+        return slots["default"]({ error: props.error, isLoading: props.isLoading, profile: data });
+      }
+      const currentUser = data;
+      const schemas = props.schemas ?? [];
+      const hasSchemas = schemas.length > 0;
+      const rootClasses = [
+        px("user-profile"),
+        props.compact ? px("user-profile--compact") : "",
+        props.className ?? ""
+      ].filter(Boolean).join(" ");
+      const children = [];
+      children.push(
+        (0, import_vue65.h)("div", { class: px("user-profile__header") }, [
+          (0, import_vue65.h)("span", { class: px("user-profile__title") }, props.title ?? "Profile")
         ])
       );
+      children.push((0, import_vue65.h)(Divider_default, { class: px("user-profile__header-divider") }));
+      if (props.showAvatar !== false && currentUser) {
+        children.push(renderHero(currentUser));
+      }
       if (props.error) {
-        children.push((0, import_vue65.h)(Alert_default, { class: prefix("user-profile__error"), severity: "error" }, () => props.error));
+        children.push((0, import_vue65.h)(Alert_default, { class: px("user-profile__error"), severity: "error" }, () => props.error));
       }
       if (props.isLoading) {
-        children.push((0, import_vue65.h)("div", { class: prefix("user-profile__loading") }, [(0, import_vue65.h)(Spinner_default)]));
-      } else if (data) {
-        const fieldDataRecord = data;
-        const descriptors = PROFILE_FIELD_DESCRIPTORS.filter((d) => {
-          const activeKey = d.keys.find((k) => k in fieldDataRecord);
-          const matchKey = activeKey ?? d.keys[0];
-          if (props.hideFields && props.hideFields.length > 0 && props.hideFields.includes(matchKey)) return false;
-          if (props.showFields && props.showFields.length > 0 && !props.showFields.some((f) => d.keys.includes(f)))
-            return false;
-          return true;
-        });
-        const fieldRows = [];
-        descriptors.forEach((descriptor) => {
-          const key = descriptor.keys.find((k) => k in fieldDataRecord) ?? descriptor.keys[0];
-          const value = fieldDataRecord[key];
-          const isReadonly = descriptor.readonly;
-          const isEditing = editingFields.value[key];
-          const isEmpty2 = value == null || value === "";
-          const { label } = descriptor;
-          fieldRows.push(
-            (0, import_vue65.h)("div", { class: prefix("user-profile__field"), key }, [
-              // Label column
-              (0, import_vue65.h)("div", { class: prefix("user-profile__field-label-col") }, [
-                (0, import_vue65.h)(Typography_default, { class: prefix("user-profile__field-label"), variant: "body2" }, () => label)
-              ]),
-              // Value column
-              (0, import_vue65.h)("div", { class: prefix("user-profile__field-value-col") }, [
-                isEditing ? (0, import_vue65.h)("div", { class: prefix("user-profile__field-edit") }, [
-                  (0, import_vue65.h)(TextField_default, {
-                    modelValue: editedValues.value[key] ?? String(value ?? ""),
-                    "onUpdate:modelValue": (v) => {
-                      editedValues.value = { ...editedValues.value, [key]: v };
-                    }
-                  }),
-                  (0, import_vue65.h)("div", { class: prefix("user-profile__field-edit-actions") }, [
-                    (0, import_vue65.h)(
-                      Button_default,
-                      {
-                        onClick: async () => {
-                          if (props.onUpdate) {
-                            await props.onUpdate({
-                              payload: buildScimPatchValue(key, editedValues.value[key] ?? "", props.schemas)
-                            });
-                          }
-                          editingFields.value = { ...editingFields.value, [key]: false };
-                        },
-                        size: "small",
-                        variant: "solid"
-                      },
-                      () => "Save"
-                    ),
-                    (0, import_vue65.h)(
-                      Button_default,
-                      {
-                        onClick: () => {
-                          editingFields.value = { ...editingFields.value, [key]: false };
-                        },
-                        size: "small",
-                        variant: "text"
-                      },
-                      () => "Cancel"
-                    )
-                  ])
-                ]) : (0, import_vue65.h)("div", { class: prefix("user-profile__field-display") }, [
-                  isEmpty2 ? (0, import_vue65.h)(
-                    "span",
-                    {
-                      class: prefix("user-profile__field-placeholder"),
-                      onClick: props.editable && !isReadonly ? () => {
-                        editingFields.value = { ...editingFields.value, [key]: true };
-                        editedValues.value = { ...editedValues.value, [key]: "" };
-                      } : void 0
-                    },
-                    `Enter your ${label.toLowerCase()}`
-                  ) : (0, import_vue65.h)(
-                    Typography_default,
-                    { class: prefix("user-profile__field-value"), variant: "body1" },
-                    () => String(value)
-                  ),
-                  props.editable && !isReadonly ? (0, import_vue65.h)(
-                    "button",
-                    {
-                      "aria-label": `Edit ${label}`,
-                      class: prefix("user-profile__field-edit-btn"),
-                      onClick: () => {
-                        editingFields.value = { ...editingFields.value, [key]: true };
-                        editedValues.value = { ...editedValues.value, [key]: String(value ?? "") };
-                      },
-                      type: "button"
-                    },
-                    [(0, import_vue65.h)(PencilIcon)]
-                  ) : null
-                ])
-              ])
-            ])
-          );
-        });
-        children.push((0, import_vue65.h)("div", { class: prefix("user-profile__fields") }, fieldRows));
+        children.push((0, import_vue65.h)("div", { class: px("user-profile__loading") }, [(0, import_vue65.h)(Spinner_default)]));
+      } else if (hasSchemas) {
+        const fieldRows = schemas.filter((s) => s.name && shouldShowField(s.name)).sort((a, b) => {
+          const orderA = a.displayOrder ? parseInt(a.displayOrder, 10) : 999;
+          const orderB = b.displayOrder ? parseInt(b.displayOrder, 10) : 999;
+          return orderA - orderB;
+        }).map((schema) => {
+          const value = currentUser && schema.name ? currentUser[schema.name] : void 0;
+          return renderSchemaFieldRow({ ...schema, value });
+        }).filter((node) => node !== null);
+        children.push((0, import_vue65.h)("div", { class: px("user-profile__fields") }, fieldRows));
+      } else {
+        children.push((0, import_vue65.h)("div", { class: px("user-profile__fields") }, renderProfileWithoutSchemas()));
       }
       if (slots["footer"]) {
-        children.push((0, import_vue65.h)("div", { class: prefix("user-profile__footer") }, slots["footer"]()));
+        children.push((0, import_vue65.h)("div", { class: px("user-profile__footer") }, slots["footer"]()));
       }
       if (props.cardLayout) {
-        return (0, import_vue65.h)(Card_default, { class: [prefix("user-profile"), props.className].filter(Boolean).join(" ") }, () => children);
+        return (0, import_vue65.h)(Card_default, { class: rootClasses, variant: props.cardVariant ?? "elevated" }, () => children);
       }
-      return (0, import_vue65.h)("div", { class: [prefix("user-profile"), props.className].filter(Boolean).join(" ") }, children);
+      return (0, import_vue65.h)("div", { class: rootClasses }, children);
     };
   }
 });
 var BaseUserProfile_default = BaseUserProfile;
 
+// src/api/updateMeProfile.ts
+var import_browser55 = require("@asgardeo/browser");
+var updateMeProfile = async ({ fetcher, instanceId = 0, ...requestConfig }) => {
+  const defaultFetcher = async (url, config) => {
+    const client = import_browser55.AsgardeoSPAClient.getInstance(instanceId);
+    const httpClient = client.httpRequest.bind(client);
+    const response = await httpClient({
+      data: config.body ? JSON.parse(config.body) : void 0,
+      headers: config.headers,
+      method: config.method || "PATCH",
+      url
+    });
+    return {
+      json: () => Promise.resolve(response.data),
+      ok: response.status >= 200 && response.status < 300,
+      status: response.status,
+      statusText: response.statusText || "",
+      text: () => Promise.resolve(typeof response.data === "string" ? response.data : JSON.stringify(response.data))
+    };
+  };
+  return (0, import_browser55.updateMeProfile)({
+    ...requestConfig,
+    fetcher: fetcher || defaultFetcher
+  });
+};
+var updateMeProfile_default = updateMeProfile;
+
 // src/components/presentation/user-profile/UserProfile.ts
 var UserProfile3 = (0, import_vue66.defineComponent)({
   name: "UserProfile",
   props: {
+    /** Avatar circle size. */
+    avatarSize: {
+      default: "lg",
+      type: String
+    },
+    /** Whether to render the component inside a Card wrapper. */
     cardLayout: { default: true, type: Boolean },
+    /** Shadow / border style of the card wrapper. */
+    cardVariant: {
+      default: "elevated",
+      type: String
+    },
+    /** Extra CSS class added to the root element. */
     className: { default: "", type: String },
+    /** Tighter spacing — useful when embedded in a modal or dropdown. */
+    compact: { default: false, type: Boolean },
+    /** Whether fields can be edited inline. */
     editable: { default: true, type: Boolean },
+    /** Fields to hide by name. */
     hideFields: { default: () => [], type: Array },
+    /** Whether to render the avatar hero section. */
+    showAvatar: { default: true, type: Boolean },
+    /** Fields to show exclusively (empty = show all). */
     showFields: { default: () => [], type: Array },
+    /** Card header title. */
     title: { default: "Profile", type: String }
   },
   setup(props, { slots }) {
-    const { flattenedProfile, schemas, updateProfile } = useUser_default();
+    const { baseUrl, instanceId } = useAsgardeo_default();
+    const { flattenedProfile, profile, schemas, onUpdateProfile } = useUser_default();
+    const { t } = useI18n_default();
+    const error = (0, import_vue66.ref)(null);
+    async function handleProfileUpdate(payload) {
+      if (!baseUrl) return;
+      error.value = null;
+      try {
+        const response = await updateMeProfile_default({ baseUrl, instanceId, payload });
+        onUpdateProfile(response);
+      } catch (caughtError) {
+        let message = t("user.profile.update.generic.error") || "Failed to update profile. Please try again.";
+        if (caughtError instanceof import_browser56.AsgardeoError) {
+          message = caughtError.message;
+        }
+        error.value = message;
+      }
+    }
     return () => (0, import_vue66.h)(
       BaseUserProfile_default,
       {
+        avatarSize: props.avatarSize,
         cardLayout: props.cardLayout,
-        class: (0, import_browser54.withVendorCSSClassPrefix)("user-profile--styled"),
+        cardVariant: props.cardVariant,
+        class: (0, import_browser56.withVendorCSSClassPrefix)("user-profile--styled"),
         className: props.className,
+        compact: props.compact,
         editable: props.editable,
+        error: error.value,
         flattenedProfile: flattenedProfile?.value,
         hideFields: props.hideFields,
-        onUpdate: updateProfile,
+        onUpdate: handleProfileUpdate,
+        profile: profile?.value?.profile ?? flattenedProfile?.value,
         schemas: schemas?.value,
+        showAvatar: props.showAvatar,
         showFields: props.showFields,
         title: props.title
       },
@@ -9843,27 +10329,106 @@ var UserProfile3 = (0, import_vue66.defineComponent)({
 var UserProfile_default = UserProfile3;
 
 // src/components/presentation/user-dropdown/UserDropdown.ts
-var import_browser56 = require("@asgardeo/browser");
+var import_browser58 = require("@asgardeo/browser");
 var import_vue68 = require("vue");
 
 // src/components/presentation/user-dropdown/BaseUserDropdown.ts
-var import_browser55 = require("@asgardeo/browser");
+var import_browser57 = require("@asgardeo/browser");
 var import_vue67 = require("vue");
+var DEFAULT_ATTRIBUTE_MAPPINGS2 = {
+  email: ["emails", "email"],
+  firstName: ["name.givenName", "given_name"],
+  lastName: ["name.familyName", "family_name"],
+  username: ["userName", "username", "user_name"]
+};
+var MENU_MIN_WIDTHS = { lg: 280, md: 220, sm: 180 };
+var AVATAR_GRADIENTS2 = [
+  "linear-gradient(135deg, #4b6ef5 0%, #7c3aed 100%)",
+  "linear-gradient(135deg, #0ea5e9 0%, #4b6ef5 100%)",
+  "linear-gradient(135deg, #10b981 0%, #0ea5e9 100%)",
+  "linear-gradient(135deg, #f59e0b 0%, #ef4444 100%)",
+  "linear-gradient(135deg, #ec4899 0%, #7c3aed 100%)",
+  "linear-gradient(135deg, #8b5cf6 0%, #4b6ef5 100%)",
+  "linear-gradient(135deg, #14b8a6 0%, #0ea5e9 100%)",
+  "linear-gradient(135deg, #f97316 0%, #ec4899 100%)"
+];
+function getAvatarGradient2(seed) {
+  if (!seed) return AVATAR_GRADIENTS2[0];
+  let hash = 0;
+  for (let i = 0; i < seed.length; i += 1) {
+    hash = hash * 31 + seed.charCodeAt(i) >>> 0;
+  }
+  return AVATAR_GRADIENTS2[Math.abs(hash) % AVATAR_GRADIENTS2.length];
+}
+function resolveUserInfo(user) {
+  if (!user) {
+    return { displayName: "User", gradient: AVATAR_GRADIENTS2[0], initials: "?", subtitle: "" };
+  }
+  const displayName = getDisplayName_default(DEFAULT_ATTRIBUTE_MAPPINGS2, user) || "User";
+  const initials = displayName.split(" ").map((w) => w.charAt(0)).slice(0, 2).join("").toUpperCase() || "?";
+  const seed = String(
+    getMappedUserProfileValue_default("username", DEFAULT_ATTRIBUTE_MAPPINGS2, user) || getMappedUserProfileValue_default("email", DEFAULT_ATTRIBUTE_MAPPINGS2, user) || displayName
+  );
+  const subtitle = String(
+    getMappedUserProfileValue_default("email", DEFAULT_ATTRIBUTE_MAPPINGS2, user) || getMappedUserProfileValue_default("username", DEFAULT_ATTRIBUTE_MAPPINGS2, user) || ""
+  );
+  return { displayName, gradient: getAvatarGradient2(seed), initials, subtitle };
+}
 var BaseUserDropdown = (0, import_vue67.defineComponent)({
   inheritAttrs: false,
   name: "BaseUserDropdown",
   props: {
     className: { default: "", type: String },
     isProfileModalOpen: { default: false, type: Boolean },
+    /**
+     * How to align the dropdown panel relative to the trigger.
+     * - `'auto'` (default) — opens toward the side with more viewport space.
+     * - `'left'` — panel left edge aligns with trigger left edge.
+     * - `'right'` — panel right edge aligns with trigger right edge.
+     */
+    menuAlign: { default: "auto", type: String },
+    /**
+     * Extra items rendered between the Profile link and Sign Out.
+     * Each item can carry an icon, a danger flag, and a separatorBefore flag.
+     */
+    menuItems: { default: void 0, type: Array },
     onProfileClick: { default: void 0, type: Function },
     onProfileModalClose: { default: void 0, type: Function },
     onSignOut: { default: void 0, type: Function },
     profileContent: { default: null, type: Object },
+    /** Show the animated chevron on the trigger. Default `false`. */
+    showChevron: { default: false, type: Boolean },
+    /** Controls avatar size on the trigger and spacing density of the menu. */
+    size: { default: "md", type: String },
     user: { default: null, type: Object }
   },
   setup(props, { slots }) {
     const isOpen = (0, import_vue67.ref)(false);
-    const prefix = import_browser55.withVendorCSSClassPrefix;
+    const containerRef = (0, import_vue67.ref)(null);
+    const px = import_browser57.withVendorCSSClassPrefix;
+    function handleClickOutside(event) {
+      if (containerRef.value && !containerRef.value.contains(event.target)) {
+        isOpen.value = false;
+      }
+    }
+    function handleKeyDown(event) {
+      if (event.key === "Escape") isOpen.value = false;
+    }
+    (0, import_vue67.onMounted)(() => {
+      document.addEventListener("click", handleClickOutside);
+      document.addEventListener("keydown", handleKeyDown);
+    });
+    (0, import_vue67.onUnmounted)(() => {
+      document.removeEventListener("click", handleClickOutside);
+      document.removeEventListener("keydown", handleKeyDown);
+    });
+    function resolveMenuAlign() {
+      if (props.menuAlign !== "auto") return props.menuAlign;
+      if (!containerRef.value) return "right";
+      const rect = containerRef.value.getBoundingClientRect();
+      const menuWidth = MENU_MIN_WIDTHS[props.size ?? "md"] ?? 220;
+      return window.innerWidth - rect.right >= menuWidth ? "right" : "left";
+    }
     return () => {
       if (slots["default"]) {
         return slots["default"]({
@@ -9874,85 +10439,148 @@ var BaseUserDropdown = (0, import_vue67.defineComponent)({
           user: props.user
         });
       }
-      const resolveDisplayName = () => {
-        if (!props.user) return void 0;
-        const { displayName: displayName2, name, email, username, sub } = props.user;
-        if (typeof displayName2 === "string") return displayName2;
-        if (typeof name === "string") return name;
-        if (typeof name === "object" && name) {
-          const parts = [name.givenName, name.familyName].filter(Boolean);
-          if (parts.length > 0) return parts.join(" ");
-        }
-        if (typeof email === "string") return email;
-        if (typeof username === "string") return username;
-        if (typeof sub === "string") return sub;
-        return void 0;
-      };
-      const displayName = resolveDisplayName();
-      const children = [];
-      children.push(
-        (0, import_vue67.h)(
-          "button",
-          {
-            class: prefix("user-dropdown__trigger"),
-            onClick: () => {
-              isOpen.value = !isOpen.value;
-            },
-            type: "button"
+      const { displayName, initials, gradient, subtitle } = resolveUserInfo(props.user ?? null);
+      const size = props.size ?? "md";
+      const avatarSizeClass = size !== "md" ? px(`user-dropdown__avatar--${size}`) : "";
+      const triggerClass = [
+        px("user-dropdown__trigger"),
+        isOpen.value ? px("user-dropdown__trigger--open") : ""
+      ].filter(Boolean).join(" ");
+      const trigger = (0, import_vue67.h)(
+        "button",
+        {
+          "aria-expanded": isOpen.value,
+          "aria-haspopup": "true",
+          class: triggerClass,
+          onClick: (e) => {
+            e.stopPropagation();
+            isOpen.value = !isOpen.value;
           },
-          [
-            (0, import_vue67.h)("span", { class: prefix("user-dropdown__avatar") }, [(0, import_vue67.h)(UserIcon, { size: 20 })]),
-            displayName ? (0, import_vue67.h)(Typography_default, { class: prefix("user-dropdown__name"), variant: "body2" }, () => displayName) : null,
-            (0, import_vue67.h)(ChevronDownIcon, { size: 16 })
-          ]
-        )
+          type: "button"
+        },
+        [
+          (0, import_vue67.h)(
+            "span",
+            {
+              class: [px("user-dropdown__avatar"), avatarSizeClass].filter(Boolean).join(" "),
+              style: { background: gradient }
+            },
+            initials
+          ),
+          props.showChevron ? (0, import_vue67.h)("span", { class: px("user-dropdown__chevron") }, [(0, import_vue67.h)(ChevronDownIcon, { size: 14 })]) : null
+        ]
       );
+      let menu = null;
       if (isOpen.value) {
-        const menuItems = [];
-        if (props.onProfileClick) {
-          menuItems.push(
-            (0, import_vue67.h)("button", { class: prefix("user-dropdown__item"), onClick: props.onProfileClick, type: "button" }, [
-              (0, import_vue67.h)(UserIcon, { size: 16 }),
-              (0, import_vue67.h)("span", null, "Profile")
+        const resolvedAlign = resolveMenuAlign();
+        const alignClass = resolvedAlign === "left" ? px("user-dropdown__menu--align-left") : "";
+        const sizeClass = size !== "md" ? px(`user-dropdown__menu--size-${size}`) : "";
+        const menuClass = [px("user-dropdown__menu"), alignClass, sizeClass].filter(Boolean).join(" ");
+        const menuChildren = [];
+        menuChildren.push(
+          (0, import_vue67.h)("div", { class: px("user-dropdown__menu-header") }, [
+            (0, import_vue67.h)("div", { class: px("user-dropdown__menu-header-avatar"), style: { background: gradient } }, initials),
+            (0, import_vue67.h)("div", { class: px("user-dropdown__menu-header-info") }, [
+              (0, import_vue67.h)("span", { class: px("user-dropdown__menu-header-name") }, displayName),
+              subtitle ? (0, import_vue67.h)("span", { class: px("user-dropdown__menu-header-subtitle") }, subtitle) : null
             ])
+          ])
+        );
+        menuChildren.push((0, import_vue67.h)("div", { class: px("user-dropdown__menu-divider") }));
+        if (props.onProfileClick) {
+          menuChildren.push(
+            (0, import_vue67.h)(
+              "button",
+              {
+                class: px("user-dropdown__item"),
+                onClick: () => {
+                  isOpen.value = false;
+                  props.onProfileClick();
+                },
+                type: "button"
+              },
+              [(0, import_vue67.h)(UserIcon, { size: 15 }), (0, import_vue67.h)("span", null, "Profile")]
+            )
           );
         }
+        if (props.menuItems && props.menuItems.length > 0) {
+          props.menuItems.forEach((item, idx) => {
+            if (item.separatorBefore) {
+              menuChildren.push((0, import_vue67.h)("div", { class: px("user-dropdown__menu-divider"), key: `sep-${idx}` }));
+            }
+            menuChildren.push(
+              (0, import_vue67.h)(
+                "button",
+                {
+                  class: [px("user-dropdown__item"), item.danger ? px("user-dropdown__item--danger") : ""].filter(Boolean).join(" "),
+                  key: `item-${idx}`,
+                  onClick: () => {
+                    isOpen.value = false;
+                    item.onClick();
+                  },
+                  type: "button"
+                },
+                [item.icon ?? null, (0, import_vue67.h)("span", null, item.label)]
+              )
+            );
+          });
+        }
         if (slots["items"]) {
-          menuItems.push(...slots["items"]() ?? []);
+          menuChildren.push(...slots["items"]() ?? []);
         }
         if (props.onSignOut) {
-          menuItems.push(
-            (0, import_vue67.h)("button", { class: prefix("user-dropdown__item"), onClick: props.onSignOut, type: "button" }, [
-              (0, import_vue67.h)(LogOutIcon, { size: 16 }),
-              (0, import_vue67.h)("span", null, "Sign Out")
-            ])
+          menuChildren.push((0, import_vue67.h)("div", { class: px("user-dropdown__menu-divider") }));
+          menuChildren.push(
+            (0, import_vue67.h)(
+              "button",
+              {
+                class: [px("user-dropdown__item"), px("user-dropdown__item--danger")].join(" "),
+                onClick: () => {
+                  isOpen.value = false;
+                  props.onSignOut();
+                },
+                type: "button"
+              },
+              [(0, import_vue67.h)(LogOutIcon, { size: 15 }), (0, import_vue67.h)("span", null, "Sign Out")]
+            )
           );
         }
-        children.push((0, import_vue67.h)("div", { class: prefix("user-dropdown__menu") }, menuItems));
+        menu = (0, import_vue67.h)("div", { class: menuClass }, menuChildren.filter(Boolean));
       }
       const container = (0, import_vue67.h)(
         "div",
-        { class: [prefix("user-dropdown"), props.className].filter(Boolean).join(" ") },
-        children
+        { class: [px("user-dropdown"), props.className].filter(Boolean).join(" "), ref: containerRef },
+        [trigger, menu]
       );
       if (props.isProfileModalOpen) {
         return (0, import_vue67.h)("div", [
           container,
-          (0, import_vue67.h)("div", { class: prefix("user-dropdown__modal-overlay") }, [
-            (0, import_vue67.h)("div", { class: prefix("user-dropdown__modal-content") }, [
-              (0, import_vue67.h)(
-                "button",
-                {
-                  "aria-label": "Close profile modal",
-                  class: prefix("user-dropdown__modal-close"),
-                  onClick: props.onProfileModalClose,
-                  type: "button"
-                },
-                [(0, import_vue67.h)(XIcon, { size: 24 })]
-              ),
-              props.profileContent
-            ])
-          ])
+          (0, import_vue67.h)(
+            "div",
+            {
+              class: px("user-dropdown__modal-overlay"),
+              onClick: (e) => {
+                if (e.target.classList.contains(px("user-dropdown__modal-overlay"))) {
+                  props.onProfileModalClose?.();
+                }
+              }
+            },
+            [
+              (0, import_vue67.h)("div", { class: px("user-dropdown__modal-content") }, [
+                (0, import_vue67.h)(
+                  "button",
+                  {
+                    "aria-label": "Close profile",
+                    class: px("user-dropdown__modal-close"),
+                    onClick: props.onProfileModalClose,
+                    type: "button"
+                  },
+                  [(0, import_vue67.h)(XIcon, { size: 18 })]
+                ),
+                props.profileContent
+              ])
+            ]
+          )
         ]);
       }
       return container;
@@ -9966,8 +10594,38 @@ var UserDropdown = (0, import_vue68.defineComponent)({
   emits: ["profileClick"],
   name: "UserDropdown",
   props: {
-    className: {
-      default: "",
+    /** Extra CSS class added to the root element. */
+    className: { default: "", type: String },
+    /**
+     * How to align the dropdown panel relative to the trigger button.
+     * - `'auto'` (default) — picks the side with more available viewport space at open time.
+     * - `'left'` — panel left edge aligns with trigger left edge.
+     * - `'right'` — panel right edge aligns with trigger right edge.
+     */
+    menuAlign: {
+      default: "auto",
+      type: String
+    },
+    /**
+     * Extra items inserted between the Profile link and Sign Out.
+     * Set `separatorBefore: true` on any item to add a divider line before it.
+     * Set `danger: true` for destructive actions (red styling).
+     * Pass an `icon` VNode to render an icon to the left of the label.
+     */
+    menuItems: {
+      default: void 0,
+      type: Array
+    },
+    /** Whether to show the animated down-chevron beside the avatar. Default `false`. */
+    showChevron: { default: false, type: Boolean },
+    /**
+     * Overall density / avatar size of the component.
+     * - `'sm'` — 28 px avatar, compact menu (180 px min-width).
+     * - `'md'` (default) — 32 px avatar, standard menu (220 px min-width).
+     * - `'lg'` — 38 px avatar, spacious menu (280 px min-width).
+     */
+    size: {
+      default: "md",
       type: String
     }
   },
@@ -9977,9 +10635,11 @@ var UserDropdown = (0, import_vue68.defineComponent)({
     return () => (0, import_vue68.h)(
       BaseUserDropdown_default,
       {
-        class: (0, import_browser56.withVendorCSSClassPrefix)("user-dropdown--styled"),
+        class: (0, import_browser58.withVendorCSSClassPrefix)("user-dropdown--styled"),
         className: props.className,
         isProfileModalOpen: isProfileModalOpen.value,
+        menuAlign: props.menuAlign,
+        menuItems: props.menuItems,
         onProfileClick: () => {
           isProfileModalOpen.value = true;
           emit("profileClick");
@@ -9992,8 +10652,11 @@ var UserDropdown = (0, import_vue68.defineComponent)({
         },
         profileContent: isProfileModalOpen.value ? (0, import_vue68.h)(UserProfile_default, {
           cardLayout: false,
+          compact: true,
           editable: true
         }) : null,
+        showChevron: props.showChevron,
+        size: props.size,
         user: user.value
       },
       slots
@@ -10006,7 +10669,7 @@ var UserDropdown_default = UserDropdown;
 var import_vue70 = require("vue");
 
 // src/components/presentation/accept-invite/BaseAcceptInvite.ts
-var import_browser57 = require("@asgardeo/browser");
+var import_browser59 = require("@asgardeo/browser");
 var import_vue69 = require("vue");
 var BaseAcceptInvite = (0, import_vue69.defineComponent)({
   name: "BaseAcceptInvite",
@@ -10234,7 +10897,7 @@ var BaseAcceptInvite = (0, import_vue69.defineComponent)({
       (comp) => !(comp.type === "TEXT" && (comp.variant === "HEADING_1" || comp.variant === "HEADING_2"))
     );
     return () => {
-      const containerClass = [(0, import_browser57.withVendorCSSClassPrefix)("accept-invite"), props.className].filter(Boolean).join(" ");
+      const containerClass = [(0, import_browser59.withVendorCSSClassPrefix)("accept-invite"), props.className].filter(Boolean).join(" ");
       const components = currentFlow.value?.data?.components || currentFlow.value?.data?.meta?.components || [];
       const { title, subtitle } = extractHeadings(components);
       const componentsWithoutHeadings = filterHeadings(components);
@@ -10434,11 +11097,11 @@ var AcceptInvite = (0, import_vue70.defineComponent)({
 var AcceptInvite_default = AcceptInvite;
 
 // src/components/presentation/invite-user/InviteUser.ts
-var import_browser59 = require("@asgardeo/browser");
+var import_browser61 = require("@asgardeo/browser");
 var import_vue72 = require("vue");
 
 // src/components/presentation/invite-user/BaseInviteUser.ts
-var import_browser58 = require("@asgardeo/browser");
+var import_browser60 = require("@asgardeo/browser");
 var import_vue71 = require("vue");
 var BaseInviteUser = (0, import_vue71.defineComponent)({
   name: "BaseInviteUser",
@@ -10623,7 +11286,7 @@ var BaseInviteUser = (0, import_vue71.defineComponent)({
             isLoading.value = true;
             apiError.value = null;
             try {
-              const payload = { flowType: import_browser58.EmbeddedFlowType.UserOnboarding, verbose: true };
+              const payload = { flowType: import_browser60.EmbeddedFlowType.UserOnboarding, verbose: true };
               const rawResponse = await props.onInitialize(payload);
               const response = normalizeFlowResponseLocal(rawResponse);
               currentFlow.value = response;
@@ -10657,7 +11320,7 @@ var BaseInviteUser = (0, import_vue71.defineComponent)({
       (comp) => !(comp.type === "TEXT" && (comp.variant === "HEADING_1" || comp.variant === "HEADING_2"))
     );
     return () => {
-      const containerClass = [(0, import_browser58.withVendorCSSClassPrefix)("invite-user"), props.className].filter(Boolean).join(" ");
+      const containerClass = [(0, import_browser60.withVendorCSSClassPrefix)("invite-user"), props.className].filter(Boolean).join(" ");
       const components = currentFlow.value?.data?.components || currentFlow.value?.data?.meta?.components || [];
       const { title, subtitle } = extractHeadings(components);
       const componentsWithoutHeadings = filterHeadings(components);
@@ -10822,7 +11485,7 @@ var InviteUser = (0, import_vue72.defineComponent)({
     const { http: http3, baseUrl, isInitialized } = useAsgardeo_default();
     const handleInitialize = async (payload) => {
       const response = await http3.request({
-        data: { ...payload, flowType: import_browser59.EmbeddedFlowType.UserOnboarding, verbose: true },
+        data: { ...payload, flowType: import_browser61.EmbeddedFlowType.UserOnboarding, verbose: true },
         headers: { Accept: "application/json", "Content-Type": "application/json" },
         method: "POST",
         url: `${baseUrl}/flow/execute`
@@ -10860,11 +11523,11 @@ var InviteUser = (0, import_vue72.defineComponent)({
 var InviteUser_default = InviteUser;
 
 // src/components/presentation/organization-list/OrganizationList.ts
-var import_browser61 = require("@asgardeo/browser");
+var import_browser63 = require("@asgardeo/browser");
 var import_vue74 = require("vue");
 
 // src/components/presentation/organization-list/BaseOrganizationList.ts
-var import_browser60 = require("@asgardeo/browser");
+var import_browser62 = require("@asgardeo/browser");
 var import_vue73 = require("vue");
 var BaseOrganizationList = (0, import_vue73.defineComponent)({
   inheritAttrs: false,
@@ -10880,7 +11543,7 @@ var BaseOrganizationList = (0, import_vue73.defineComponent)({
       if (slots["default"]) {
         return slots["default"]({ isLoading: props.isLoading, organizations: props.organizations });
       }
-      const prefix = import_browser60.withVendorCSSClassPrefix;
+      const prefix = import_browser62.withVendorCSSClassPrefix;
       const children = [];
       if (props.isLoading) {
         children.push((0, import_vue73.h)("div", { class: prefix("organization-list__loading") }, [(0, import_vue73.h)(Spinner_default)]));
@@ -10929,7 +11592,7 @@ var OrganizationList = (0, import_vue74.defineComponent)({
     return () => (0, import_vue74.h)(
       BaseOrganizationList_default,
       {
-        class: (0, import_browser61.withVendorCSSClassPrefix)("organization-list--styled"),
+        class: (0, import_browser63.withVendorCSSClassPrefix)("organization-list--styled"),
         className: props.className,
         isLoading: isLoading.value,
         onSelect: handleSelect,
@@ -10942,11 +11605,11 @@ var OrganizationList = (0, import_vue74.defineComponent)({
 var OrganizationList_default = OrganizationList;
 
 // src/components/presentation/organization-profile/OrganizationProfile.ts
-var import_browser63 = require("@asgardeo/browser");
+var import_browser65 = require("@asgardeo/browser");
 var import_vue76 = require("vue");
 
 // src/components/presentation/organization-profile/BaseOrganizationProfile.ts
-var import_browser62 = require("@asgardeo/browser");
+var import_browser64 = require("@asgardeo/browser");
 var import_vue75 = require("vue");
 var ORG_AVATAR_GRADIENTS = [
   "linear-gradient(135deg, #22d3ee 0%, #2dd4bf 100%)",
@@ -11003,7 +11666,7 @@ var BaseOrganizationProfile = (0, import_vue75.defineComponent)({
       if (!props.organization) {
         return slots["fallback"]?.() ?? null;
       }
-      const prefix = import_browser62.withVendorCSSClassPrefix;
+      const prefix = import_browser64.withVendorCSSClassPrefix;
       const org = props.organization;
       const orgName = String(org["name"] || org["displayName"] || "");
       const orgHandle = String(org["orgHandle"] || "");
@@ -11282,7 +11945,7 @@ var OrganizationProfile = (0, import_vue76.defineComponent)({
     return () => (0, import_vue76.h)(
       BaseOrganizationProfile_default,
       {
-        class: (0, import_browser63.withVendorCSSClassPrefix)("organization-profile--styled"),
+        class: (0, import_browser65.withVendorCSSClassPrefix)("organization-profile--styled"),
         className: props.className,
         editable: props.editable,
         onUpdate: props.onUpdate,
@@ -11296,13 +11959,13 @@ var OrganizationProfile = (0, import_vue76.defineComponent)({
 var OrganizationProfile_default = OrganizationProfile;
 
 // src/components/presentation/organization-switcher/OrganizationSwitcher.ts
-var import_browser65 = require("@asgardeo/browser");
+var import_browser67 = require("@asgardeo/browser");
 var import_vue78 = require("vue");
 
 // src/components/presentation/organization-switcher/BaseOrganizationSwitcher.ts
-var import_browser64 = require("@asgardeo/browser");
+var import_browser66 = require("@asgardeo/browser");
 var import_vue77 = require("vue");
-var cls = (name) => (0, import_browser64.withVendorCSSClassPrefix)(`organization-switcher${name}`);
+var cls = (name) => (0, import_browser66.withVendorCSSClassPrefix)(`organization-switcher${name}`);
 var BaseOrganizationSwitcher = (0, import_vue77.defineComponent)({
   inheritAttrs: false,
   name: "BaseOrganizationSwitcher",
@@ -11392,7 +12055,7 @@ var OrganizationSwitcher = (0, import_vue78.defineComponent)({
     return () => (0, import_vue78.h)(
       BaseOrganizationSwitcher_default,
       {
-        class: (0, import_browser65.withVendorCSSClassPrefix)("organization-switcher--styled"),
+        class: (0, import_browser67.withVendorCSSClassPrefix)("organization-switcher--styled"),
         className: props.className,
         currentOrganization: currentOrganization?.value ?? null,
         isLoading: isLoading?.value ?? false,
@@ -11406,13 +12069,13 @@ var OrganizationSwitcher = (0, import_vue78.defineComponent)({
 var OrganizationSwitcher_default = OrganizationSwitcher;
 
 // src/components/presentation/create-organization/CreateOrganization.ts
-var import_browser67 = require("@asgardeo/browser");
+var import_browser69 = require("@asgardeo/browser");
 var import_vue80 = require("vue");
 
 // src/components/presentation/create-organization/BaseCreateOrganization.ts
-var import_browser66 = require("@asgardeo/browser");
+var import_browser68 = require("@asgardeo/browser");
 var import_vue79 = require("vue");
-var cls2 = (name) => (0, import_browser66.withVendorCSSClassPrefix)(`create-organization${name}`);
+var cls2 = (name) => (0, import_browser68.withVendorCSSClassPrefix)(`create-organization${name}`);
 var BaseCreateOrganization = (0, import_vue79.defineComponent)({
   name: "BaseCreateOrganization",
   props: {
@@ -11498,7 +12161,7 @@ var CreateOrganization = (0, import_vue80.defineComponent)({
     return () => (0, import_vue80.h)(
       BaseCreateOrganization_default,
       {
-        class: (0, import_browser67.withVendorCSSClassPrefix)("create-organization--styled"),
+        class: (0, import_browser69.withVendorCSSClassPrefix)("create-organization--styled"),
         className: props.className,
         description: props.description,
         onCreate: createOrganization ? async (name) => {
@@ -11513,13 +12176,13 @@ var CreateOrganization = (0, import_vue80.defineComponent)({
 var CreateOrganization_default = CreateOrganization;
 
 // src/components/presentation/language-switcher/LanguageSwitcher.ts
-var import_browser69 = require("@asgardeo/browser");
+var import_browser71 = require("@asgardeo/browser");
 var import_vue82 = require("vue");
 
 // src/components/presentation/language-switcher/BaseLanguageSwitcher.ts
-var import_browser68 = require("@asgardeo/browser");
+var import_browser70 = require("@asgardeo/browser");
 var import_vue81 = require("vue");
-var cls3 = (name) => (0, import_browser68.withVendorCSSClassPrefix)(`language-switcher${name}`);
+var cls3 = (name) => (0, import_browser70.withVendorCSSClassPrefix)(`language-switcher${name}`);
 var BaseLanguageSwitcher = (0, import_vue81.defineComponent)({
   name: "BaseLanguageSwitcher",
   props: {
@@ -11604,7 +12267,7 @@ var LanguageSwitcher = (0, import_vue82.defineComponent)({
     return () => (0, import_vue82.h)(
       BaseLanguageSwitcher_default,
       {
-        class: (0, import_browser69.withVendorCSSClassPrefix)("language-switcher--styled"),
+        class: (0, import_browser71.withVendorCSSClassPrefix)("language-switcher--styled"),
         className: props.className,
         currentLanguage: currentLanguage?.value ?? "en",
         languages: props.languages,
@@ -11662,19 +12325,19 @@ var buildThemeConfigFromFlowMeta = (flowMetaTheme, colorScheme) => {
 var buildThemeConfigFromFlowMeta_default = buildThemeConfigFromFlowMeta;
 
 // src/index.ts
-var import_browser76 = require("@asgardeo/browser");
+var import_browser78 = require("@asgardeo/browser");
 
 // src/utils/handleWebAuthnAuthentication.ts
-var import_browser70 = require("@asgardeo/browser");
+var import_browser72 = require("@asgardeo/browser");
 
 // src/utils/hasAuthParamsInUrl.ts
-var import_browser71 = require("@asgardeo/browser");
+var import_browser73 = require("@asgardeo/browser");
 
 // src/utils/navigate.ts
-var import_browser72 = require("@asgardeo/browser");
+var import_browser74 = require("@asgardeo/browser");
 
 // src/utils/http.ts
-var import_browser73 = require("@asgardeo/browser");
+var import_browser75 = require("@asgardeo/browser");
 
 // src/router/guard.ts
 var import_vue83 = require("vue");
@@ -11749,11 +12412,11 @@ var createCallbackRoute = (options = {}) => {
 };
 
 // src/theme/getActiveTheme.ts
-var import_browser74 = require("@asgardeo/browser");
+var import_browser76 = require("@asgardeo/browser");
 
 // src/theme/themeDetection.ts
-var import_browser75 = require("@asgardeo/browser");
+var import_browser77 = require("@asgardeo/browser");
 
 // src/index.ts
-var import_browser77 = require("@asgardeo/browser");
+var import_browser79 = require("@asgardeo/browser");
 //# sourceMappingURL=index.js.map