@asgardeo/javascript 0.1.1 → 0.1.3

package/dist/cjs/index.js

@@ -50,6 +50,7 @@ __export(index_exports, {
   createPatchOperations: () => createPatchOperations,
   createTheme: () => createTheme_default,
   deepMerge: () => deepMerge_default,
+  deriveOrganizationHandleFromBaseUrl: () => deriveOrganizationHandleFromBaseUrl_default,
   executeEmbeddedSignInFlow: () => executeEmbeddedSignInFlow_default,
   executeEmbeddedSignUpFlow: () => executeEmbeddedSignUpFlow_default,
   extractPkceStorageKeyFromState: () => extractPkceStorageKeyFromState_default,
@@ -59,6 +60,7 @@ __export(index_exports, {
   generateUserProfile: () => generateUserProfile_default,
   get: () => get_default,
   getAllOrganizations: () => getAllOrganizations_default,
+  getBrandingPreference: () => getBrandingPreference_default,
   getI18nBundles: () => getI18nBundles_default,
   getLatestStateParam: () => getLatestStateParam_default,
   getMeOrganizations: () => getMeOrganizations_default,
@@ -69,10 +71,12 @@ __export(index_exports, {
   initializeEmbeddedSignInFlow: () => initializeEmbeddedSignInFlow_default,
   isEmpty: () => isEmpty_default,
   processOpenIDScopes: () => processOpenIDScopes_default,
+  processUsername: () => processUsername_default,
   removeTrailingSlash: () => removeTrailingSlash_default,
   resolveFieldName: () => resolveFieldName_default,
   resolveFieldType: () => resolveFieldType_default,
   set: () => set_default,
+  transformBrandingPreferenceToTheme: () => transformBrandingPreferenceToTheme_default,
   updateMeProfile: () => updateMeProfile_default,
   updateOrganization: () => updateOrganization_default,
   withVendorCSSClassPrefix: () => withVendorCSSClassPrefix_default
@@ -2022,16 +2026,15 @@ var initializeEmbeddedSignInFlow = async ({
       searchParams.append(key, String(value));
     }
   });
-  const { headers: customHeaders, ...otherConfig } = requestConfig;
   const response = await fetch(url ?? `${baseUrl}/oauth2/authorize`, {
+    ...requestConfig,
     method: requestConfig.method || "POST",
     headers: {
+      ...requestConfig.headers,
       "Content-Type": "application/x-www-form-urlencoded",
-      Accept: "application/json",
-      ...customHeaders
+      Accept: "application/json"
     },
-    body: searchParams.toString(),
-    ...otherConfig
+    body: searchParams.toString()
   });
   if (!response.ok) {
     const errorText = await response.text();
@@ -2063,16 +2066,15 @@ var executeEmbeddedSignInFlow = async ({
       "If an authorization payload is not provided, the request cannot be constructed correctly."
     );
   }
-  const { headers: customHeaders, ...otherConfig } = requestConfig;
   const response = await fetch(url ?? `${baseUrl}/oauth2/authn`, {
+    ...requestConfig,
     method: requestConfig.method || "POST",
     headers: {
       "Content-Type": "application/json",
       Accept: "application/json",
-      ...customHeaders
+      ...requestConfig.headers
     },
-    body: JSON.stringify(payload),
-    ...otherConfig
+    body: JSON.stringify(payload)
   });
   if (!response.ok) {
     const errorText = await response.text();
@@ -2132,19 +2134,18 @@ var executeEmbeddedSignUpFlow = async ({
       "At least one of the baseUrl or url must be provided to execute the embedded sign up flow."
     );
   }
-  const { headers: customHeaders, ...otherConfig } = requestConfig;
   const response = await fetch(url ?? `${baseUrl}/api/server/v1/flow/execute`, {
+    ...requestConfig,
     method: requestConfig.method || "POST",
     headers: {
       "Content-Type": "application/json",
       Accept: "application/json",
-      ...customHeaders
+      ...requestConfig.headers
     },
     body: JSON.stringify({
       ...payload ?? {},
       flowType: "REGISTRATION" /* Registration */
-    }),
-    ...otherConfig
+    })
   });
   if (!response.ok) {
     const errorText = await response.text();
@@ -2174,12 +2175,13 @@ var getUserInfo = async ({ url, ...requestConfig }) => {
     );
   }
   const response = await fetch(url, {
+    ...requestConfig,
     method: "GET",
     headers: {
       "Content-Type": "application/json",
-      Accept: "application/json"
-    },
-    ...requestConfig
+      Accept: "application/json",
+      ...requestConfig.headers
+    }
   });
   if (!response.ok) {
     const errorText = await response.text();
@@ -2195,6 +2197,32 @@ var getUserInfo = async ({ url, ...requestConfig }) => {
 };
 var getUserInfo_default = getUserInfo;
 
+// src/utils/processUsername.ts
+var USERSTORE_PREFIX_REGEX = /^[A-Z_][A-Z0-9_]*\//;
+var removeUserstorePrefix = (username) => {
+  if (!username) {
+    return "";
+  }
+  return username.replace(USERSTORE_PREFIX_REGEX, "");
+};
+var processUsername = (user) => {
+  if (!user) {
+    return user;
+  }
+  const processedUser = { ...user };
+  if (processedUser.username) {
+    processedUser.username = removeUserstorePrefix(processedUser.username);
+  }
+  if (processedUser.userName) {
+    processedUser.userName = removeUserstorePrefix(processedUser.userName);
+  }
+  if (processedUser.user_name) {
+    processedUser.user_name = removeUserstorePrefix(processedUser.user_name);
+  }
+  return processedUser;
+};
+var processUsername_default = processUsername;
+
 // src/api/getScim2Me.ts
 var getScim2Me = async ({ url, baseUrl, fetcher, ...requestConfig }) => {
   try {
@@ -2211,13 +2239,13 @@ var getScim2Me = async ({ url, baseUrl, fetcher, ...requestConfig }) => {
   const fetchFn = fetcher || fetch;
   const resolvedUrl = url ?? `${baseUrl}/scim2/Me`;
   const requestInit = {
+    ...requestConfig,
     method: "GET",
     headers: {
       "Content-Type": "application/scim+json",
       Accept: "application/json",
       ...requestConfig.headers
-    },
-    ...requestConfig
+    }
   };
   try {
     const response = await fetchFn(resolvedUrl, requestInit);
@@ -2231,7 +2259,8 @@ var getScim2Me = async ({ url, baseUrl, fetcher, ...requestConfig }) => {
         response.statusText
       );
     }
-    return await response.json();
+    const user = await response.json();
+    return processUsername_default(user);
   } catch (error) {
     if (error instanceof AsgardeoAPIError) {
       throw error;
@@ -2263,13 +2292,13 @@ var getSchemas = async ({ url, baseUrl, fetcher, ...requestConfig }) => {
   const fetchFn = fetcher || fetch;
   const resolvedUrl = url ?? `${baseUrl}/scim2/Schemas`;
   const requestInit = {
+    ...requestConfig,
     method: "GET",
     headers: {
       "Content-Type": "application/json",
       Accept: "application/json",
       ...requestConfig.headers
-    },
-    ...requestConfig
+    }
   };
   try {
     const response = await fetchFn(resolvedUrl, requestInit);
@@ -2331,13 +2360,13 @@ var getAllOrganizations = async ({
   const fetchFn = fetcher || fetch;
   const resolvedUrl = `${baseUrl}/api/server/v1/organizations?${queryParams.toString()}`;
   const requestInit = {
+    ...requestConfig,
     method: "GET",
     headers: {
+      ...requestConfig.headers,
       "Content-Type": "application/json",
-      Accept: "application/json",
-      ...requestConfig.headers
-    },
-    ...requestConfig
+      Accept: "application/json"
+    }
   };
   try {
     const response = await fetchFn(resolvedUrl, requestInit);
@@ -2407,14 +2436,14 @@ var createOrganization = async ({
   const fetchFn = fetcher || fetch;
   const resolvedUrl = `${baseUrl}/api/server/v1/organizations`;
   const requestInit = {
+    ...requestConfig,
     method: "POST",
     headers: {
       "Content-Type": "application/json",
       Accept: "application/json",
       ...requestConfig.headers
     },
-    body: JSON.stringify(organizationPayload),
-    ...requestConfig
+    body: JSON.stringify(organizationPayload)
   };
   try {
     const response = await fetchFn(resolvedUrl, requestInit);
@@ -2482,13 +2511,13 @@ var getMeOrganizations = async ({
   const fetchFn = fetcher || fetch;
   const resolvedUrl = `${baseUrl}/api/users/v1/me/organizations?${queryParams.toString()}`;
   const requestInit = {
+    ...requestConfig,
     method: "GET",
     headers: {
       "Content-Type": "application/json",
       Accept: "application/json",
       ...requestConfig.headers
-    },
-    ...requestConfig
+    }
   };
   try {
     const response = await fetchFn(resolvedUrl, requestInit);
@@ -2549,13 +2578,13 @@ var getOrganization = async ({
   const fetchFn = fetcher || fetch;
   const resolvedUrl = `${baseUrl}/api/server/v1/organizations/${organizationId}`;
   const requestInit = {
+    ...requestConfig,
     method: "GET",
     headers: {
       "Content-Type": "application/json",
       Accept: "application/json",
       ...requestConfig.headers
-    },
-    ...requestConfig
+    }
   };
   try {
     const response = await fetchFn(resolvedUrl, requestInit);
@@ -2643,14 +2672,14 @@ var updateOrganization = async ({
   const fetchFn = fetcher || fetch;
   const resolvedUrl = `${baseUrl}/api/server/v1/organizations/${organizationId}`;
   const requestInit = {
+    ...requestConfig,
     method: "PATCH",
     headers: {
       "Content-Type": "application/json",
       Accept: "application/json",
       ...requestConfig.headers
     },
-    body: JSON.stringify(operations),
-    ...requestConfig
+    body: JSON.stringify(operations)
   };
   try {
     const response = await fetchFn(resolvedUrl, requestInit);
@@ -2727,13 +2756,13 @@ var updateMeProfile = async ({
   const resolvedUrl = url ?? `${baseUrl}/scim2/Me`;
   const requestInit = {
     method: "PATCH",
+    ...requestConfig,
     headers: {
+      ...requestConfig.headers,
       "Content-Type": "application/scim+json",
-      Accept: "application/json",
-      ...requestConfig.headers
+      Accept: "application/json"
     },
-    body: JSON.stringify(data),
-    ...requestConfig
+    body: JSON.stringify(data)
   };
   try {
     const response = await fetchFn(resolvedUrl, requestInit);
@@ -2763,6 +2792,75 @@ var updateMeProfile = async ({
 };
 var updateMeProfile_default = updateMeProfile;
 
+// src/api/getBrandingPreference.ts
+var getBrandingPreference = async ({
+  baseUrl,
+  locale,
+  name,
+  type,
+  fetcher,
+  ...requestConfig
+}) => {
+  try {
+    new URL(baseUrl);
+  } catch (error) {
+    throw new AsgardeoAPIError(
+      `Invalid base URL provided. ${error?.toString()}`,
+      "getBrandingPreference-ValidationError-001",
+      "javascript",
+      400,
+      "The provided `baseUrl` does not adhere to the URL schema."
+    );
+  }
+  const queryParams = new URLSearchParams(
+    Object.fromEntries(
+      Object.entries({
+        locale: locale || "",
+        name: name || "",
+        type: type || ""
+      }).filter(([, value]) => Boolean(value))
+    )
+  );
+  const fetchFn = fetcher || fetch;
+  const resolvedUrl = `${baseUrl}/api/server/v1/branding-preference/resolve${queryParams.toString() ? `?${queryParams.toString()}` : ""}`;
+  const requestInit = {
+    ...requestConfig,
+    method: "GET",
+    headers: {
+      "Content-Type": "application/json",
+      Accept: "application/json",
+      ...requestConfig.headers
+    }
+  };
+  try {
+    const response = await fetchFn(resolvedUrl, requestInit);
+    if (!response?.ok) {
+      const errorText = await response.text();
+      throw new AsgardeoAPIError(
+        `Failed to get branding preference: ${errorText}`,
+        "getBrandingPreference-ResponseError-001",
+        "javascript",
+        response.status,
+        response.statusText
+      );
+    }
+    const data = await response.json();
+    return data;
+  } catch (error) {
+    if (error instanceof AsgardeoAPIError) {
+      throw error;
+    }
+    throw new AsgardeoAPIError(
+      `Network or parsing error: ${error instanceof Error ? error.message : "Unknown error"}`,
+      "getBrandingPreference-NetworkError-001",
+      "javascript",
+      0,
+      "Network Error"
+    );
+  }
+};
+var getBrandingPreference_default = getBrandingPreference;
+
 // src/constants/ApplicationNativeAuthenticationConstants.ts
 var ApplicationNativeAuthenticationConstants = {
   SupportedAuthenticators: {
@@ -2868,6 +2966,19 @@ var AsgardeoJavaScriptClient_default = AsgardeoJavaScriptClient;
 // src/theme/createTheme.ts
 var lightTheme = {
   colors: {
+    action: {
+      active: "rgba(0, 0, 0, 0.54)",
+      hover: "rgba(0, 0, 0, 0.04)",
+      hoverOpacity: 0.04,
+      selected: "rgba(0, 0, 0, 0.08)",
+      selectedOpacity: 0.08,
+      disabled: "rgba(0, 0, 0, 0.26)",
+      disabledBackground: "rgba(0, 0, 0, 0.12)",
+      disabledOpacity: 0.38,
+      focus: "rgba(0, 0, 0, 0.12)",
+      focusOpacity: 0.12,
+      activatedOpacity: 0.12
+    },
     primary: {
       main: "#1a73e8",
       contrastText: "#ffffff"
@@ -2913,10 +3024,57 @@ var lightTheme = {
     small: "0 2px 8px rgba(0, 0, 0, 0.1)",
     medium: "0 4px 16px rgba(0, 0, 0, 0.15)",
     large: "0 8px 32px rgba(0, 0, 0, 0.2)"
+  },
+  typography: {
+    fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
+    fontSizes: {
+      xs: "0.75rem",
+      // 12px
+      sm: "0.875rem",
+      // 14px
+      md: "1rem",
+      // 16px
+      lg: "1.125rem",
+      // 18px
+      xl: "1.25rem",
+      // 20px
+      "2xl": "1.5rem",
+      // 24px
+      "3xl": "2.125rem"
+      // 34px
+    },
+    fontWeights: {
+      normal: 400,
+      medium: 500,
+      semibold: 600,
+      bold: 700
+    },
+    lineHeights: {
+      tight: 1.2,
+      normal: 1.4,
+      relaxed: 1.6
+    }
+  },
+  images: {
+    favicon: {},
+    logo: {}
   }
 };
 var darkTheme = {
   colors: {
+    action: {
+      active: "rgba(255, 255, 255, 0.70)",
+      hover: "rgba(255, 255, 255, 0.04)",
+      hoverOpacity: 0.04,
+      selected: "rgba(255, 255, 255, 0.08)",
+      selectedOpacity: 0.08,
+      disabled: "rgba(255, 255, 255, 0.26)",
+      disabledBackground: "rgba(255, 255, 255, 0.12)",
+      disabledOpacity: 0.38,
+      focus: "rgba(255, 255, 255, 0.12)",
+      focusOpacity: 0.12,
+      activatedOpacity: 0.12
+    },
     primary: {
       main: "#1a73e8",
       contrastText: "#ffffff"
@@ -2962,35 +3120,308 @@ var darkTheme = {
     small: "0 2px 8px rgba(0, 0, 0, 0.3)",
     medium: "0 4px 16px rgba(0, 0, 0, 0.4)",
     large: "0 8px 32px rgba(0, 0, 0, 0.5)"
+  },
+  typography: {
+    fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
+    fontSizes: {
+      xs: "0.75rem",
+      // 12px
+      sm: "0.875rem",
+      // 14px
+      md: "1rem",
+      // 16px
+      lg: "1.125rem",
+      // 18px
+      xl: "1.25rem",
+      // 20px
+      "2xl": "1.5rem",
+      // 24px
+      "3xl": "2.125rem"
+      // 34px
+    },
+    fontWeights: {
+      normal: 400,
+      medium: 500,
+      semibold: 600,
+      bold: 700
+    },
+    lineHeights: {
+      tight: 1.2,
+      normal: 1.4,
+      relaxed: 1.6
+    }
+  },
+  images: {
+    favicon: {},
+    logo: {}
   }
 };
 var toCssVariables = (theme) => {
   const cssVars = {};
-  cssVars["--asgardeo-color-primary-main"] = theme.colors.primary.main;
-  cssVars["--asgardeo-color-primary-contrastText"] = theme.colors.primary.contrastText;
-  cssVars["--asgardeo-color-secondary-main"] = theme.colors.secondary.main;
-  cssVars["--asgardeo-color-secondary-contrastText"] = theme.colors.secondary.contrastText;
-  cssVars["--asgardeo-color-background-surface"] = theme.colors.background.surface;
-  cssVars["--asgardeo-color-background-disabled"] = theme.colors.background.disabled;
-  cssVars["--asgardeo-color-background-body-main"] = theme.colors.background.body.main;
-  cssVars["--asgardeo-color-error-main"] = theme.colors.error.main;
-  cssVars["--asgardeo-color-error-contrastText"] = theme.colors.error.contrastText;
-  cssVars["--asgardeo-color-success-main"] = theme.colors.success.main;
-  cssVars["--asgardeo-color-success-contrastText"] = theme.colors.success.contrastText;
-  cssVars["--asgardeo-color-warning-main"] = theme.colors.warning.main;
-  cssVars["--asgardeo-color-warning-contrastText"] = theme.colors.warning.contrastText;
-  cssVars["--asgardeo-color-text-primary"] = theme.colors.text.primary;
-  cssVars["--asgardeo-color-text-secondary"] = theme.colors.text.secondary;
-  cssVars["--asgardeo-color-border"] = theme.colors.border;
-  cssVars["--asgardeo-spacing-unit"] = `${theme.spacing.unit}px`;
-  cssVars["--asgardeo-border-radius-small"] = theme.borderRadius.small;
-  cssVars["--asgardeo-border-radius-medium"] = theme.borderRadius.medium;
-  cssVars["--asgardeo-border-radius-large"] = theme.borderRadius.large;
-  cssVars["--asgardeo-shadow-small"] = theme.shadows.small;
-  cssVars["--asgardeo-shadow-medium"] = theme.shadows.medium;
-  cssVars["--asgardeo-shadow-large"] = theme.shadows.large;
+  const prefix = theme.cssVarPrefix || VendorConstants_default.VENDOR_PREFIX;
+  if (theme.colors?.action?.active) {
+    cssVars[`--${prefix}-color-action-active`] = theme.colors.action.active;
+  }
+  if (theme.colors?.action?.hover) {
+    cssVars[`--${prefix}-color-action-hover`] = theme.colors.action.hover;
+  }
+  if (theme.colors?.action?.hoverOpacity !== void 0) {
+    cssVars[`--${prefix}-color-action-hoverOpacity`] = theme.colors.action.hoverOpacity.toString();
+  }
+  if (theme.colors?.action?.selected) {
+    cssVars[`--${prefix}-color-action-selected`] = theme.colors.action.selected;
+  }
+  if (theme.colors?.action?.selectedOpacity !== void 0) {
+    cssVars[`--${prefix}-color-action-selectedOpacity`] = theme.colors.action.selectedOpacity.toString();
+  }
+  if (theme.colors?.action?.disabled) {
+    cssVars[`--${prefix}-color-action-disabled`] = theme.colors.action.disabled;
+  }
+  if (theme.colors?.action?.disabledBackground) {
+    cssVars[`--${prefix}-color-action-disabledBackground`] = theme.colors.action.disabledBackground;
+  }
+  if (theme.colors?.action?.disabledOpacity !== void 0) {
+    cssVars[`--${prefix}-color-action-disabledOpacity`] = theme.colors.action.disabledOpacity.toString();
+  }
+  if (theme.colors?.action?.focus) {
+    cssVars[`--${prefix}-color-action-focus`] = theme.colors.action.focus;
+  }
+  if (theme.colors?.action?.focusOpacity !== void 0) {
+    cssVars[`--${prefix}-color-action-focusOpacity`] = theme.colors.action.focusOpacity.toString();
+  }
+  if (theme.colors?.action?.activatedOpacity !== void 0) {
+    cssVars[`--${prefix}-color-action-activatedOpacity`] = theme.colors.action.activatedOpacity.toString();
+  }
+  if (theme.colors?.primary?.main) {
+    cssVars[`--${prefix}-color-primary-main`] = theme.colors.primary.main;
+  }
+  if (theme.colors?.primary?.contrastText) {
+    cssVars[`--${prefix}-color-primary-contrastText`] = theme.colors.primary.contrastText;
+  }
+  if (theme.colors?.secondary?.main) {
+    cssVars[`--${prefix}-color-secondary-main`] = theme.colors.secondary.main;
+  }
+  if (theme.colors?.secondary?.contrastText) {
+    cssVars[`--${prefix}-color-secondary-contrastText`] = theme.colors.secondary.contrastText;
+  }
+  if (theme.colors?.background?.surface) {
+    cssVars[`--${prefix}-color-background-surface`] = theme.colors.background.surface;
+  }
+  if (theme.colors?.background?.disabled) {
+    cssVars[`--${prefix}-color-background-disabled`] = theme.colors.background.disabled;
+  }
+  if (theme.colors?.background?.body?.main) {
+    cssVars[`--${prefix}-color-background-body-main`] = theme.colors.background.body.main;
+  }
+  if (theme.colors?.error?.main) {
+    cssVars[`--${prefix}-color-error-main`] = theme.colors.error.main;
+  }
+  if (theme.colors?.error?.contrastText) {
+    cssVars[`--${prefix}-color-error-contrastText`] = theme.colors.error.contrastText;
+  }
+  if (theme.colors?.success?.main) {
+    cssVars[`--${prefix}-color-success-main`] = theme.colors.success.main;
+  }
+  if (theme.colors?.success?.contrastText) {
+    cssVars[`--${prefix}-color-success-contrastText`] = theme.colors.success.contrastText;
+  }
+  if (theme.colors?.warning?.main) {
+    cssVars[`--${prefix}-color-warning-main`] = theme.colors.warning.main;
+  }
+  if (theme.colors?.warning?.contrastText) {
+    cssVars[`--${prefix}-color-warning-contrastText`] = theme.colors.warning.contrastText;
+  }
+  if (theme.colors?.text?.primary) {
+    cssVars[`--${prefix}-color-text-primary`] = theme.colors.text.primary;
+  }
+  if (theme.colors?.text?.secondary) {
+    cssVars[`--${prefix}-color-text-secondary`] = theme.colors.text.secondary;
+  }
+  if (theme.colors?.border) {
+    cssVars[`--${prefix}-color-border`] = theme.colors.border;
+  }
+  if (theme.spacing?.unit !== void 0) {
+    cssVars[`--${prefix}-spacing-unit`] = `${theme.spacing.unit}px`;
+  }
+  if (theme.borderRadius?.small) {
+    cssVars[`--${prefix}-border-radius-small`] = theme.borderRadius.small;
+  }
+  if (theme.borderRadius?.medium) {
+    cssVars[`--${prefix}-border-radius-medium`] = theme.borderRadius.medium;
+  }
+  if (theme.borderRadius?.large) {
+    cssVars[`--${prefix}-border-radius-large`] = theme.borderRadius.large;
+  }
+  if (theme.shadows?.small) {
+    cssVars[`--${prefix}-shadow-small`] = theme.shadows.small;
+  }
+  if (theme.shadows?.medium) {
+    cssVars[`--${prefix}-shadow-medium`] = theme.shadows.medium;
+  }
+  if (theme.shadows?.large) {
+    cssVars[`--${prefix}-shadow-large`] = theme.shadows.large;
+  }
+  if (theme.typography?.fontFamily) {
+    cssVars[`--${prefix}-typography-fontFamily`] = theme.typography.fontFamily;
+  }
+  if (theme.typography?.fontSizes?.xs) {
+    cssVars[`--${prefix}-typography-fontSize-xs`] = theme.typography.fontSizes.xs;
+  }
+  if (theme.typography?.fontSizes?.sm) {
+    cssVars[`--${prefix}-typography-fontSize-sm`] = theme.typography.fontSizes.sm;
+  }
+  if (theme.typography?.fontSizes?.md) {
+    cssVars[`--${prefix}-typography-fontSize-md`] = theme.typography.fontSizes.md;
+  }
+  if (theme.typography?.fontSizes?.lg) {
+    cssVars[`--${prefix}-typography-fontSize-lg`] = theme.typography.fontSizes.lg;
+  }
+  if (theme.typography?.fontSizes?.xl) {
+    cssVars[`--${prefix}-typography-fontSize-xl`] = theme.typography.fontSizes.xl;
+  }
+  if (theme.typography?.fontSizes?.["2xl"]) {
+    cssVars[`--${prefix}-typography-fontSize-2xl`] = theme.typography.fontSizes["2xl"];
+  }
+  if (theme.typography?.fontSizes?.["3xl"]) {
+    cssVars[`--${prefix}-typography-fontSize-3xl`] = theme.typography.fontSizes["3xl"];
+  }
+  if (theme.typography?.fontWeights?.normal !== void 0) {
+    cssVars[`--${prefix}-typography-fontWeight-normal`] = theme.typography.fontWeights.normal.toString();
+  }
+  if (theme.typography?.fontWeights?.medium !== void 0) {
+    cssVars[`--${prefix}-typography-fontWeight-medium`] = theme.typography.fontWeights.medium.toString();
+  }
+  if (theme.typography?.fontWeights?.semibold !== void 0) {
+    cssVars[`--${prefix}-typography-fontWeight-semibold`] = theme.typography.fontWeights.semibold.toString();
+  }
+  if (theme.typography?.fontWeights?.bold !== void 0) {
+    cssVars[`--${prefix}-typography-fontWeight-bold`] = theme.typography.fontWeights.bold.toString();
+  }
+  if (theme.typography?.lineHeights?.tight !== void 0) {
+    cssVars[`--${prefix}-typography-lineHeight-tight`] = theme.typography.lineHeights.tight.toString();
+  }
+  if (theme.typography?.lineHeights?.normal !== void 0) {
+    cssVars[`--${prefix}-typography-lineHeight-normal`] = theme.typography.lineHeights.normal.toString();
+  }
+  if (theme.typography?.lineHeights?.relaxed !== void 0) {
+    cssVars[`--${prefix}-typography-lineHeight-relaxed`] = theme.typography.lineHeights.relaxed.toString();
+  }
+  if (theme.images) {
+    Object.keys(theme.images).forEach((imageKey) => {
+      const imageConfig = theme.images[imageKey];
+      if (imageConfig?.url) {
+        cssVars[`--${prefix}-image-${imageKey}-url`] = imageConfig.url;
+      }
+      if (imageConfig?.title) {
+        cssVars[`--${prefix}-image-${imageKey}-title`] = imageConfig.title;
+      }
+      if (imageConfig?.alt) {
+        cssVars[`--${prefix}-image-${imageKey}-alt`] = imageConfig.alt;
+      }
+    });
+  }
   return cssVars;
 };
+var toThemeVars = (theme) => {
+  const prefix = theme.cssVarPrefix || VendorConstants_default.VENDOR_PREFIX;
+  const themeVars = {
+    colors: {
+      action: {
+        active: `var(--${prefix}-color-action-active)`,
+        hover: `var(--${prefix}-color-action-hover)`,
+        hoverOpacity: `var(--${prefix}-color-action-hoverOpacity)`,
+        selected: `var(--${prefix}-color-action-selected)`,
+        selectedOpacity: `var(--${prefix}-color-action-selectedOpacity)`,
+        disabled: `var(--${prefix}-color-action-disabled)`,
+        disabledBackground: `var(--${prefix}-color-action-disabledBackground)`,
+        disabledOpacity: `var(--${prefix}-color-action-disabledOpacity)`,
+        focus: `var(--${prefix}-color-action-focus)`,
+        focusOpacity: `var(--${prefix}-color-action-focusOpacity)`,
+        activatedOpacity: `var(--${prefix}-color-action-activatedOpacity)`
+      },
+      primary: {
+        main: `var(--${prefix}-color-primary-main)`,
+        contrastText: `var(--${prefix}-color-primary-contrastText)`
+      },
+      secondary: {
+        main: `var(--${prefix}-color-secondary-main)`,
+        contrastText: `var(--${prefix}-color-secondary-contrastText)`
+      },
+      background: {
+        surface: `var(--${prefix}-color-background-surface)`,
+        disabled: `var(--${prefix}-color-background-disabled)`,
+        body: {
+          main: `var(--${prefix}-color-background-body-main)`
+        }
+      },
+      error: {
+        main: `var(--${prefix}-color-error-main)`,
+        contrastText: `var(--${prefix}-color-error-contrastText)`
+      },
+      success: {
+        main: `var(--${prefix}-color-success-main)`,
+        contrastText: `var(--${prefix}-color-success-contrastText)`
+      },
+      warning: {
+        main: `var(--${prefix}-color-warning-main)`,
+        contrastText: `var(--${prefix}-color-warning-contrastText)`
+      },
+      text: {
+        primary: `var(--${prefix}-color-text-primary)`,
+        secondary: `var(--${prefix}-color-text-secondary)`
+      },
+      border: `var(--${prefix}-color-border)`
+    },
+    spacing: {
+      unit: `var(--${prefix}-spacing-unit)`
+    },
+    borderRadius: {
+      small: `var(--${prefix}-border-radius-small)`,
+      medium: `var(--${prefix}-border-radius-medium)`,
+      large: `var(--${prefix}-border-radius-large)`
+    },
+    shadows: {
+      small: `var(--${prefix}-shadow-small)`,
+      medium: `var(--${prefix}-shadow-medium)`,
+      large: `var(--${prefix}-shadow-large)`
+    },
+    typography: {
+      fontFamily: `var(--${prefix}-typography-fontFamily)`,
+      fontSizes: {
+        xs: `var(--${prefix}-typography-fontSize-xs)`,
+        sm: `var(--${prefix}-typography-fontSize-sm)`,
+        md: `var(--${prefix}-typography-fontSize-md)`,
+        lg: `var(--${prefix}-typography-fontSize-lg)`,
+        xl: `var(--${prefix}-typography-fontSize-xl)`,
+        "2xl": `var(--${prefix}-typography-fontSize-2xl)`,
+        "3xl": `var(--${prefix}-typography-fontSize-3xl)`
+      },
+      fontWeights: {
+        normal: `var(--${prefix}-typography-fontWeight-normal)`,
+        medium: `var(--${prefix}-typography-fontWeight-medium)`,
+        semibold: `var(--${prefix}-typography-fontWeight-semibold)`,
+        bold: `var(--${prefix}-typography-fontWeight-bold)`
+      },
+      lineHeights: {
+        tight: `var(--${prefix}-typography-lineHeight-tight)`,
+        normal: `var(--${prefix}-typography-lineHeight-normal)`,
+        relaxed: `var(--${prefix}-typography-lineHeight-relaxed)`
+      }
+    }
+  };
+  if (theme.images) {
+    themeVars.images = {};
+    Object.keys(theme.images).forEach((imageKey) => {
+      const imageConfig = theme.images[imageKey];
+      themeVars.images[imageKey] = {
+        url: imageConfig?.url ? `var(--${prefix}-image-${imageKey}-url)` : void 0,
+        title: imageConfig?.title ? `var(--${prefix}-image-${imageKey}-title)` : void 0,
+        alt: imageConfig?.alt ? `var(--${prefix}-image-${imageKey}-alt)` : void 0
+      };
+    });
+  }
+  return themeVars;
+};
 var createTheme = (config = {}, isDark = false) => {
   const baseTheme = isDark ? darkTheme : lightTheme;
   const mergedConfig = {
@@ -2999,6 +3430,10 @@ var createTheme = (config = {}, isDark = false) => {
     colors: {
       ...baseTheme.colors,
       ...config.colors,
+      action: {
+        ...baseTheme.colors.action,
+        ...config.colors?.action || {}
+      },
       secondary: {
         ...baseTheme.colors.secondary,
         ...config.colors?.secondary || {}
@@ -3015,11 +3450,32 @@ var createTheme = (config = {}, isDark = false) => {
     shadows: {
       ...baseTheme.shadows,
       ...config.shadows
+    },
+    typography: {
+      ...baseTheme.typography,
+      ...config.typography,
+      fontSizes: {
+        ...baseTheme.typography.fontSizes,
+        ...config.typography?.fontSizes || {}
+      },
+      fontWeights: {
+        ...baseTheme.typography.fontWeights,
+        ...config.typography?.fontWeights || {}
+      },
+      lineHeights: {
+        ...baseTheme.typography.lineHeights,
+        ...config.typography?.lineHeights || {}
+      }
+    },
+    images: {
+      ...baseTheme.images,
+      ...config.images
     }
   };
   return {
     ...mergedConfig,
-    cssVariables: toCssVariables(mergedConfig)
+    cssVariables: toCssVariables(mergedConfig),
+    vars: toThemeVars(mergedConfig)
   };
 };
 var createTheme_default = createTheme;
@@ -3051,6 +3507,58 @@ var deepMerge = (target, ...sources) => {
 };
 var deepMerge_default = deepMerge;
 
+// src/utils/deriveOrganizationHandleFromBaseUrl.ts
+var deriveOrganizationHandleFromBaseUrl = (baseUrl) => {
+  if (!baseUrl) {
+    throw new AsgardeoRuntimeError(
+      "Base URL is required to derive organization handle.",
+      "javascript-deriveOrganizationHandleFromBaseUrl-ValidationError-001",
+      "javascript",
+      "A valid base URL must be provided to extract the organization handle."
+    );
+  }
+  let parsedUrl;
+  try {
+    parsedUrl = new URL(baseUrl);
+  } catch (error) {
+    throw new AsgardeoRuntimeError(
+      `Invalid base URL format: ${baseUrl}`,
+      "javascript-deriveOrganizationHandleFromBaseUrl-ValidationError-002",
+      "javascript",
+      "The provided base URL does not conform to valid URL syntax."
+    );
+  }
+  const hostname = parsedUrl.hostname.toLowerCase();
+  if (!hostname.endsWith(".asgardeo.io")) {
+    throw new AsgardeoRuntimeError(
+      "Organization handle is required since a custom domain is configured.",
+      "javascript-deriveOrganizationHandleFromBaseUrl-CustomDomainError-001",
+      "javascript",
+      "The provided base URL uses a custom domain. Please provide the organizationHandle explicitly in the configuration."
+    );
+  }
+  const pathSegments = parsedUrl.pathname.split("/").filter((segment) => segment.length > 0);
+  if (pathSegments.length < 2 || pathSegments[0] !== "t") {
+    throw new AsgardeoRuntimeError(
+      "Organization handle is required since a custom domain is configured.",
+      "javascript-deriveOrganizationHandleFromBaseUrl-CustomDomainError-002",
+      "javascript",
+      "The provided base URL does not follow the expected Asgardeo URL pattern (/t/{orgHandle}). Please provide the organizationHandle explicitly in the configuration."
+    );
+  }
+  const organizationHandle = pathSegments[1];
+  if (!organizationHandle || organizationHandle.trim().length === 0) {
+    throw new AsgardeoRuntimeError(
+      "Organization handle is required since a custom domain is configured.",
+      "javascript-deriveOrganizationHandleFromBaseUrl-CustomDomainError-003",
+      "javascript",
+      "The organization handle could not be extracted from the base URL. Please provide the organizationHandle explicitly in the configuration."
+    );
+  }
+  return organizationHandle;
+};
+var deriveOrganizationHandleFromBaseUrl_default = deriveOrganizationHandleFromBaseUrl;
+
 // src/utils/flattenUserSchema.ts
 var flattenUserSchema = (schemas) => {
   const flattenedAttributes = [];
@@ -3291,8 +3799,18 @@ var translations = {
   "organization.switcher.members": "members",
   "organization.switcher.member": "member",
   "organization.switcher.create.organization": "Create Organization",
-  "organization.switcher.manage.organizations": "Manage Organization",
+  "organization.switcher.manage.organizations": "Manage Organizations",
   "organization.switcher.manage.button": "Manage",
+  "organization.switcher.organizations.title": "Organizations",
+  "organization.switcher.switch.button": "Switch",
+  "organization.switcher.no.access": "No Access",
+  "organization.switcher.status.label": "Status:",
+  "organization.switcher.showing.count": "Showing {showing} of {total} organizations",
+  "organization.switcher.refresh.button": "Refresh",
+  "organization.switcher.load.more": "Load More Organizations",
+  "organization.switcher.loading.more": "Loading...",
+  "organization.switcher.no.organizations": "No organizations found",
+  "organization.switcher.error.prefix": "Error:",
   "organization.profile.title": "Organization Profile",
   "organization.profile.loading": "Loading organization...",
   "organization.profile.error": "Failed to load organization",
@@ -3379,6 +3897,112 @@ var resolveFieldName_default = resolveFieldName;
 // src/utils/withVendorCSSClassPrefix.ts
 var withVendorCSSClassPrefix = (className) => `${VendorConstants_default.VENDOR_PREFIX}-${className}`;
 var withVendorCSSClassPrefix_default = withVendorCSSClassPrefix;
+
+// src/utils/transformBrandingPreferenceToTheme.ts
+var extractColorValue = (colorVariant) => {
+  return colorVariant?.main;
+};
+var extractContrastText = (colorVariant) => {
+  return colorVariant?.contrastText;
+};
+var transformThemeVariant = (themeVariant, isDark = false) => {
+  const colors = themeVariant.colors;
+  const buttons = themeVariant.buttons;
+  const inputs = themeVariant.inputs;
+  const images = themeVariant.images;
+  return {
+    colors: {
+      action: {
+        active: isDark ? "rgba(255, 255, 255, 0.70)" : "rgba(0, 0, 0, 0.54)",
+        hover: isDark ? "rgba(255, 255, 255, 0.04)" : "rgba(0, 0, 0, 0.04)",
+        hoverOpacity: 0.04,
+        selected: isDark ? "rgba(255, 255, 255, 0.08)" : "rgba(0, 0, 0, 0.08)",
+        selectedOpacity: 0.08,
+        disabled: isDark ? "rgba(255, 255, 255, 0.26)" : "rgba(0, 0, 0, 0.26)",
+        disabledBackground: isDark ? "rgba(255, 255, 255, 0.12)" : "rgba(0, 0, 0, 0.12)",
+        disabledOpacity: 0.38,
+        focus: isDark ? "rgba(255, 255, 255, 0.12)" : "rgba(0, 0, 0, 0.12)",
+        focusOpacity: 0.12,
+        activatedOpacity: 0.12
+      },
+      primary: {
+        main: extractColorValue(colors?.primary),
+        contrastText: extractContrastText(colors?.primary)
+      },
+      secondary: {
+        main: extractColorValue(colors?.secondary),
+        contrastText: extractContrastText(colors?.secondary)
+      },
+      background: {
+        surface: extractColorValue(colors?.background?.surface),
+        disabled: extractColorValue(colors?.background?.surface),
+        body: {
+          main: extractColorValue(colors?.background?.body)
+        }
+      },
+      text: {
+        primary: colors?.text?.primary,
+        secondary: colors?.text?.secondary
+      },
+      border: colors?.outlined?.default,
+      error: {
+        main: extractColorValue(colors?.alerts?.error),
+        contrastText: extractContrastText(colors?.alerts?.error)
+      },
+      success: {
+        main: extractColorValue(colors?.alerts?.info),
+        contrastText: extractContrastText(colors?.alerts?.info)
+      },
+      warning: {
+        main: extractColorValue(colors?.alerts?.warning),
+        contrastText: extractContrastText(colors?.alerts?.warning)
+      }
+    },
+    // Extract border radius from buttons or inputs
+    borderRadius: {
+      small: buttons?.primary?.base?.border?.borderRadius || inputs?.base?.border?.borderRadius,
+      medium: buttons?.secondary?.base?.border?.borderRadius,
+      large: buttons?.externalConnection?.base?.border?.borderRadius
+    },
+    // Extract and transform images
+    images: {
+      favicon: images?.favicon ? {
+        url: images.favicon.imgURL,
+        title: images.favicon.title,
+        alt: images.favicon.altText
+      } : void 0,
+      logo: images?.logo ? {
+        url: images.logo.imgURL,
+        title: images.logo.title,
+        alt: images.logo.altText
+      } : void 0
+    }
+  };
+};
+var transformBrandingPreferenceToTheme = (brandingPreference, forceTheme) => {
+  const themeConfig = brandingPreference?.preference?.theme;
+  if (!themeConfig) {
+    return createTheme_default({}, false);
+  }
+  let activeThemeKey;
+  if (forceTheme) {
+    activeThemeKey = forceTheme.toUpperCase();
+  } else {
+    activeThemeKey = themeConfig.activeTheme || "LIGHT";
+  }
+  const themeVariant = themeConfig[activeThemeKey];
+  if (!themeVariant) {
+    const fallbackVariant = themeConfig.LIGHT || themeConfig.DARK;
+    if (fallbackVariant) {
+      const transformedConfig2 = transformThemeVariant(fallbackVariant, activeThemeKey === "DARK");
+      return createTheme_default(transformedConfig2, activeThemeKey === "DARK");
+    }
+    return createTheme_default({}, activeThemeKey === "DARK");
+  }
+  const transformedConfig = transformThemeVariant(themeVariant, activeThemeKey === "DARK");
+  return createTheme_default(transformedConfig, activeThemeKey === "DARK");
+};
+var transformBrandingPreferenceToTheme_default = transformBrandingPreferenceToTheme;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ApplicationNativeAuthenticationConstants,
@@ -3410,6 +4034,7 @@ var withVendorCSSClassPrefix_default = withVendorCSSClassPrefix;
   createPatchOperations,
   createTheme,
   deepMerge,
+  deriveOrganizationHandleFromBaseUrl,
   executeEmbeddedSignInFlow,
   executeEmbeddedSignUpFlow,
   extractPkceStorageKeyFromState,
@@ -3419,6 +4044,7 @@ var withVendorCSSClassPrefix_default = withVendorCSSClassPrefix;
   generateUserProfile,
   get,
   getAllOrganizations,
+  getBrandingPreference,
   getI18nBundles,
   getLatestStateParam,
   getMeOrganizations,
@@ -3429,10 +4055,12 @@ var withVendorCSSClassPrefix_default = withVendorCSSClassPrefix;
   initializeEmbeddedSignInFlow,
   isEmpty,
   processOpenIDScopes,
+  processUsername,
   removeTrailingSlash,
   resolveFieldName,
   resolveFieldType,
   set,
+  transformBrandingPreferenceToTheme,
   updateMeProfile,
   updateOrganization,
   withVendorCSSClassPrefix