From 60a8dcfa1b3ff5874c70b12b13f78db92a4d555c Mon Sep 17 00:00:00 2001
From: Brion <info@brionmario.com>
Date: Sat, 27 Jun 2026 00:10:34 +0530
Subject: [PATCH 1/5] Remove branding context and related hooks from React and
 Vue packages

- Deleted useBrandingContext and useBranding hooks from React package.
- Removed BrandingProvider and its related logic from both React and Vue packages.
- Updated ThemeProvider to eliminate dependency on branding context.
- Adjusted ThunderIDProvider to directly use ThemeProvider without BrandingProvider.
- Cleaned up tests and keys related to branding context in Vue package.
- Refactored ThemeContextValue to remove branding-related properties.
---
 .../__tests__/getBrandingPreference.test.ts   | 268 ------------------
 .../src/api/getBrandingPreference.ts          | 201 -------------
 packages/javascript/src/index.ts              |  16 --
 .../src/models/branding-preference.ts         | 267 -----------------
 packages/javascript/src/models/config.ts      |   7 -
 .../contexts/ThunderID/ThunderIDProvider.tsx  |  50 ++--
 .../nextjs/src/server/ThunderIDProvider.tsx   |  23 +-
 .../__tests__/getBrandingPreference.test.ts   | 115 --------
 .../server/actions/getBrandingPreference.ts   |  49 ----
 packages/nuxt/src/index.ts                    |   2 +-
 packages/nuxt/src/module.ts                   |   5 +-
 .../src/runtime/components/ThunderIDRoot.ts   | 122 +++-----
 .../nuxt/src/runtime/plugins/thunderid.ts     |  15 +-
 .../src/runtime/server/ThunderIDNuxtClient.ts |   7 -
 .../runtime/server/plugins/thunderid-ssr.ts   |  13 +-
 .../routes/auth/branding/branding.get.ts      |  78 -----
 packages/nuxt/src/runtime/types.ts            |   8 -
 .../nuxt/tests/unit/thunderid-root.test.ts    |  46 +--
 .../nuxt/tests/unit/thunderid-ssr.test.ts     |  37 +--
 .../src/contexts/Branding/BrandingContext.ts  |  58 ----
 .../contexts/Branding/BrandingProvider.tsx    | 158 -----------
 .../contexts/Branding/useBrandingContext.ts   |  54 ----
 .../react/src/contexts/Theme/ThemeContext.ts  |  12 -
 .../src/contexts/Theme/ThemeProvider.tsx      |   8 -
 .../contexts/ThunderID/ThunderIDProvider.tsx  | 128 ++-------
 packages/react/src/hooks/useBranding.ts       | 157 ----------
 packages/react/src/index.ts                   |  16 +-
 .../composables/secondary-composables.test.ts |  47 +--
 packages/vue/src/composables/useBranding.ts   |  59 ----
 packages/vue/src/index.ts                     |   4 -
 packages/vue/src/keys.ts                      |   6 -
 packages/vue/src/models/contexts.ts           |  31 --
 .../vue/src/providers/BrandingProvider.ts     | 142 ----------
 packages/vue/src/providers/ThemeProvider.ts   |  76 +----
 .../vue/src/providers/ThunderIDProvider.ts    | 118 ++++----
 35 files changed, 172 insertions(+), 2231 deletions(-)
 delete mode 100644 packages/javascript/src/api/__tests__/getBrandingPreference.test.ts
 delete mode 100644 packages/javascript/src/api/getBrandingPreference.ts
 delete mode 100644 packages/javascript/src/models/branding-preference.ts
 delete mode 100644 packages/nextjs/src/server/actions/__tests__/getBrandingPreference.test.ts
 delete mode 100644 packages/nextjs/src/server/actions/getBrandingPreference.ts
 delete mode 100644 packages/nuxt/src/runtime/server/routes/auth/branding/branding.get.ts
 delete mode 100644 packages/react/src/contexts/Branding/BrandingContext.ts
 delete mode 100644 packages/react/src/contexts/Branding/BrandingProvider.tsx
 delete mode 100644 packages/react/src/contexts/Branding/useBrandingContext.ts
 delete mode 100644 packages/react/src/hooks/useBranding.ts
 delete mode 100644 packages/vue/src/composables/useBranding.ts
 delete mode 100644 packages/vue/src/providers/BrandingProvider.ts

diff --git a/packages/javascript/src/api/__tests__/getBrandingPreference.test.ts b/packages/javascript/src/api/__tests__/getBrandingPreference.test.ts
deleted file mode 100644
index fa6e884..0000000
--- a/packages/javascript/src/api/__tests__/getBrandingPreference.test.ts
+++ /dev/null
@@ -1,268 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {describe, it, expect, vi, beforeEach} from 'vitest';
-import ThunderIDAPIError from '../../errors/ThunderIDAPIError';
-import {BrandingPreference} from '../../models/branding-preference';
-import getBrandingPreference from '../getBrandingPreference';
-
-describe('getBrandingPreference', (): void => {
-  beforeEach((): void => {
-    vi.resetAllMocks();
-  });
-
-  it('should fetch branding preference successfully', async (): Promise<void> => {
-    const mockBrandingPreference: BrandingPreference = {
-      locale: 'en-US',
-      name: 'dxlab',
-      preference: {
-        configs: {
-          isBrandingEnabled: true,
-          removeDefaultBranding: false,
-        },
-        layout: {
-          activeLayout: 'centered',
-        },
-        organizationDetails: {
-          displayName: '',
-          supportEmail: '',
-        },
-        theme: {
-          DARK: {
-            buttons: {
-              primary: {
-                base: {
-                  border: {
-                    borderRadius: '22px',
-                  },
-                  font: {
-                    color: '#ffffff',
-                  },
-                },
-              },
-            },
-            colors: {
-              primary: {
-                main: '#FF7300',
-              },
-              secondary: {
-                main: '#E0E1E2',
-              },
-            },
-          },
-          LIGHT: {
-            buttons: {
-              primary: {
-                base: {
-                  border: {
-                    borderRadius: '22px',
-                  },
-                  font: {
-                    color: '#ffffffe6',
-                  },
-                },
-              },
-            },
-            colors: {
-              primary: {
-                main: '#FF7300',
-              },
-              secondary: {
-                main: '#E0E1E2',
-              },
-            },
-          },
-          activeTheme: 'DARK',
-        },
-        urls: {
-          selfSignUpURL: 'https://localhost:5173/signup',
-        },
-      },
-      type: 'ORG',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockBrandingPreference),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const result: BrandingPreference = await getBrandingPreference({baseUrl});
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/branding-preference/resolve`, {
-      headers: {
-        Accept: 'application/json',
-        'Content-Type': 'application/json',
-      },
-      method: 'GET',
-    });
-    expect(result).toEqual(mockBrandingPreference);
-  });
-
-  it('should fetch branding preference with query parameters', async (): Promise<void> => {
-    const mockBrandingPreference: BrandingPreference = {
-      locale: 'en-US',
-      name: 'custom',
-      type: 'ORG',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockBrandingPreference),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    await getBrandingPreference({
-      baseUrl,
-      locale: 'en-US',
-      name: 'custom',
-      type: 'org',
-    });
-
-    expect(fetch).toHaveBeenCalledWith(
-      `${baseUrl}/api/server/v1/branding-preference/resolve?locale=en-US&name=custom&type=org`,
-      {
-        headers: {
-          Accept: 'application/json',
-          'Content-Type': 'application/json',
-        },
-        method: 'GET',
-      },
-    );
-  });
-
-  it('should handle custom fetcher', async (): Promise<void> => {
-    const mockBrandingPreference: BrandingPreference = {
-      name: 'default',
-      type: 'ORG',
-    };
-
-    const customFetcher: typeof fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockBrandingPreference),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    await getBrandingPreference({baseUrl, fetcher: customFetcher});
-
-    expect(customFetcher).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/branding-preference/resolve`, {
-      headers: {
-        Accept: 'application/json',
-        'Content-Type': 'application/json',
-      },
-      method: 'GET',
-    });
-  });
-
-  it('should handle errors thrown directly by custom fetcher', async (): Promise<void> => {
-    const customFetcher: typeof fetch = vi.fn().mockImplementation(() => {
-      throw new Error('Custom fetcher failure');
-    });
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getBrandingPreference({baseUrl, fetcher: customFetcher})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getBrandingPreference({baseUrl, fetcher: customFetcher})).rejects.toThrow(
-      'Network or parsing error: Custom fetcher failure',
-    );
-  });
-
-  it('should handle invalid base URL', async (): Promise<void> => {
-    const invalidUrl = 'invalid-url';
-
-    await expect(getBrandingPreference({baseUrl: invalidUrl})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getBrandingPreference({baseUrl: invalidUrl})).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should throw ThunderIDAPIError for undefined baseUrl', async (): Promise<void> => {
-    await expect(getBrandingPreference({} as any)).rejects.toThrow(ThunderIDAPIError);
-    await expect(getBrandingPreference({} as any)).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should throw ThunderIDAPIError for empty string baseUrl', async (): Promise<void> => {
-    await expect(getBrandingPreference({baseUrl: ''})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getBrandingPreference({baseUrl: ''})).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should handle HTTP error responses', async (): Promise<void> => {
-    global.fetch = vi.fn().mockResolvedValue({
-      ok: false,
-      status: 404,
-      statusText: 'Not Found',
-      text: () => Promise.resolve('Branding preference not found'),
-    });
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getBrandingPreference({baseUrl})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getBrandingPreference({baseUrl})).rejects.toThrow(
-      'Failed to get branding preference: Branding preference not found',
-    );
-  });
-
-  it('should handle network errors', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue(new Error('Network error'));
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getBrandingPreference({baseUrl})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getBrandingPreference({baseUrl})).rejects.toThrow('Network or parsing error: Network error');
-  });
-
-  it('should handle non-Error rejections', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue('unexpected failure');
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getBrandingPreference({baseUrl})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getBrandingPreference({baseUrl})).rejects.toThrow('Network or parsing error: Unknown error');
-  });
-
-  it('should pass through custom headers', async (): Promise<void> => {
-    const mockBrandingPreference: BrandingPreference = {
-      name: 'default',
-      type: 'ORG',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockBrandingPreference),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const customHeaders: Record<string, string> = {
-      Authorization: 'Bearer token',
-      'X-Custom-Header': 'custom-value',
-    };
-
-    await getBrandingPreference({
-      baseUrl,
-      headers: customHeaders,
-    });
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/branding-preference/resolve`, {
-      headers: {
-        Accept: 'application/json',
-        Authorization: 'Bearer token',
-        'Content-Type': 'application/json',
-        'X-Custom-Header': 'custom-value',
-      },
-      method: 'GET',
-    });
-  });
-});
diff --git a/packages/javascript/src/api/getBrandingPreference.ts b/packages/javascript/src/api/getBrandingPreference.ts
deleted file mode 100644
index 81d47ff..0000000
--- a/packages/javascript/src/api/getBrandingPreference.ts
+++ /dev/null
@@ -1,201 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import ThunderIDAPIError from '../errors/ThunderIDAPIError';
-import {BrandingPreference} from '../models/branding-preference';
-import logger from '../utils/logger';
-
-/**
- * Configuration for the getBrandingPreference request
- */
-export interface GetBrandingPreferenceConfig extends Omit<RequestInit, 'method'> {
-  /**
-   * The base URL for the API endpoint.
-   */
-  baseUrl: string;
-  /**
-   * Optional custom fetcher function.
-   * If not provided, native fetch will be used
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * Locale for the branding preference
-   */
-  locale?: string;
-  /**
-   * Name of the branding preference
-   */
-  name?: string;
-  /**
-   * Type of the branding preference
-   */
-  type?: string;
-}
-
-/**
- * Retrieves branding preference configuration.
- *
- * @param config - Configuration object containing baseUrl, optional query parameters, and request config.
- * @returns A promise that resolves with the branding preference information.
- * @example
- * ```typescript
- * // Using default fetch
- * try {
- *   const response = await getBrandingPreference({
- *     baseUrl: "https://localhost:8090",
- *     locale: "en-US",
- *     name: "my-branding",
- *     type: "org"
- *   });
- *   console.log(response.theme);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get branding preference:', error.message);
- *   }
- * }
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher (e.g., axios-based httpClient)
- * try {
- *   const response = await getBrandingPreference({
- *     baseUrl: "https://localhost:8090",
- *     locale: "en-US",
- *     name: "my-branding",
- *     type: "org",
- *     fetcher: async (url, config) => {
- *       const response = await httpClient({
- *         url,
- *         method: config.method,
- *         headers: config.headers,
- *         ...config
- *       });
- *       // Convert axios-like response to fetch-like Response
- *       return {
- *         ok: response.status >= 200 && response.status < 300,
- *         status: response.status,
- *         statusText: response.statusText,
- *         json: () => Promise.resolve(response.data),
- *         text: () => Promise.resolve(typeof response.data === 'string' ? response.data : JSON.stringify(response.data))
- *       } as Response;
- *     }
- *   });
- *   console.log(response.theme);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get branding preference:', error.message);
- *   }
- * }
- * ```
- */
-const getBrandingPreference = async ({
-  baseUrl,
-  locale,
-  name,
-  type,
-  fetcher,
-  ...requestConfig
-}: GetBrandingPreferenceConfig): Promise<BrandingPreference> => {
-  try {
-    // eslint-disable-next-line no-new
-    new URL(baseUrl);
-  } catch (error) {
-    throw new ThunderIDAPIError(
-      `Invalid base URL provided. ${error?.toString()}`,
-      'getBrandingPreference-ValidationError-001',
-      'javascript',
-      400,
-      'The provided `baseUrl` does not adhere to the URL schema.',
-    );
-  }
-
-  const queryParams: URLSearchParams = new URLSearchParams(
-    Object.fromEntries(
-      Object.entries({
-        locale: locale || '',
-        name: name || '',
-        type: type || '',
-      }).filter(([, value]: [string, string]) => Boolean(value)),
-    ),
-  );
-
-  const fetchFn: typeof fetch = fetcher || fetch;
-  const resolvedUrl = `${baseUrl}/api/server/v1/branding-preference/resolve${
-    queryParams.toString() ? `?${queryParams.toString()}` : ''
-  }`;
-
-  const requestInit: RequestInit = {
-    ...requestConfig,
-    headers: {
-      Accept: 'application/json',
-      'Content-Type': 'application/json',
-      ...requestConfig.headers,
-    },
-    method: 'GET',
-  };
-
-  try {
-    const response: Response = await fetchFn(resolvedUrl, requestInit);
-
-    if (!response?.ok) {
-      const errorText: string = await response.text();
-
-      let errorDescription: string;
-      try {
-        const errorBody: {description?: string; message?: string} = JSON.parse(errorText) as {
-          description?: string;
-          message?: string;
-        };
-        errorDescription = errorBody?.description || errorBody?.message || errorText;
-      } catch {
-        errorDescription = errorText;
-      }
-
-      logger.warn(
-        `[BrandingError] ${errorDescription} To resolve this issue, please configure branding preferences in the ThunderID console. If you want to suppress this warning and stop fetching branding preferences, set \`<ThunderIDProvider>\` -> \`preferences\` -> \`theme\` -> \`inheritFromBranding\` to false.`,
-      );
-
-      throw new ThunderIDAPIError(
-        errorText,
-        'getBrandingPreference-ResponseError-001',
-        'javascript',
-        response.status,
-        response.statusText,
-        'Failed to get branding preference',
-      );
-    }
-
-    const data: BrandingPreference = (await response.json()) as BrandingPreference;
-    return data;
-  } catch (error) {
-    if (error instanceof ThunderIDAPIError) {
-      throw error;
-    }
-
-    throw new ThunderIDAPIError(
-      `Network or parsing error: ${error instanceof Error ? error.message : 'Unknown error'}`,
-      'getBrandingPreference-NetworkError-001',
-      'javascript',
-      0,
-      'Network Error',
-    );
-  }
-};
-
-export default getBrandingPreference;
diff --git a/packages/javascript/src/index.ts b/packages/javascript/src/index.ts
index 42f227e..ad8d796 100644
--- a/packages/javascript/src/index.ts
+++ b/packages/javascript/src/index.ts
@@ -42,8 +42,6 @@ export {default as updateOrganization, createPatchOperations} from './api/update
 export type {UpdateOrganizationConfig} from './api/updateOrganization';
 export {default as updateMeProfile} from './api/updateMeProfile';
 export type {UpdateMeProfileConfig} from './api/updateMeProfile';
-export {default as getBrandingPreference} from './api/getBrandingPreference';
-export type {GetBrandingPreferenceConfig} from './api/getBrandingPreference';
 
 export {default as ApplicationNativeAuthenticationConstants} from './constants/ApplicationNativeAuthenticationConstants';
 export {default as TokenConstants} from './constants/TokenConstants';
@@ -168,18 +166,6 @@ export type {SessionData} from './models/session';
 export type {Organization} from './models/organization';
 export type {TranslationFn} from './models/translation';
 export type {ResolveFlowTemplateLiteralsOptions} from './models/vars';
-export type {
-  BrandingPreference,
-  BrandingPreferenceConfig,
-  BrandingLayout,
-  BrandingTheme,
-  ThemeVariant,
-  ButtonsConfig,
-  ColorsConfig,
-  ColorVariants,
-  BrandingOrganizationDetails,
-  UrlsConfig,
-} from './models/branding-preference';
 export {WellKnownSchemaIds} from './models/scim2-schema';
 export type {Schema, SchemaAttribute, FlattenedSchema} from './models/scim2-schema';
 export type {RecursivePartial} from './models/utility-types';
@@ -197,7 +183,6 @@ export {default as bem} from './utils/bem';
 export {default as formatDate} from './utils/formatDate';
 export {default as processUsername} from './utils/processUsername';
 export {default as deepMerge} from './utils/deepMerge';
-export {default as deriveOrganizationHandleFromBaseUrl} from './utils/deriveOrganizationHandleFromBaseUrl';
 export {default as extractUserClaimsFromIdToken} from './utils/extractUserClaimsFromIdToken';
 export {default as isRecognizedBaseUrlPattern} from './utils/isRecognizedBaseUrlPattern';
 export {default as extractPkceStorageKeyFromState} from './utils/extractPkceStorageKeyFromState';
@@ -222,7 +207,6 @@ export {default as buildValidatorFromRules} from './utils/buildValidatorFromRule
 export {default as evaluateValidationRule, DEFAULT_VALIDATION_MESSAGE_KEYS} from './utils/evaluateValidationRule';
 export {default as processOpenIDScopes} from './utils/processOpenIDScopes';
 export {default as withVendorCSSClassPrefix} from './utils/withVendorCSSClassPrefix';
-export {default as transformBrandingPreferenceToTheme} from './utils/transformBrandingPreferenceToTheme';
 
 export {
   default as logger,
diff --git a/packages/javascript/src/models/branding-preference.ts b/packages/javascript/src/models/branding-preference.ts
deleted file mode 100644
index e14e631..0000000
--- a/packages/javascript/src/models/branding-preference.ts
+++ /dev/null
@@ -1,267 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/**
- * Interface for color configuration with multiple variants.
- */
-export interface ColorVariants {
-  contrastText?: string;
-  dark?: string;
-  inverted?: string;
-  light?: string;
-  main?: string;
-}
-
-/**
- * Interface for text color configuration.
- */
-export interface TextColors {
-  primary?: string;
-  secondary?: string;
-}
-
-/**
- * Interface for button styling configuration.
- */
-export interface ButtonStyle {
-  base?: {
-    background?: {
-      backgroundColor?: string;
-    };
-    border?: {
-      borderColor?: string;
-      borderRadius?: string;
-    };
-    font?: {
-      color?: string;
-    };
-  };
-}
-
-/**
- * Interface for buttons configuration.
- */
-export interface ButtonsConfig {
-  externalConnection?: ButtonStyle;
-  primary?: ButtonStyle;
-  secondary?: ButtonStyle;
-}
-
-/**
- * Interface for color palette configuration.
- */
-export interface ColorsConfig {
-  alerts?: {
-    error?: ColorVariants;
-    info?: ColorVariants;
-    neutral?: ColorVariants;
-    warning?: ColorVariants;
-  };
-  background?: {
-    body?: ColorVariants;
-    surface?: ColorVariants;
-  };
-  illustrations?: {
-    accent1?: ColorVariants;
-    accent2?: ColorVariants;
-    accent3?: ColorVariants;
-    primary?: ColorVariants;
-    secondary?: ColorVariants;
-  };
-  outlined?: {
-    default?: string;
-  };
-  primary?: ColorVariants;
-  secondary?: ColorVariants;
-  text?: TextColors;
-}
-
-/**
- * Interface for footer configuration.
- */
-export interface FooterConfig {
-  border?: {
-    borderColor?: string;
-  };
-  font?: {
-    color?: string;
-  };
-}
-
-/**
- * Interface for image configuration.
- */
-export interface ImageConfig {
-  altText?: string;
-  imgURL?: string;
-  title?: string;
-}
-
-/**
- * Interface for images configuration.
- */
-export interface ImagesConfig {
-  favicon?: Partial<ImageConfig>;
-  logo?: Partial<ImageConfig>;
-  myAccountLogo?: Partial<ImageConfig>;
-}
-
-/**
- * Interface for input styling configuration.
- */
-export interface InputsConfig {
-  base?: {
-    background?: {
-      backgroundColor?: string;
-    };
-    border?: {
-      borderColor?: string;
-      borderRadius?: string;
-    };
-    font?: {
-      color?: string;
-    };
-    labels?: {
-      font?: {
-        color?: string;
-      };
-    };
-  };
-}
-
-/**
- * Interface for login box configuration.
- */
-export interface LoginBoxConfig {
-  background?: {
-    backgroundColor?: string;
-  };
-  border?: {
-    borderColor?: string;
-    borderRadius?: string;
-    borderWidth?: string;
-  };
-  font?: {
-    color?: string;
-  };
-}
-
-/**
- * Interface for login page configuration.
- */
-export interface LoginPageConfig {
-  background?: {
-    backgroundColor?: string;
-  };
-  font?: {
-    color?: string;
-  };
-}
-
-/**
- * Interface for typography configuration.
- */
-export interface TypographyConfig {
-  font?: {
-    color?: string;
-    fontFamily?: string;
-    importURL?: string;
-  };
-  heading?: {
-    font?: {
-      color?: string;
-    };
-  };
-}
-
-/**
- * Interface for theme variant configuration (LIGHT/DARK).
- */
-export interface ThemeVariant {
-  buttons?: ButtonsConfig;
-  colors?: ColorsConfig;
-  footer?: FooterConfig;
-  images?: ImagesConfig;
-  inputs?: InputsConfig;
-  loginBox?: LoginBoxConfig;
-  loginPage?: LoginPageConfig;
-  typography?: TypographyConfig;
-}
-
-/**
- * Interface for branding preference layout configuration.
- */
-export interface BrandingLayout {
-  activeLayout?: string;
-  sideImg?: {
-    altText?: string;
-    imgURL?: string;
-  };
-}
-
-/**
- * Interface for organization details configuration.
- */
-export interface BrandingOrganizationDetails {
-  displayName?: string;
-  supportEmail?: string;
-}
-
-/**
- * Interface for URL configurations.
- */
-export interface UrlsConfig {
-  cookiePolicyURL?: string;
-  privacyPolicyURL?: string;
-  selfSignUpURL?: string;
-  termsOfUseURL?: string;
-}
-
-/**
- * Interface for branding preference theme configuration.
- */
-export interface BrandingTheme {
-  DARK?: ThemeVariant;
-  LIGHT?: ThemeVariant;
-  activeTheme?: string;
-}
-
-/**
- * Interface for branding preference configuration.
- */
-export interface BrandingPreferenceConfig {
-  configs?: {
-    isBrandingEnabled?: boolean;
-    removeDefaultBranding?: boolean;
-    selfSignUpEnabled?: boolean;
-  };
-  layout?: BrandingLayout;
-  organizationDetails?: BrandingOrganizationDetails;
-  theme?: BrandingTheme;
-  urls?: UrlsConfig;
-}
-
-/**
- * Interface for branding preference configuration.
- */
-export interface BrandingPreference {
-  locale?: string;
-  name?: string;
-  preference?: BrandingPreferenceConfig;
-  type?: string;
-}
diff --git a/packages/javascript/src/models/config.ts b/packages/javascript/src/models/config.ts
index 51a5522..3199396 100644
--- a/packages/javascript/src/models/config.ts
+++ b/packages/javascript/src/models/config.ts
@@ -449,13 +449,6 @@ export interface ThemePreferences {
    * @default 'ltr'
    */
   direction?: 'ltr' | 'rtl';
-  /**
-   * Inherit branding from WSO2 Identity Server or ThunderID.
-   * When set to `true`, the SDK will fetch and apply branding preferences from the server.
-   * Defaults to `false` — branding is not fetched unless explicitly enabled.
-   * @default false
-   */
-  inheritFromBranding?: boolean;
   /**
    * The theme mode to use. Defaults to 'system'.
    */
diff --git a/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx b/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx
index 500828d..0cd013c 100644
--- a/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx
+++ b/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx
@@ -26,7 +26,6 @@ import {
   UpdateMeProfileConfig,
   User,
   UserProfile,
-  BrandingPreference,
   TokenResponse,
   CreateOrganizationPayload,
   ThunderIDRuntimeError,
@@ -39,7 +38,6 @@ import {
   ThemeProvider,
   ThunderIDProviderProps,
   OrganizationProvider,
-  BrandingProvider,
   getActiveTheme,
 } from '@thunderid/react';
 import {ReadonlyURLSearchParams} from 'next/dist/client/components/navigation.react-server';
@@ -56,7 +54,6 @@ import logger from '../../../utils/logger';
 export type ThunderIDClientProviderProps = Partial<Omit<ThunderIDProviderProps, 'baseUrl' | 'clientId'>> &
   Pick<ThunderIDProviderProps, 'baseUrl' | 'clientId'> & {
     applicationId: ThunderIDContextProps['applicationId'];
-    brandingPreference?: BrandingPreference | null;
     clearSession: () => Promise<void>;
     createOrganization: (payload: CreateOrganizationPayload, sessionId: string) => Promise<Organization>;
     currentOrganization: Organization;
@@ -108,7 +105,6 @@ const ThunderIDClientProvider: FC<PropsWithChildren<ThunderIDClientProviderProps
   revalidateMyOrganizations,
   getAllOrganizations,
   switchOrganization,
-  brandingPreference,
 }: PropsWithChildren<ThunderIDClientProviderProps>) => {
   const reRenderCheckRef: RefObject<boolean> = useRef(false);
   const router: AppRouterInstance = useRouter();
@@ -203,8 +199,11 @@ const ThunderIDClientProvider: FC<PropsWithChildren<ThunderIDClientProviderProps
     const result: any = await signIn(payload, request);
 
     // Redirect based flow URL is sent as `signInUrl` in the response.
+    // Use window.location.href instead of router.push() — the OAuth authorization
+    // endpoint is on an external server, and router.push() would send RSC fetch
+    // headers that the identity provider doesn't understand, causing a CORS error.
     if (result?.data?.signInUrl) {
-      router.push(result.data.signInUrl);
+      window.location.href = result.data.signInUrl;
 
       return undefined;
     }
@@ -320,28 +319,25 @@ const ThunderIDClientProvider: FC<PropsWithChildren<ThunderIDClientProviderProps
     <ThunderIDContext.Provider value={contextValue}>
       <I18nProvider preferences={preferences?.i18n}>
         <FlowMetaProvider enabled={preferences?.resolveFromMeta !== false}>
-          <BrandingProvider brandingPreference={brandingPreference}>
-            <ThemeProvider
-              theme={preferences?.theme?.overrides}
-              mode={getActiveTheme(preferences?.theme?.mode as any)}
-              inheritFromBranding
-            >
-              <FlowProvider>
-                <UserProvider profile={userProfile} onUpdateProfile={handleProfileUpdate} updateProfile={updateProfile}>
-                  <OrganizationProvider
-                    createOrganization={createOrganization}
-                    getAllOrganizations={getAllOrganizations}
-                    myOrganizations={myOrganizations}
-                    currentOrganization={currentOrganization}
-                    onOrganizationSwitch={switchOrganization as any}
-                    revalidateMyOrganizations={revalidateMyOrganizations as any}
-                  >
-                    {children}
-                  </OrganizationProvider>
-                </UserProvider>
-              </FlowProvider>
-            </ThemeProvider>
-          </BrandingProvider>
+          <ThemeProvider
+            theme={preferences?.theme?.overrides}
+            mode={getActiveTheme(preferences?.theme?.mode as any)}
+          >
+            <FlowProvider>
+              <UserProvider profile={userProfile} onUpdateProfile={handleProfileUpdate} updateProfile={updateProfile}>
+                <OrganizationProvider
+                  createOrganization={createOrganization}
+                  getAllOrganizations={getAllOrganizations}
+                  myOrganizations={myOrganizations}
+                  currentOrganization={currentOrganization}
+                  onOrganizationSwitch={switchOrganization as any}
+                  revalidateMyOrganizations={revalidateMyOrganizations as any}
+                >
+                  {children}
+                </OrganizationProvider>
+              </UserProvider>
+            </FlowProvider>
+          </ThemeProvider>
         </FlowMetaProvider>
       </I18nProvider>
     </ThunderIDContext.Provider>
diff --git a/packages/nextjs/src/server/ThunderIDProvider.tsx b/packages/nextjs/src/server/ThunderIDProvider.tsx
index aba4f25..7579289 100644
--- a/packages/nextjs/src/server/ThunderIDProvider.tsx
+++ b/packages/nextjs/src/server/ThunderIDProvider.tsx
@@ -18,13 +18,12 @@
 
 'use server';
 
-import {BrandingPreference, ThunderIDRuntimeError, IdToken, Organization, User, UserProfile} from '@thunderid/node';
+import {ThunderIDRuntimeError, IdToken, Organization, User, UserProfile} from '@thunderid/node';
 import {ThunderIDProviderProps} from '@thunderid/react';
 import {FC, PropsWithChildren, ReactElement} from 'react';
 import clearSession from './actions/clearSession';
 import createOrganization from './actions/createOrganization';
 import getAllOrganizations from './actions/getAllOrganizations';
-import getBrandingPreference from './actions/getBrandingPreference';
 import getCurrentOrganizationAction from './actions/getCurrentOrganizationAction';
 import getMyOrganizations from './actions/getMyOrganizations';
 import getSessionId from './actions/getSessionId';
@@ -129,7 +128,6 @@ const ThunderIDServerProvider: FC<PropsWithChildren<ThunderIDServerProviderProps
     orgHandle: '',
   };
   let myOrganizations: Organization[] = [];
-  let brandingPreference: BrandingPreference | null = null;
 
   if (signedIn) {
     let updatedBaseUrl: string | undefined = config?.baseUrl;
@@ -195,24 +193,6 @@ const ThunderIDServerProvider: FC<PropsWithChildren<ThunderIDServerProviderProps
     }
   }
 
-  // Fetch branding preference if branding is enabled in config
-  if (config?.preferences?.theme?.inheritFromBranding !== false) {
-    try {
-      brandingPreference = await getBrandingPreference(
-        {
-          baseUrl: config?.baseUrl!,
-          locale: 'en-US',
-          name: config.applicationId || config.organizationHandle,
-          type: config.applicationId ? 'APP' : 'ORG',
-        },
-        sessionId,
-      );
-    } catch (error) {
-      // eslint-disable-next-line no-console
-      console.warn('[ThunderIDServerProvider] Failed to fetch branding preference:', error);
-    }
-  }
-
   return (
     <ThunderIDClientProvider
       organizationHandle={config?.organizationHandle}
@@ -236,7 +216,6 @@ const ThunderIDServerProvider: FC<PropsWithChildren<ThunderIDServerProviderProps
       myOrganizations={myOrganizations}
       getAllOrganizations={getAllOrganizations}
       switchOrganization={switchOrganization}
-      brandingPreference={brandingPreference}
       createOrganization={createOrganization}
     >
       {children}
diff --git a/packages/nextjs/src/server/actions/__tests__/getBrandingPreference.test.ts b/packages/nextjs/src/server/actions/__tests__/getBrandingPreference.test.ts
deleted file mode 100644
index 9a21e61..0000000
--- a/packages/nextjs/src/server/actions/__tests__/getBrandingPreference.test.ts
+++ /dev/null
@@ -1,115 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-// src/server/actions/__tests__/getBrandingPreference.test.ts
-import {ThunderIDAPIError, getBrandingPreference as baseGetBrandingPreference} from '@thunderid/node';
-import {describe, it, expect, vi, beforeEach, afterEach, type Mock} from 'vitest';
-
-// Now import SUT and mocked exports
-import getBrandingPreference from '../getBrandingPreference';
-
-// Mock the upstream module first. Keep all dependencies inside the factory.
-vi.mock('@thunderid/node', () => {
-  const getBrandingPreferenceMock: ReturnType<typeof vi.fn> = vi.fn();
-
-  class MockThunderIDAPIError extends Error {
-    code?: string;
-
-    source?: string;
-
-    statusCode?: number;
-
-    constructor(message: string, code?: string, source?: string, statusCode?: number) {
-      super(message);
-      this.name = 'ThunderIDAPIError';
-      this.code = code;
-      this.source = source;
-      this.statusCode = statusCode;
-    }
-  }
-
-  return {
-    ThunderIDAPIError: MockThunderIDAPIError,
-    getBrandingPreference: getBrandingPreferenceMock,
-  };
-});
-
-describe('getBrandingPreference (Next.js server action)', () => {
-  type BrandingPreference = Awaited<ReturnType<typeof getBrandingPreference>>;
-  type Cfg = Parameters<typeof getBrandingPreference>[0];
-
-  const cfg: Cfg = {locale: 'en-US', orgId: 'org-001'} as unknown as Cfg;
-
-  const mockPref: BrandingPreference = {
-    logoUrl: 'https://cdn.example.com/logo.png',
-    theme: {colors: {primary: '#0055aa'}},
-  } as unknown as BrandingPreference;
-
-  beforeEach(() => {
-    vi.resetAllMocks();
-    (baseGetBrandingPreference as unknown as Mock).mockResolvedValue(mockPref);
-  });
-
-  afterEach(() => {
-    vi.restoreAllMocks();
-  });
-
-  it('should return branding preferences when upstream succeeds', async () => {
-    const result: BrandingPreference = await getBrandingPreference(cfg, 'sess-123');
-
-    expect(baseGetBrandingPreference).toHaveBeenCalledTimes(1);
-    expect(baseGetBrandingPreference).toHaveBeenCalledWith(cfg);
-
-    // Ensure sessionId is not forwarded
-    const call: unknown[] = (baseGetBrandingPreference as unknown as Mock).mock.calls[0];
-    expect(call.length).toBe(1);
-
-    expect(result).toBe(mockPref);
-  });
-
-  it('should wrap an ThunderIDAPIError from upstream, preserving statusCode', async () => {
-    const upstream: ThunderIDAPIError = new ThunderIDAPIError('Not found', 'BRAND_404', 'server', 404);
-    (baseGetBrandingPreference as unknown as Mock).mockRejectedValueOnce(upstream);
-
-    await expect(getBrandingPreference(cfg)).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining('Failed to get branding preferences: Not found'),
-      statusCode: 404,
-    });
-  });
-
-  it('should wrap a generic Error with undefined statusCode', async () => {
-    (baseGetBrandingPreference as unknown as Mock).mockRejectedValueOnce(new Error('network down'));
-
-    await expect(getBrandingPreference(cfg)).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining('Failed to get branding preferences: network down'),
-      statusCode: undefined,
-    });
-  });
-
-  it('should wrap a non-Error rejection value using String(error)', async () => {
-    (baseGetBrandingPreference as unknown as Mock).mockRejectedValueOnce('boom');
-
-    await expect(getBrandingPreference(cfg)).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining('Failed to get branding preferences: boom'),
-      statusCode: undefined,
-    });
-  });
-});
diff --git a/packages/nextjs/src/server/actions/getBrandingPreference.ts b/packages/nextjs/src/server/actions/getBrandingPreference.ts
deleted file mode 100644
index 433cba9..0000000
--- a/packages/nextjs/src/server/actions/getBrandingPreference.ts
+++ /dev/null
@@ -1,49 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use server';
-
-import {
-  ThunderIDAPIError,
-  GetBrandingPreferenceConfig,
-  BrandingPreference,
-  getBrandingPreference as baseGetBrandingPreference,
-} from '@thunderid/node';
-
-/**
- * Server action to get branding preferences.
- */
-const getBrandingPreference = async (
-  config: GetBrandingPreferenceConfig,
-  sessionId?: string, // eslint-disable-line @typescript-eslint/no-unused-vars
-): Promise<BrandingPreference> => {
-  try {
-    const brandingPreference: BrandingPreference = await baseGetBrandingPreference(config);
-
-    return brandingPreference;
-  } catch (error) {
-    throw new ThunderIDAPIError(
-      `Failed to get branding preferences: ${error instanceof Error ? error.message : String(error)}`,
-      'getBrandingPreferenceAction-ServerActionError-001',
-      'nextjs',
-      error instanceof ThunderIDAPIError ? error.statusCode : undefined,
-    );
-  }
-};
-
-export default getBrandingPreference;
diff --git a/packages/nuxt/src/index.ts b/packages/nuxt/src/index.ts
index 83ce2ef..88eb41d 100644
--- a/packages/nuxt/src/index.ts
+++ b/packages/nuxt/src/index.ts
@@ -26,7 +26,7 @@ export type {ThunderIDNuxtConfig, ThunderIDSessionPayload, ThunderIDAuthState} f
 // `useThunderID`. The rest are re-exports of `@thunderid/vue` composables —
 // their contexts are mounted by `<ThunderIDRoot>` (see runtime/components).
 export {useThunderID} from './runtime/composables/useThunderID';
-export {useUser, useOrganization, useFlow, useFlowMeta, useTheme, useBranding} from '@thunderid/vue';
+export {useUser, useOrganization, useFlow, useFlowMeta, useTheme} from '@thunderid/vue';
 export {useI18n as useThunderIDI18n} from '@thunderid/vue';
 
 // ── Components ─────────────────────────────────────────────────────────────
diff --git a/packages/nuxt/src/module.ts b/packages/nuxt/src/module.ts
index 2444f34..e115e0d 100644
--- a/packages/nuxt/src/module.ts
+++ b/packages/nuxt/src/module.ts
@@ -231,7 +231,6 @@ export default defineNuxtModule<ThunderIDNuxtConfig>({
       {from: '@thunderid/vue', name: 'useFlow'},
       {from: '@thunderid/vue', name: 'useFlowMeta'},
       {from: '@thunderid/vue', name: 'useTheme'},
-      {from: '@thunderid/vue', name: 'useBranding'},
       // useI18n aliased to `useThunderIDI18n` to avoid collision with @nuxtjs/i18n
       {as: 'useThunderIDI18n', from: '@thunderid/vue', name: 'useI18n'},
       // Middleware factory
@@ -239,7 +238,7 @@ export default defineNuxtModule<ThunderIDNuxtConfig>({
     ]);
 
     // Register the Nuxt-specific root component that mounts the full Vue
-    // provider tree (I18nProvider, BrandingProvider, ThemeProvider, etc.).
+    // provider tree (I18nProvider, ThemeProvider, etc.).
     // Users wrap their `app.vue` with `<ThunderIDRoot>` — matching the way
     // Next.js users wrap their app with `<ThunderIDServerProvider>`.
     addComponent({
@@ -257,7 +256,7 @@ export default defineNuxtModule<ThunderIDNuxtConfig>({
     // This mirrors the Next.js SDK pattern where Base components come from
     // @thunderid/react and host-specific containers live in the Next.js package.
     //
-    // NOTE: Composables (useUser, useOrganization, useTheme, useBranding,
+    // NOTE: Composables (useUser, useOrganization, useTheme,
     // useFlow, useI18n) remain direct re-exports from @thunderid/vue via
     // addImports above — only the components need Nuxt wrappers.
 
diff --git a/packages/nuxt/src/runtime/components/ThunderIDRoot.ts b/packages/nuxt/src/runtime/components/ThunderIDRoot.ts
index f871cfd..19acaf0 100644
--- a/packages/nuxt/src/runtime/components/ThunderIDRoot.ts
+++ b/packages/nuxt/src/runtime/components/ThunderIDRoot.ts
@@ -19,7 +19,6 @@
 import {generateFlattenedUserProfile} from '@thunderid/browser';
 import type {
   AllOrganizationsApiResponse,
-  BrandingPreference,
   CreateOrganizationPayload,
   Organization,
   UpdateMeProfileConfig,
@@ -27,7 +26,6 @@ import type {
   UserProfile,
 } from '@thunderid/node';
 import {
-  BrandingProvider,
   FlowMetaProvider,
   FlowProvider,
   I18nProvider,
@@ -47,8 +45,7 @@ import {useState, useRuntimeConfig} from '#imports';
  * data as props to each Vue provider:
  *
  * - {@link I18nProvider}      ← `preferences.i18n`
- * - {@link BrandingProvider}  ← `brandingPreference` (from `thunderid:branding`)
- * - {@link ThemeProvider}     ← `inheritFromBranding`, `mode`
+ * - {@link ThemeProvider}     ← `mode`
  * - {@link FlowProvider}
  * - {@link UserProvider}      ← `profile`, `flattenedProfile`, `schemas`,
  *                               `updateProfile`, `revalidateProfile`, `onUpdateProfile`
@@ -59,7 +56,7 @@ import {useState, useRuntimeConfig} from '#imports';
  * The `THUNDERID_KEY` (config + auth state + actions) is still provided at the
  * app level by the Nuxt plugin; this component only supplies the auxiliary
  * provider contexts so downstream composables (`useUser`, `useOrganization`,
- * `useTheme`, `useBranding`, `useThunderIDI18n`) receive real data.
+ * `useTheme`, `useThunderIDI18n`) receive real data.
  *
  * @example
  * ```vue
@@ -78,7 +75,6 @@ const ThunderIDRoot: Component = defineComponent({
     const userProfileState: Ref<UserProfile | null> = useState<UserProfile | null>('thunderid:user-profile');
     const currentOrgState: Ref<Organization | null> = useState<Organization | null>('thunderid:current-org');
     const myOrgsState: Ref<Organization[]> = useState<Organization[]>('thunderid:my-orgs');
-    const brandingState: Ref<BrandingPreference | null> = useState<BrandingPreference | null>('thunderid:branding');
     // Used by onUpdateProfile to keep the top-level auth user claim in sync.
     const authState: Ref<ThunderIDAuthState> = useState<ThunderIDAuthState>('thunderid:auth');
 
@@ -93,7 +89,6 @@ const ThunderIDRoot: Component = defineComponent({
     // always agree with what the Nitro plugin decided to fetch server-side.
     const shouldFetchProfile: boolean = prefs?.user?.fetchUserProfile !== false;
     const shouldFetchOrgs: boolean = prefs?.user?.fetchOrganizations !== false;
-    const shouldFetchBranding: boolean = prefs?.theme?.inheritFromBranding !== false;
     // Defaults to 'light' — matches the Vue SDK's ThunderIDProvider, which
     // passes no mode and therefore uses ThemeProvider's `DEFAULT_THEME`.
     const themeMode: string = prefs?.theme?.mode ?? 'light';
@@ -211,19 +206,6 @@ const ThunderIDRoot: Component = defineComponent({
       }
     };
 
-    /**
-     * Refresh the branding preference and update local state so
-     * `useBranding().brandingPreference` stays reactive.
-     */
-    const revalidateBranding = async (): Promise<void> => {
-      try {
-        const res: BrandingPreference | null = await $fetch<BrandingPreference | null>('/api/auth/branding');
-        if (res) brandingState.value = res;
-      } catch {
-        // Non-fatal — branding stays stale until the next navigation.
-      }
-    };
-
     // ── Render tree — mirrors ThunderIDClientProvider (Next.js) ─────────────
     //
     // FlowMetaProvider is mounted unconditionally with `enabled: false` (V1
@@ -245,73 +227,59 @@ const ThunderIDRoot: Component = defineComponent({
               {
                 default: (): VNode =>
                   h(
-                    BrandingProvider,
+                    ThemeProvider,
                     {
-                      // When inheritFromBranding is disabled, pass null so the provider
-                      // falls back to its own default theme without using SSR-fetched data.
-                      brandingPreference: shouldFetchBranding ? brandingState.value : null,
-                      revalidateBranding: shouldFetchBranding ? revalidateBranding : undefined,
+                      mode: themeMode as any,
                     },
                     {
                       default: (): VNode =>
-                        h(
-                          ThemeProvider,
-                          {
-                            // Mirror the same flag used in the Nitro plugin gate.
-                            inheritFromBranding: shouldFetchBranding,
-                            mode: themeMode as any,
-                          },
-                          {
-                            default: (): VNode =>
-                              h(FlowProvider, null, {
-                                default: (): VNode =>
+                        h(FlowProvider, null, {
+                          default: (): VNode =>
+                            h(
+                              UserProvider,
+                              {
+                                // When fetchUserProfile is false the Nitro plugin
+                                // skips SCIM calls, so we must also pass empty values
+                                // here to keep SSR and client in sync.
+                                flattenedProfile: shouldFetchProfile
+                                  ? (userProfileState.value?.flattenedProfile ?? null)
+                                  : null,
+                                onUpdateProfile: shouldFetchProfile ? onUpdateProfile : undefined,
+                                profile: shouldFetchProfile ? userProfileState.value : null,
+                                revalidateProfile: shouldFetchProfile ? revalidateProfile : undefined,
+                                schemas: shouldFetchProfile ? (userProfileState.value?.schemas ?? null) : null,
+                                updateProfile: shouldFetchProfile ? updateProfile : undefined,
+                              },
+                              {
+                                default: (): VNode | VNode[] | undefined =>
                                   h(
-                                    UserProvider,
+                                    OrganizationProvider,
                                     {
-                                      // When fetchUserProfile is false the Nitro plugin
-                                      // skips SCIM calls, so we must also pass empty values
-                                      // here to keep SSR and client in sync.
-                                      flattenedProfile: shouldFetchProfile
-                                        ? (userProfileState.value?.flattenedProfile ?? null)
-                                        : null,
-                                      onUpdateProfile: shouldFetchProfile ? onUpdateProfile : undefined,
-                                      profile: shouldFetchProfile ? userProfileState.value : null,
-                                      revalidateProfile: shouldFetchProfile ? revalidateProfile : undefined,
-                                      schemas: shouldFetchProfile ? (userProfileState.value?.schemas ?? null) : null,
-                                      updateProfile: shouldFetchProfile ? updateProfile : undefined,
+                                      // When fetchOrganizations is false pass empty
+                                      // values so the provider renders without org data.
+                                      createOrganization: shouldFetchOrgs
+                                        ? (createOrganization as any)
+                                        : undefined,
+                                      currentOrganization: shouldFetchOrgs ? currentOrgState.value : null,
+                                      getAllOrganizations: shouldFetchOrgs ? getAllOrganizations : undefined,
+                                      myOrganizations: shouldFetchOrgs ? myOrgsState.value : [],
+                                      onOrganizationSwitch: shouldFetchOrgs
+                                        ? (onOrganizationSwitch as any)
+                                        : undefined,
+                                      revalidateCurrentOrganization: shouldFetchOrgs
+                                        ? revalidateCurrentOrganization
+                                        : undefined,
+                                      revalidateMyOrganizations: shouldFetchOrgs
+                                        ? revalidateMyOrganizations
+                                        : undefined,
                                     },
                                     {
-                                      default: (): VNode | VNode[] | undefined =>
-                                        h(
-                                          OrganizationProvider,
-                                          {
-                                            // When fetchOrganizations is false pass empty
-                                            // values so the provider renders without org data.
-                                            createOrganization: shouldFetchOrgs
-                                              ? (createOrganization as any)
-                                              : undefined,
-                                            currentOrganization: shouldFetchOrgs ? currentOrgState.value : null,
-                                            getAllOrganizations: shouldFetchOrgs ? getAllOrganizations : undefined,
-                                            myOrganizations: shouldFetchOrgs ? myOrgsState.value : [],
-                                            onOrganizationSwitch: shouldFetchOrgs
-                                              ? (onOrganizationSwitch as any)
-                                              : undefined,
-                                            revalidateCurrentOrganization: shouldFetchOrgs
-                                              ? revalidateCurrentOrganization
-                                              : undefined,
-                                            revalidateMyOrganizations: shouldFetchOrgs
-                                              ? revalidateMyOrganizations
-                                              : undefined,
-                                          },
-                                          {
-                                            default: (): VNode | VNode[] | undefined => slots.default?.(),
-                                          },
-                                        ),
+                                      default: (): VNode | VNode[] | undefined => slots.default?.(),
                                     },
                                   ),
-                              }),
-                          },
-                        ),
+                              },
+                            ),
+                        }),
                     },
                   ),
               },
diff --git a/packages/nuxt/src/runtime/plugins/thunderid.ts b/packages/nuxt/src/runtime/plugins/thunderid.ts
index c35d1c5..fc8a043 100644
--- a/packages/nuxt/src/runtime/plugins/thunderid.ts
+++ b/packages/nuxt/src/runtime/plugins/thunderid.ts
@@ -16,16 +16,16 @@
  * under the License.
  */
 
-import {defineNuxtPlugin, useState, useRequestEvent, useRuntimeConfig, navigateTo} from '#app';
-import type {NuxtApp} from '#app';
 import {getRedirectBasedSignUpUrl} from '@thunderid/browser';
-import type {BrandingPreference, Organization, UserProfile} from '@thunderid/node';
+import type {Organization, UserProfile} from '@thunderid/node';
 import {ThunderIDPlugin, THUNDERID_KEY} from '@thunderid/vue';
 import type {H3Event} from 'h3';
 import {computed} from 'vue';
 import type {ComputedRef, Ref} from 'vue';
 import ThunderIDRoot from '../components/ThunderIDRoot';
 import type {ThunderIDAuthState, ThunderIDSSRData} from '../types';
+import type {NuxtApp} from '#app';
+import {defineNuxtPlugin, useState, useRequestEvent, useRuntimeConfig, navigateTo} from '#app';
 
 /**
  * Universal Nuxt plugin (runs on both server and client) that wires up the
@@ -41,8 +41,8 @@ import type {ThunderIDAuthState, ThunderIDSSRData} from '../types';
  *     Action helpers (`signIn` / `signOut` / `signUp`) use Nuxt's
  *     `navigateTo` so redirects work on both server and client.
  *  3. **ThunderIDRoot** — register the wrapper component that mounts the rest
- *     of the provider tree (`I18nProvider`, `BrandingProvider`,
- *     `ThemeProvider`, `FlowProvider`, `UserProvider`, `OrganizationProvider`)
+ *     of the provider tree (`I18nProvider`, `ThemeProvider`, `FlowProvider`,
+ *     `UserProvider`, `OrganizationProvider`)
  *     so downstream composables receive real context values.
  *  4. **ThunderIDPlugin (delegated)** — install the Vue SDK plugin in
  *     delegated mode so it skips browser-only initialisation (SSR-safe).
@@ -97,10 +97,6 @@ export default defineNuxtPlugin((nuxtApp: NuxtApp) => {
   const userProfileState: Ref<UserProfile | null> = useState<UserProfile | null>('thunderid:user-profile', () => null);
   const currentOrgState: Ref<Organization | null> = useState<Organization | null>('thunderid:current-org', () => null);
   const myOrgsState: Ref<Organization[]> = useState<Organization[]>('thunderid:my-orgs', () => []);
-  const brandingState: Ref<BrandingPreference | null> = useState<BrandingPreference | null>(
-    'thunderid:branding',
-    () => null,
-  );
 
   if (import.meta.server) {
     const event: H3Event | undefined = useRequestEvent();
@@ -116,7 +112,6 @@ export default defineNuxtPlugin((nuxtApp: NuxtApp) => {
       userProfileState.value = ssr.userProfile;
       currentOrgState.value = ssr.currentOrganization;
       myOrgsState.value = ssr.myOrganizations;
-      brandingState.value = ssr.brandingPreference;
     } else {
       // Backwards-compat: fall back to the legacy context shape (pre-Step-2 plugin).
       const ssrContext: {isSignedIn?: boolean; session?: {sub?: string}} | undefined = event?.context?.thunderid as
diff --git a/packages/nuxt/src/runtime/server/ThunderIDNuxtClient.ts b/packages/nuxt/src/runtime/server/ThunderIDNuxtClient.ts
index d647975..c7bd8f2 100644
--- a/packages/nuxt/src/runtime/server/ThunderIDNuxtClient.ts
+++ b/packages/nuxt/src/runtime/server/ThunderIDNuxtClient.ts
@@ -30,15 +30,12 @@ import {
   type UserProfile,
   type UpdateMeProfileConfig,
   type AllOrganizationsApiResponse,
-  getBrandingPreference,
   getMeOrganizations,
   getAllOrganizations,
   createOrganization,
   getOrganization,
   type ExtendedAuthorizeRequestUrlParams,
   type SignUpOptions,
-  type GetBrandingPreferenceConfig,
-  type BrandingPreference,
 } from '@thunderid/node';
 import type {ThunderIDNuxtConfig, ThunderIDSessionPayload} from '../types';
 
@@ -202,10 +199,6 @@ class ThunderIDNuxtClient extends ThunderIDNodeClient<ThunderIDNuxtConfig> {
     });
   }
 
-  async getBrandingPreference(config: GetBrandingPreferenceConfig): Promise<BrandingPreference> {
-    return getBrandingPreference(config);
-  }
-
   override async updateUserProfile(config: UpdateMeProfileConfig, sessionId: string): Promise<User> {
     throw new Error('Profile updates are not supported for the ThunderID platform.');
   }
diff --git a/packages/nuxt/src/runtime/server/plugins/thunderid-ssr.ts b/packages/nuxt/src/runtime/server/plugins/thunderid-ssr.ts
index b31fba5..b44ac98 100644
--- a/packages/nuxt/src/runtime/server/plugins/thunderid-ssr.ts
+++ b/packages/nuxt/src/runtime/server/plugins/thunderid-ssr.ts
@@ -50,11 +50,10 @@ function resolveCallbackUrl(event: H3Event): string {
  * 4. In parallel (gated by `preferences`):
  *    - Fetches user + SCIM2 user profile  (`preferences.user.fetchUserProfile !== false`)
  *    - Fetches current org + my orgs      (`preferences.user.fetchOrganizations !== false`)
- *    - Fetches branding preference        (`preferences.theme.inheritFromBranding !== false`)
  * 5. Writes the full {@link ThunderIDSSRData} to `event.context.thunderid.ssr`
  *    so the Nuxt plugin can seed `useState` keys for zero-cost hydration.
  *
- * Each fetch is individually wrapped in try/catch so a broken SCIM or branding
+ * Each fetch is individually wrapped in try/catch so a broken SCIM
  * call never crashes SSR — the client layer can recover via the existing
  * `/api/auth/*` routes.
  */
@@ -156,9 +155,8 @@ export default defineNitroPlugin((nitro: {hooks: {hook: Function}}) => {
     // ── 4. Parallel SSR data fetches (gated by preferences) ───────────────
     const shouldFetchProfile: boolean = prefs?.user?.fetchUserProfile !== false;
     const shouldFetchOrgs: boolean = prefs?.user?.fetchOrganizations !== false;
-    const shouldFetchBranding: boolean = prefs?.theme?.inheritFromBranding !== false;
 
-    const [userResult, userProfileResult, orgsResult, currentOrgResult, brandingResult] = await Promise.allSettled([
+    const [userResult, userProfileResult, orgsResult, currentOrgResult] = await Promise.allSettled([
       // Always fetch the basic user object (needed for ThunderIDAuthState.user)
       client.getUser(session.sessionId),
 
@@ -170,9 +168,6 @@ export default defineNitroPlugin((nitro: {hooks: {hook: Function}}) => {
 
       // Current organisation (derived from the ID token)
       shouldFetchOrgs ? client.getCurrentOrganization(session.sessionId) : Promise.resolve(null),
-
-      // Branding preference (does not require a session)
-      shouldFetchBranding ? client.getBrandingPreference({baseUrl: resolvedBaseUrl}) : Promise.resolve(null),
     ]);
 
     if (userResult.status === 'rejected') {
@@ -187,13 +182,9 @@ export default defineNitroPlugin((nitro: {hooks: {hook: Function}}) => {
     if (currentOrgResult.status === 'rejected') {
       log.warn('Failed to resolve current organisation:', currentOrgResult.reason);
     }
-    if (brandingResult.status === 'rejected') {
-      log.warn('Failed to fetch branding preference:', brandingResult.reason);
-    }
 
     // ── 5. Write to event context ──────────────────────────────────────────
     const ssrData: ThunderIDSSRData = {
-      brandingPreference: brandingResult.status === 'fulfilled' ? brandingResult.value : null,
       currentOrganization: currentOrgResult.status === 'fulfilled' ? currentOrgResult.value : null,
       isSignedIn: true,
       myOrganizations: orgsResult.status === 'fulfilled' && Array.isArray(orgsResult.value) ? orgsResult.value : [],
diff --git a/packages/nuxt/src/runtime/server/routes/auth/branding/branding.get.ts b/packages/nuxt/src/runtime/server/routes/auth/branding/branding.get.ts
deleted file mode 100644
index 84fbaa6..0000000
--- a/packages/nuxt/src/runtime/server/routes/auth/branding/branding.get.ts
+++ /dev/null
@@ -1,78 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import type {BrandingPreference} from '@thunderid/node';
-import {defineEventHandler, createError} from 'h3';
-import type {H3Event} from 'h3';
-import type {ThunderIDNuxtConfig} from '../../../../types';
-import ThunderIDNuxtClient from '../../../ThunderIDNuxtClient';
-import {verifyAndRehydrateSession} from '../../../utils/serverSession';
-import {useRuntimeConfig} from '#imports';
-
-/**
- * GET /api/auth/branding
- *
- * Returns the branding preference for the current tenant / organisation context.
- * Resolves the correct `baseUrl` (org-scoped if the session is inside an org).
- * Does not require an authenticated session — unauthenticated callers receive
- * the root-tenant branding.
- *
- * Used by `ThunderIDRoot.revalidateBranding` to refresh client-side branding
- * state without a full page reload.
- */
-export default defineEventHandler(async (event: H3Event): Promise<BrandingPreference | null> => {
-  const config: ReturnType<typeof useRuntimeConfig> = useRuntimeConfig(event);
-  const publicConfig: ThunderIDNuxtConfig = config.public.thunderid as ThunderIDNuxtConfig;
-  const sessionSecret: string | undefined = config.thunderid?.sessionSecret;
-
-  const baseUrl: string = publicConfig?.baseUrl ?? '';
-  let resolvedBaseUrl: string = baseUrl;
-
-  // Attempt to resolve the org-scoped base URL from the session, if present.
-  try {
-    const session: Awaited<ReturnType<typeof verifyAndRehydrateSession>> = await verifyAndRehydrateSession(
-      event,
-      sessionSecret,
-    );
-    if (session) {
-      if (session.organizationId) {
-        resolvedBaseUrl = `${baseUrl}/o`;
-      } else {
-        const client: ThunderIDNuxtClient = ThunderIDNuxtClient.getInstance();
-        const idToken: Awaited<ReturnType<ThunderIDNuxtClient['getDecodedIdToken']>> = await client.getDecodedIdToken(
-          session.sessionId,
-        );
-        if (idToken?.user_org) {
-          resolvedBaseUrl = `${baseUrl}/o`;
-        }
-      }
-    }
-  } catch {
-    // Non-fatal — fall back to the root tenant base URL
-  }
-
-  try {
-    const client: ThunderIDNuxtClient = ThunderIDNuxtClient.getInstance();
-    return await client.getBrandingPreference({baseUrl: resolvedBaseUrl});
-  } catch (err) {
-    throw createError({
-      statusCode: 500,
-      statusMessage: `Failed to retrieve branding preference: ${err instanceof Error ? err.message : String(err)}`,
-    });
-  }
-});
diff --git a/packages/nuxt/src/runtime/types.ts b/packages/nuxt/src/runtime/types.ts
index 58a80d3..49465b6 100644
--- a/packages/nuxt/src/runtime/types.ts
+++ b/packages/nuxt/src/runtime/types.ts
@@ -17,7 +17,6 @@
  */
 
 import type {
-  BrandingPreference,
   I18nPreferences,
   Organization,
   TokenEndpointAuthMethod,
@@ -53,11 +52,6 @@ export interface ThunderIDNuxtConfig {
     /** i18n configuration forwarded to `I18nProvider`. */
     i18n?: I18nPreferences;
     theme?: {
-      /**
-       * When true (default), the Nitro plugin fetches the branding preference
-       * from ThunderID and passes it to `BrandingProvider` / `ThemeProvider`.
-       */
-      inheritFromBranding?: boolean;
       /**
        * Theme mode forwarded to the Vue SDK's `ThemeProvider`.
        * - `'light'` (default) | `'dark'`: Fixed color scheme. Toggle at runtime with `useTheme().toggleTheme()`.
@@ -138,8 +132,6 @@ export interface ThunderIDTempSessionPayload extends JWTPayload {
  * hydrated `useState` keys so the client never re-fetches on first render.
  */
 export interface ThunderIDSSRData {
-  /** Branding preference fetched from ThunderID (null when `preferences.theme.inheritFromBranding` is false). */
-  brandingPreference: BrandingPreference | null;
   /** The organisation the user is currently acting within (null when not in an org). */
   currentOrganization: Organization | null;
   isSignedIn: boolean;
diff --git a/packages/nuxt/tests/unit/thunderid-root.test.ts b/packages/nuxt/tests/unit/thunderid-root.test.ts
index 8703e18..d974004 100644
--- a/packages/nuxt/tests/unit/thunderid-root.test.ts
+++ b/packages/nuxt/tests/unit/thunderid-root.test.ts
@@ -20,7 +20,6 @@
 
 import {generateFlattenedUserProfile} from '@thunderid/browser';
 import {
-  BrandingProvider,
   FlowMetaProvider,
   FlowProvider,
   I18nProvider,
@@ -40,7 +39,6 @@ import {useRuntimeConfig} from '#imports';
 // Provide minimal stubs for @thunderid/vue providers. They are used purely as
 // VNode type markers so we can locate them in the rendered VNode tree.
 vi.mock('@thunderid/vue', () => ({
-  BrandingProvider: {name: 'BrandingProvider'},
   ThemeProvider: {name: 'ThemeProvider'},
   UserProvider: {name: 'UserProvider'},
   OrganizationProvider: {name: 'OrganizationProvider'},
@@ -83,8 +81,6 @@ const MOCK_MY_ORGS = [
   {id: 'org-2', name: 'Other Org', orgHandle: 'other-org'},
 ];
 
-const MOCK_BRANDING = {organizationName: 'TestOrg', theme: 'default'};
-
 const MOCK_AUTH_STATE = {isSignedIn: true, user: {sub: 'user-123'}, isLoading: false};
 
 // ── Helpers ───────────────────────────────────────────────────────────────────
@@ -94,7 +90,6 @@ function buildRenderFn(
   preferences?: Record<string, any>,
   stateOverrides?: {
     auth?: any;
-    branding?: any;
     currentOrg?: any;
     myOrgs?: any;
     userProfile?: any;
@@ -112,9 +107,6 @@ function buildRenderFn(
   mockStateStore.set('thunderid:my-orgs', {
     value: hasOverrides && 'myOrgs' in stateOverrides ? stateOverrides.myOrgs : MOCK_MY_ORGS,
   });
-  mockStateStore.set('thunderid:branding', {
-    value: hasOverrides && 'branding' in stateOverrides ? stateOverrides.branding : MOCK_BRANDING,
-  });
   mockStateStore.set('thunderid:auth', {
     value: hasOverrides && 'auth' in stateOverrides ? stateOverrides.auth : MOCK_AUTH_STATE,
   });
@@ -165,7 +157,7 @@ describe('ThunderIDRoot component', () => {
 
   // ── Provider tree structure ─────────────────────────────────────────────
 
-  it('renders all seven providers in the correct nesting order', () => {
+  it('renders all six providers in the correct nesting order', () => {
     const renderFn = buildRenderFn();
     const root = renderFn();
 
@@ -175,8 +167,6 @@ describe('ThunderIDRoot component', () => {
     // FlowMetaProvider defaults to V1 (`enabled: false`) — `useFlowMeta()`
     // still resolves but the provider does not fetch v2 metadata.
     expect(flowMeta!.props.enabled).toBe(false);
-    const branding = findByType(root, BrandingProvider);
-    expect(branding).not.toBeNull();
     const theme = findByType(root, ThemeProvider);
     expect(theme).not.toBeNull();
     const flow = findByType(root, FlowProvider);
@@ -189,22 +179,6 @@ describe('ThunderIDRoot component', () => {
 
   // ── Default preferences (all features enabled) ──────────────────────────
 
-  it('passes brandingPreference to BrandingProvider when inheritFromBranding is enabled (default)', () => {
-    const renderFn = buildRenderFn();
-    const root = renderFn();
-
-    const vnode = findByType(root, BrandingProvider);
-    expect(vnode!.props.brandingPreference).toEqual(MOCK_BRANDING);
-  });
-
-  it('passes inheritFromBranding:true to ThemeProvider when preference is enabled (default)', () => {
-    const renderFn = buildRenderFn();
-    const root = renderFn();
-
-    const vnode = findByType(root, ThemeProvider);
-    expect(vnode!.props.inheritFromBranding).toBe(true);
-  });
-
   it('passes full profile data to UserProvider when fetchUserProfile is enabled (default)', () => {
     const renderFn = buildRenderFn();
     const root = renderFn();
@@ -287,24 +261,6 @@ describe('ThunderIDRoot component', () => {
     expect(vnode!.props.revalidateMyOrganizations).toBeUndefined();
   });
 
-  // ── preferences.theme.inheritFromBranding: false ─────────────────────────
-
-  it('passes brandingPreference:null to BrandingProvider when inheritFromBranding is false', () => {
-    const renderFn = buildRenderFn({theme: {inheritFromBranding: false}});
-    const root = renderFn();
-
-    const vnode = findByType(root, BrandingProvider);
-    expect(vnode!.props.brandingPreference).toBeNull();
-  });
-
-  it('passes inheritFromBranding:false to ThemeProvider when preference is false', () => {
-    const renderFn = buildRenderFn({theme: {inheritFromBranding: false}});
-    const root = renderFn();
-
-    const vnode = findByType(root, ThemeProvider);
-    expect(vnode!.props.inheritFromBranding).toBe(false);
-  });
-
   // ── onUpdateProfile callback logic ────────────────────────────────────────
 
   it('onUpdateProfile updates userProfileState optimistically', () => {
diff --git a/packages/nuxt/tests/unit/thunderid-ssr.test.ts b/packages/nuxt/tests/unit/thunderid-ssr.test.ts
index abb2b6b..8643178 100644
--- a/packages/nuxt/tests/unit/thunderid-ssr.test.ts
+++ b/packages/nuxt/tests/unit/thunderid-ssr.test.ts
@@ -52,7 +52,6 @@ const mockClient = vi.hoisted(() => ({
     name: 'Test Org',
     orgHandle: 'test-org',
   }),
-  getBrandingPreference: vi.fn<(config: any) => Promise<any>>().mockResolvedValue({organizationName: 'TestOrg'}),
   getDecodedIdToken: vi.fn<(sessionId: string) => Promise<any>>().mockResolvedValue({sub: 'user-123'}),
 }));
 
@@ -149,7 +148,6 @@ describe('thunderid-ssr Nitro plugin', () => {
       name: 'Test Org',
       orgHandle: 'test-org',
     });
-    mockClient.getBrandingPreference.mockResolvedValue({organizationName: 'TestOrg'});
     mockClient.getDecodedIdToken.mockResolvedValue({sub: 'user-123'});
 
     // Default: no session cookie, root path
@@ -221,7 +219,6 @@ describe('thunderid-ssr Nitro plugin', () => {
     expect(ssr.userProfile).toBeDefined();
     expect(ssr.myOrganizations).toHaveLength(1);
     expect(ssr.currentOrganization).toEqual({id: 'org-1', name: 'Test Org', orgHandle: 'test-org'});
-    expect(ssr.brandingPreference).toEqual({organizationName: 'TestOrg'});
   });
 
   it('calls all client methods with the correct session ID', async () => {
@@ -231,7 +228,6 @@ describe('thunderid-ssr Nitro plugin', () => {
     expect(mockClient.getUserProfile).toHaveBeenCalledWith(MOCK_SESSION.sessionId);
     expect(mockClient.getMyOrganizations).toHaveBeenCalledWith(MOCK_SESSION.sessionId);
     expect(mockClient.getCurrentOrganization).toHaveBeenCalledWith(MOCK_SESSION.sessionId);
-    expect(mockClient.getBrandingPreference).toHaveBeenCalled();
   });
 
   it('writes legacy __thunderidAuth to event context for backwards compatibility', async () => {
@@ -260,7 +256,6 @@ describe('thunderid-ssr Nitro plugin', () => {
     expect(event.context.thunderid.ssr.userProfile).toBeNull();
     // other fields should still be populated
     expect(event.context.thunderid.ssr.myOrganizations).toHaveLength(1);
-    expect(event.context.thunderid.ssr.brandingPreference).toBeDefined();
   });
 
   it('skips org fetches when preferences.user.fetchOrganizations is false', async () => {
@@ -279,28 +274,8 @@ describe('thunderid-ssr Nitro plugin', () => {
     expect(mockClient.getCurrentOrganization).not.toHaveBeenCalled();
     expect(event.context.thunderid.ssr.myOrganizations).toEqual([]);
     expect(event.context.thunderid.ssr.currentOrganization).toBeNull();
-    // user and branding should still be populated
+    // user should still be populated
     expect(event.context.thunderid.ssr.user).toBeDefined();
-    expect(event.context.thunderid.ssr.brandingPreference).toBeDefined();
-  });
-
-  it('skips branding fetch when preferences.theme.inheritFromBranding is false', async () => {
-    vi.mocked(useRuntimeConfig).mockReturnValue({
-      public: {
-        thunderid: {
-          baseUrl: 'https://localhost:8090',
-          preferences: {theme: {inheritFromBranding: false}},
-        },
-      },
-    } as any);
-
-    const event = await callHandler('/', 'valid-cookie');
-
-    expect(mockClient.getBrandingPreference).not.toHaveBeenCalled();
-    expect(event.context.thunderid.ssr.brandingPreference).toBeNull();
-    // other fields should still be populated
-    expect(event.context.thunderid.ssr.user).toBeDefined();
-    expect(event.context.thunderid.ssr.myOrganizations).toHaveLength(1);
   });
 
   // ── Non-fatal partial failures ────────────────────────────────────────────
@@ -327,16 +302,6 @@ describe('thunderid-ssr Nitro plugin', () => {
     expect(event.context.thunderid.ssr.user).toBeDefined();
   });
 
-  it('still writes SSR data when getBrandingPreference throws (non-fatal)', async () => {
-    mockClient.getBrandingPreference.mockRejectedValueOnce(new Error('branding error'));
-
-    const event = await callHandler('/', 'valid-cookie');
-
-    expect(event.context.thunderid.ssr.isSignedIn).toBe(true);
-    expect(event.context.thunderid.ssr.brandingPreference).toBeNull();
-    expect(event.context.thunderid.ssr.user).toBeDefined();
-  });
-
   // ── Org-scoped base URL resolution ────────────────────────────────────────
 
   it('sets resolvedBaseUrl to baseUrl/o when session has organizationId', async () => {
diff --git a/packages/react/src/contexts/Branding/BrandingContext.ts b/packages/react/src/contexts/Branding/BrandingContext.ts
deleted file mode 100644
index 6689f9f..0000000
--- a/packages/react/src/contexts/Branding/BrandingContext.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {BrandingPreference, Theme} from '@thunderid/browser';
-import {Context, createContext} from 'react';
-
-export interface BrandingContextValue {
-  /**
-   * The active theme mode from branding preference ('light' | 'dark')
-   */
-  activeTheme: 'light' | 'dark' | null;
-  /**
-   * The raw branding preference data
-   */
-  brandingPreference: BrandingPreference | null;
-  /**
-   * Error state
-   */
-  error: Error | null;
-  /**
-   * Function to manually fetch branding preference
-   */
-  fetchBranding: () => Promise<void>;
-  /**
-   * Loading state
-   */
-  isLoading: boolean;
-  /**
-   * Function to refetch branding preference
-   * This bypasses the single-call restriction and forces a new API call
-   */
-  refetch: () => Promise<void>;
-  /**
-   * The transformed theme object
-   */
-  theme: Theme | null;
-}
-
-const BrandingContext: Context<BrandingContextValue | null> = createContext<BrandingContextValue | null>(null);
-
-BrandingContext.displayName = 'BrandingContext';
-
-export default BrandingContext;
diff --git a/packages/react/src/contexts/Branding/BrandingProvider.tsx b/packages/react/src/contexts/Branding/BrandingProvider.tsx
deleted file mode 100644
index f3b406d..0000000
--- a/packages/react/src/contexts/Branding/BrandingProvider.tsx
+++ /dev/null
@@ -1,158 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {BrandingPreference, Theme, transformBrandingPreferenceToTheme} from '@thunderid/browser';
-import {FC, PropsWithChildren, ReactElement, useCallback, useEffect, useState} from 'react';
-import BrandingContext from './BrandingContext';
-
-/**
- * Configuration options for the BrandingProvider
- */
-export interface BrandingProviderProps {
-  /**
-   * The branding preference data passed from parent (typically ThunderIDProvider)
-   */
-  brandingPreference?: BrandingPreference | null;
-  /**
-   * Whether the branding provider is enabled
-   * @default true
-   */
-  enabled?: boolean;
-  /**
-   * Error state passed from parent
-   */
-  error?: Error | null;
-  /**
-   * Force a specific theme ('light' or 'dark')
-   * If not provided, will use the activeTheme from branding preference
-   */
-  forceTheme?: 'light' | 'dark';
-  /**
-   * Loading state passed from parent
-   */
-  isLoading?: boolean;
-  /**
-   * Function to refetch branding preference passed from parent
-   */
-  refetch?: () => Promise<void>;
-}
-
-/**
- * BrandingProvider component that manages branding state and provides branding context to child components.
- *
- * This provider receives branding preferences from a parent component (typically ThunderIDProvider)
- * and transforms them into theme objects, making them available to all child components.
- *
- * Features:
- * - Receives branding preferences as props
- * - Theme transformation from branding preferences
- * - Loading and error states
- * - Support for custom theme forcing
- *
- * @example
- * Basic usage (typically used within ThunderIDProvider):
- * ```tsx
- * <BrandingProvider
- *   brandingPreference={brandingData}
- *   isLoading={isFetching}
- *   error={fetchError}
- * >
- *   <App />
- * </BrandingProvider>
- * ```
- *
- * @example
- * With custom theme forcing:
- * ```tsx
- * <BrandingProvider
- *   brandingPreference={brandingData}
- *   forceTheme="dark"
- *   enabled={true}
- * >
- *   <App />
- * </BrandingProvider>
- * ```
- */
-const BrandingProvider: FC<PropsWithChildren<BrandingProviderProps>> = ({
-  children,
-  brandingPreference: externalBrandingPreference,
-  forceTheme,
-  enabled = true,
-  isLoading: externalIsLoading = false,
-  error: externalError = null,
-  refetch: externalRefetch,
-}: PropsWithChildren<BrandingProviderProps>): ReactElement => {
-  const [theme, setTheme] = useState<Theme | null>(null);
-  const [activeTheme, setActiveTheme] = useState<'light' | 'dark' | null>(null);
-
-  // Process branding preference when it changes
-  useEffect(() => {
-    if (!enabled || !externalBrandingPreference) {
-      setTheme(null);
-      setActiveTheme(null);
-      return;
-    }
-
-    // Extract active theme from branding preference
-    const activeThemeFromBranding: string | undefined = externalBrandingPreference?.preference?.theme?.activeTheme;
-    let extractedActiveTheme: 'light' | 'dark' | null = null;
-
-    if (activeThemeFromBranding) {
-      // Convert to lowercase and map to our expected values
-      const themeMode: string = activeThemeFromBranding.toLowerCase();
-      if (themeMode === 'light' || themeMode === 'dark') {
-        extractedActiveTheme = themeMode;
-      }
-    }
-
-    setActiveTheme(extractedActiveTheme);
-
-    // Transform branding preference to theme
-    const transformedTheme: Theme | null = transformBrandingPreferenceToTheme(externalBrandingPreference, forceTheme);
-    setTheme(transformedTheme);
-  }, [externalBrandingPreference, forceTheme, enabled]);
-
-  // Reset state when disabled
-  useEffect(() => {
-    if (!enabled) {
-      setTheme(null);
-      setActiveTheme(null);
-    }
-  }, [enabled]);
-
-  // Dummy fetchBranding for backward compatibility
-  const fetchBranding: () => Promise<void> = useCallback(async (): Promise<void> => {
-    if (externalRefetch) {
-      await externalRefetch();
-    }
-  }, [externalRefetch]);
-
-  const value: any = {
-    activeTheme,
-    brandingPreference: externalBrandingPreference || null,
-    error: externalError,
-    fetchBranding,
-    isLoading: externalIsLoading,
-    refetch: externalRefetch || fetchBranding,
-    theme,
-  };
-
-  return <BrandingContext.Provider value={value}>{children}</BrandingContext.Provider>;
-};
-
-export default BrandingProvider;
diff --git a/packages/react/src/contexts/Branding/useBrandingContext.ts b/packages/react/src/contexts/Branding/useBrandingContext.ts
deleted file mode 100644
index fda05f3..0000000
--- a/packages/react/src/contexts/Branding/useBrandingContext.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {useContext} from 'react';
-import BrandingContext, {BrandingContextValue} from './BrandingContext';
-
-/**
- * Hook to access the branding context.
- * This hook provides access to branding preferences, theme data, and loading states.
- *
- * @returns The branding context value containing branding preference data, theme, and control functions
- * @throws Error if used outside of a BrandingProvider
- *
- * @example
- * ```tsx
- * function MyComponent() {
- *   const { theme, activeTheme, isLoading, error } = useBrandingContext();
- *
- *   if (isLoading) return <div>Loading branding...</div>;
- *   if (error) return <div>Error: {error.message}</div>;
- *
- *   return (
- *     <div style={{ color: theme?.colors?.primary?.main }}>
- *       <p>Active theme mode: {activeTheme}</p>
- *       <p>Styled with ThunderID branding</p>
- *     </div>
- *   );
- * }
- * ```
- */
-const useBrandingContext = (): BrandingContextValue => {
-  const context: BrandingContextValue | null = useContext(BrandingContext);
-  if (!context) {
-    throw new Error('useBrandingContext must be used within a BrandingProvider');
-  }
-  return context;
-};
-
-export default useBrandingContext;
diff --git a/packages/react/src/contexts/Theme/ThemeContext.ts b/packages/react/src/contexts/Theme/ThemeContext.ts
index 7ea2642..cc891b3 100644
--- a/packages/react/src/contexts/Theme/ThemeContext.ts
+++ b/packages/react/src/contexts/Theme/ThemeContext.ts
@@ -20,23 +20,11 @@ import {Theme} from '@thunderid/browser';
 import {Context, createContext} from 'react';
 
 export interface ThemeContextValue {
-  /**
-   * Error from branding theme fetch, if any
-   */
-  brandingError?: Error | null;
   colorScheme: 'light' | 'dark';
   /**
    * The text direction for the UI.
    */
   direction: 'ltr' | 'rtl';
-  /**
-   * Whether branding inheritance is enabled
-   */
-  inheritFromBranding?: boolean;
-  /**
-   * Whether branding theme is currently loading
-   */
-  isBrandingLoading?: boolean;
   theme: Theme;
   toggleTheme: () => void;
 }
diff --git a/packages/react/src/contexts/Theme/ThemeProvider.tsx b/packages/react/src/contexts/Theme/ThemeProvider.tsx
index 8a32e3f..612043e 100644
--- a/packages/react/src/contexts/Theme/ThemeProvider.tsx
+++ b/packages/react/src/contexts/Theme/ThemeProvider.tsx
@@ -25,11 +25,6 @@ import normalizeThemeConfig from '../../utils/normalizeThemeConfig';
 import FlowMetaContext, {FlowMetaContextValue} from '../FlowMeta/FlowMetaContext';
 
 export interface ThemeProviderProps {
-  /**
-   * When true, seeds the theme from the nearest BrandingContext if no flow meta theme is available.
-   */
-  inheritFromBranding?: boolean;
-
   /**
    * Initial color scheme override. Overrides the server default when provided.
    */
@@ -150,11 +145,8 @@ const ThemeProvider: FC<PropsWithChildren<ThemeProviderProps>> = ({
   }, [direction]);
 
   const value: any = {
-    brandingError: error,
     colorScheme,
     direction,
-    inheritFromBranding: false,
-    isBrandingLoading: isLoading,
     theme,
     toggleTheme,
   };
diff --git a/packages/react/src/contexts/ThunderID/ThunderIDProvider.tsx b/packages/react/src/contexts/ThunderID/ThunderIDProvider.tsx
index 81bfe63..9309e8e 100644
--- a/packages/react/src/contexts/ThunderID/ThunderIDProvider.tsx
+++ b/packages/react/src/contexts/ThunderID/ThunderIDProvider.tsx
@@ -25,9 +25,6 @@ import {
   SignInOptions,
   User,
   UserProfile,
-  getBrandingPreference,
-  GetBrandingPreferenceConfig,
-  BrandingPreference,
   IdToken,
   extractUserClaimsFromIdToken,
   EmbeddedSignInFlowResponse,
@@ -39,7 +36,6 @@ import ThunderIDContext from './ThunderIDContext';
 import useBrowserUrl from '../../hooks/useBrowserUrl';
 import {ThunderIDReactConfig} from '../../models/config';
 import ThunderIDReactClient from '../../ThunderIDReactClient';
-import BrandingProvider from '../Branding/BrandingProvider';
 import ComponentRendererProvider from '../ComponentRenderer/ComponentRendererProvider';
 import FlowProvider from '../Flow/FlowProvider';
 import FlowMetaProvider from '../FlowMeta/FlowMetaProvider';
@@ -112,21 +108,9 @@ const ThunderIDProvider: FC<PropsWithChildren<ThunderIDProviderProps>> = ({
   const [isUpdatingSession, setIsUpdatingSession] = useState<boolean>(false);
   const [wellKnown, setWellKnown] = useState<OIDCDiscoveryApiResponse | null>(null);
 
-  // Branding state
-  const [brandingPreference, setBrandingPreference] = useState<BrandingPreference | null>(null);
-  const [isBrandingLoading, setIsBrandingLoading] = useState<boolean>(false);
-  const [brandingError, setBrandingError] = useState<Error | null>(null);
-  const [hasFetchedBranding, setHasFetchedBranding] = useState<boolean>(false);
-
   useEffect(() => {
     setBaseUrl(initialBaseUrl ?? '');
-    // Reset branding state when baseUrl changes
-    if (initialBaseUrl !== baseUrl) {
-      setHasFetchedBranding(false);
-      setBrandingPreference(null);
-      setBrandingError(null);
-    }
-  }, [initialBaseUrl, baseUrl]);
+  }, [initialBaseUrl]);
 
   useEffect(() => {
     (async (): Promise<void> => {
@@ -366,66 +350,6 @@ const ThunderIDProvider: FC<PropsWithChildren<ThunderIDProviderProps>> = ({
     };
   }, [client, isLoadingSync, isSignedInSync, isUpdatingSession]);
 
-  // Branding fetch function
-  const fetchBranding: () => Promise<void> = useCallback(async (): Promise<void> => {
-    if (!baseUrl) {
-      return;
-    }
-
-    // Prevent multiple calls if already fetching
-    if (isBrandingLoading) {
-      return;
-    }
-
-    setIsBrandingLoading(true);
-    setBrandingError(null);
-
-    try {
-      const getBrandingConfig: GetBrandingPreferenceConfig = {
-        baseUrl,
-        locale: preferences?.i18n?.language,
-        // Add other branding config options as needed
-      };
-
-      const brandingData: BrandingPreference = await getBrandingPreference(getBrandingConfig);
-      setBrandingPreference(brandingData);
-      setHasFetchedBranding(true);
-    } catch (err) {
-      const errorMessage: Error = err instanceof Error ? err : new Error('Failed to fetch branding preference');
-      setBrandingError(errorMessage);
-      setBrandingPreference(null);
-      setHasFetchedBranding(true); // Mark as fetched even on error to prevent retries
-    } finally {
-      setIsBrandingLoading(false);
-    }
-  }, [baseUrl, preferences?.i18n?.language]);
-
-  // Refetch branding function
-  const refetchBranding: () => Promise<void> = useCallback(async (): Promise<void> => {
-    setHasFetchedBranding(false); // Reset the flag to allow refetching
-    await fetchBranding();
-  }, [fetchBranding]);
-
-  // Auto-fetch branding when initialized and configured
-  useEffect(() => {
-    // TEMPORARY: Branding preference is not yet supported.
-    return;
-
-    // Only fetch branding when explicitly enabled via preferences.theme.inheritFromBranding
-    const shouldFetchBranding: boolean = preferences?.theme?.inheritFromBranding === true;
-
-    if (shouldFetchBranding && isInitializedSync && baseUrl && !hasFetchedBranding && !isBrandingLoading) {
-      fetchBranding();
-    }
-  }, [
-    preferences?.theme?.inheritFromBranding,
-    isInitializedSync,
-    baseUrl,
-    hasFetchedBranding,
-    isBrandingLoading,
-    fetchBranding,
-  ]);
-
   const signInSilently = async (options?: SignInOptions): Promise<User | boolean> => {
     try {
       setIsUpdatingSession(true);
@@ -620,36 +544,28 @@ const ThunderIDProvider: FC<PropsWithChildren<ThunderIDProviderProps>> = ({
     <ThunderIDContext.Provider value={value}>
       <I18nProvider preferences={preferences?.i18n}>
         <FlowMetaProvider enabled={preferences?.resolveFromMeta !== false}>
-          <BrandingProvider
-            brandingPreference={brandingPreference}
-            isLoading={isBrandingLoading}
-            error={brandingError}
-            enabled={preferences?.theme?.inheritFromBranding === true}
-            refetch={refetchBranding}
+          <ThemeProvider
+            theme={{
+              ...preferences?.theme?.overrides,
+              direction: preferences?.theme?.direction,
+            }}
           >
-            <ThemeProvider
-              theme={{
-                ...preferences?.theme?.overrides,
-                direction: preferences?.theme?.direction,
-              }}
-            >
-              <FlowProvider>
-                <UserProvider profile={userProfile!} onUpdateProfile={handleProfileUpdate}>
-                  <OrganizationProvider
-                    getAllOrganizations={async (): Promise<AllOrganizationsApiResponse> => client.getAllOrganizations()}
-                    myOrganizations={myOrganizations}
-                    currentOrganization={currentOrganization}
-                    onOrganizationSwitch={switchOrganization}
-                    revalidateMyOrganizations={async (): Promise<Organization[]> => client.getMyOrganizations()}
-                  >
-                    <ComponentRendererProvider renderers={(extensions?.components?.renderers ?? {}) as any}>
-                      {children}
-                    </ComponentRendererProvider>
-                  </OrganizationProvider>
-                </UserProvider>
-              </FlowProvider>
-            </ThemeProvider>
-          </BrandingProvider>
+            <FlowProvider>
+              <UserProvider profile={userProfile!} onUpdateProfile={handleProfileUpdate}>
+                <OrganizationProvider
+                  getAllOrganizations={async (): Promise<AllOrganizationsApiResponse> => client.getAllOrganizations()}
+                  myOrganizations={myOrganizations}
+                  currentOrganization={currentOrganization}
+                  onOrganizationSwitch={switchOrganization}
+                  revalidateMyOrganizations={async (): Promise<Organization[]> => client.getMyOrganizations()}
+                >
+                  <ComponentRendererProvider renderers={(extensions?.components?.renderers ?? {}) as any}>
+                    {children}
+                  </ComponentRendererProvider>
+                </OrganizationProvider>
+              </UserProvider>
+            </FlowProvider>
+          </ThemeProvider>
         </FlowMetaProvider>
       </I18nProvider>
     </ThunderIDContext.Provider>
diff --git a/packages/react/src/hooks/useBranding.ts b/packages/react/src/hooks/useBranding.ts
deleted file mode 100644
index 99b017d..0000000
--- a/packages/react/src/hooks/useBranding.ts
+++ /dev/null
@@ -1,157 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {BrandingPreference, Theme, createPackageComponentLogger} from '@thunderid/browser';
-import useBrandingContext from '../contexts/Branding/useBrandingContext';
-
-const logger: ReturnType<typeof createPackageComponentLogger> = createPackageComponentLogger(
-  '@thunderid/react',
-  'useBranding',
-);
-
-/**
- * Configuration options for the useBranding hook
- * @deprecated Use BrandingProvider instead for better performance and consistency
- */
-export interface UseBrandingConfig {
-  /**
-   * @deprecated This configuration is now handled by BrandingProvider
-   */
-  autoFetch?: boolean;
-  /**
-   * @deprecated This configuration is now handled by BrandingProvider
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * @deprecated This configuration is now handled by BrandingProvider
-   */
-  forceTheme?: 'light' | 'dark';
-  /**
-   * @deprecated This configuration is now handled by BrandingProvider
-   */
-  locale?: string;
-  /**
-   * @deprecated This configuration is now handled by BrandingProvider
-   */
-  name?: string;
-  /**
-   * @deprecated This configuration is now handled by BrandingProvider
-   */
-  type?: string;
-}
-
-/**
- * Return type of the useBranding hook
- */
-export interface UseBrandingReturn {
-  /**
-   * The active theme mode from branding preference ('light' | 'dark')
-   */
-  activeTheme: 'light' | 'dark' | null;
-  /**
-   * The raw branding preference data
-   */
-  brandingPreference: BrandingPreference | null;
-  /**
-   * Error state
-   */
-  error: Error | null;
-  /**
-   * Function to manually fetch branding preference
-   */
-  fetchBranding: () => Promise<void>;
-  /**
-   * Loading state
-   */
-  isLoading: boolean;
-  /**
-   * Function to refetch branding preference
-   * This bypasses the single-call restriction and forces a new API call
-   */
-  refetch: () => Promise<void>;
-  /**
-   * The transformed theme object
-   */
-  theme: Theme | null;
-}
-
-/**
- * React hook for accessing branding preferences from the BrandingProvider context.
- * This hook provides access to branding preferences, theme data, and loading states.
- *
- * @deprecated Consider using useBrandingContext directly for better performance.
- * This hook is maintained for backward compatibility.
- *
- * @param config - Configuration options (deprecated, use BrandingProvider props instead)
- * @returns Object containing branding preference data, theme, loading state, error, and refetch function
- *
- * @example
- * Basic usage:
- * ```tsx
- * function MyComponent() {
- *   const { theme, activeTheme, isLoading, error } = useBranding();
- *
- *   if (isLoading) return <div>Loading branding...</div>;
- *   if (error) return <div>Error: {error.message}</div>;
- *
- *   return (
- *     <div style={{ color: theme?.colors?.primary?.main }}>
- *       <p>Active theme mode: {activeTheme}</p>
- *       <p>Styled with ThunderID branding</p>
- *     </div>
- *   );
- * }
- * ```
- *
- * @example
- * For new implementations, use BrandingProvider with useBrandingContext:
- * ```tsx
- * // In your root component
- * <BrandingProvider baseUrl="https://localhost:8090">
- *   <App />
- * </BrandingProvider>
- *
- * // In your component
- * function MyComponent() {
- *   const { theme, activeTheme, isLoading, error } = useBrandingContext();
- *   // ... rest of your component
- * }
- * ```
- */
-export const useBranding = (): UseBrandingReturn => {
-  try {
-    return useBrandingContext();
-  } catch (error) {
-    logger.warn(
-      'useBranding: BrandingProvider not available. ' +
-        'Make sure to wrap your app with BrandingProvider or ThunderIDProvider with branding preferences.',
-    );
-
-    return {
-      activeTheme: null,
-      brandingPreference: null,
-      error: new Error('BrandingProvider not available'),
-      fetchBranding: async (): Promise<void> => {},
-      isLoading: false,
-      refetch: async (): Promise<void> => {},
-      theme: null,
-    };
-  }
-};
-
-export default useBranding;
diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts
index 1a22241..ecc338c 100644
--- a/packages/react/src/index.ts
+++ b/packages/react/src/index.ts
@@ -64,14 +64,6 @@ export * from './contexts/Theme/ThemeProvider';
 
 export {default as useTheme} from './contexts/Theme/useTheme';
 
-export {default as BrandingContext} from './contexts/Branding/BrandingContext';
-export * from './contexts/Branding/BrandingContext';
-
-export {default as BrandingProvider} from './contexts/Branding/BrandingProvider';
-export * from './contexts/Branding/BrandingProvider';
-
-export {default as useBrandingContext} from './contexts/Branding/useBrandingContext';
-
 export {default as useBrowserUrl} from './hooks/useBrowserUrl';
 export * from './hooks/useBrowserUrl';
 
@@ -80,8 +72,6 @@ export * from './hooks/useTranslation';
 
 export {default as useForm} from './hooks/useForm';
 
-export {default as useBranding} from './hooks/useBranding';
-
 export {default as BaseSignInButton} from './components/actions/SignInButton/BaseSignInButton';
 export * from './components/actions/SignInButton/BaseSignInButton';
 
@@ -176,6 +166,12 @@ export * from './components/presentation/UserProfile/BaseUserProfile';
 export {default as UserProfile} from './components/presentation/UserProfile/UserProfile';
 export * from './components/presentation/UserProfile/UserProfile';
 
+export {default as BaseUserAvatar} from './components/presentation/UserAvatar/BaseUserAvatar';
+export * from './components/presentation/UserAvatar/BaseUserAvatar';
+
+export {default as UserAvatar} from './components/presentation/UserAvatar/UserAvatar';
+export * from './components/presentation/UserAvatar/UserAvatar';
+
 export {default as BaseUserDropdown} from './components/presentation/UserDropdown/BaseUserDropdown';
 export type {BaseUserDropdownProps} from './components/presentation/UserDropdown/BaseUserDropdown';
 
diff --git a/packages/vue/src/__tests__/composables/secondary-composables.test.ts b/packages/vue/src/__tests__/composables/secondary-composables.test.ts
index 4d43a06..8fe73f1 100644
--- a/packages/vue/src/__tests__/composables/secondary-composables.test.ts
+++ b/packages/vue/src/__tests__/composables/secondary-composables.test.ts
@@ -20,17 +20,15 @@ import {mount} from '@vue/test-utils';
 
 import {describe, expect, it, vi} from 'vitest';
 import {defineComponent, h, ref} from 'vue';
-import useBranding from '../../composables/useBranding';
 import useFlow from '../../composables/useFlow';
 import useFlowMeta from '../../composables/useFlowMeta';
 import useI18n from '../../composables/useI18n';
 import useTheme from '../../composables/useTheme';
-import {FLOW_KEY, FLOW_META_KEY, THEME_KEY, BRANDING_KEY, I18N_KEY} from '../../keys';
+import {FLOW_KEY, FLOW_META_KEY, THEME_KEY, I18N_KEY} from '../../keys';
 import type {
   FlowContextValue,
   FlowMetaContextValue,
   ThemeContextValue,
-  BrandingContextValue,
   I18nContextValue,
 } from '../../models/contexts';
 
@@ -160,49 +158,6 @@ describe('useTheme', () => {
   });
 });
 
-describe('useBranding', () => {
-  it('should return the BrandingContextValue when called inside a provider', () => {
-    const mockContext: Partial<BrandingContextValue> = {
-      brandingPreference: ref(null) as any,
-      theme: ref(null) as any,
-      isLoading: ref(false) as any,
-      error: ref(null) as any,
-      refetch: vi.fn(),
-    };
-    let result: BrandingContextValue | undefined;
-
-    const TestChild = defineComponent({
-      setup() {
-        result = useBranding();
-        return () => h('div', 'test');
-      },
-    });
-
-    mount(TestChild, {
-      global: {
-        provide: {
-          [BRANDING_KEY as symbol]: mockContext,
-        },
-      },
-    });
-
-    expect(result).toBeDefined();
-  });
-
-  it('should throw an error when called outside of ThunderIDProvider', () => {
-    const TestChild = defineComponent({
-      setup() {
-        useBranding();
-        return () => h('div', 'test');
-      },
-    });
-
-    expect(() => {
-      mount(TestChild);
-    }).toThrow('[ThunderID] useBranding() was called outside of <ThunderIDProvider>');
-  });
-});
-
 describe('useI18n', () => {
   it('should return the I18nContextValue when called inside a provider', () => {
     const mockContext: Partial<I18nContextValue> = {
diff --git a/packages/vue/src/composables/useBranding.ts b/packages/vue/src/composables/useBranding.ts
deleted file mode 100644
index 1022632..0000000
--- a/packages/vue/src/composables/useBranding.ts
+++ /dev/null
@@ -1,59 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {inject} from 'vue';
-import {BRANDING_KEY} from '../keys';
-import type {BrandingContextValue} from '../models/contexts';
-
-/**
- * Composable for accessing branding preference data.
- *
- * Must be called inside a component that is a descendant of `<ThunderIDProvider>`.
- *
- * @returns {BrandingContextValue} The branding context with preferences, theme, and fetch operations.
- * @throws {Error} If called outside of `<ThunderIDProvider>`.
- *
- * @example
- * ```vue
- * <script setup>
- * import { useBranding } from '@thunderid/vue';
- *
- * const { brandingPreference, theme, isLoading, fetchBranding } = useBranding();
- * </script>
- *
- * <template>
- *   <div v-if="!isLoading">
- *     <img :src="brandingPreference?.images?.logo?.imgURL" alt="Logo" />
- *   </div>
- * </template>
- * ```
- */
-const useBranding = (): BrandingContextValue => {
-  const context: unknown = inject(BRANDING_KEY);
-
-  if (!context) {
-    throw new Error(
-      '[ThunderID] useBranding() was called outside of <ThunderIDProvider>. ' +
-        'Make sure to install the ThunderIDPlugin or wrap your app with <ThunderIDProvider>.',
-    );
-  }
-
-  return context as BrandingContextValue;
-};
-
-export default useBranding;
diff --git a/packages/vue/src/index.ts b/packages/vue/src/index.ts
index b6cf034..ef7e1e5 100644
--- a/packages/vue/src/index.ts
+++ b/packages/vue/src/index.ts
@@ -24,7 +24,6 @@ export type {ThunderIDPluginOptions} from './plugins/ThunderIDPlugin';
 export {default as ThunderIDProvider} from './providers/ThunderIDProvider';
 
 // ── Providers ──
-export {default as BrandingProvider} from './providers/BrandingProvider';
 export {default as FlowMetaProvider} from './providers/FlowMetaProvider';
 export {default as FlowProvider} from './providers/FlowProvider';
 export {default as I18nProvider} from './providers/I18nProvider';
@@ -34,7 +33,6 @@ export {default as UserProvider} from './providers/UserProvider';
 
 // ── Composables ──
 export {default as useThunderID} from './composables/useThunderID';
-export {default as useBranding} from './composables/useBranding';
 export {default as useFlow} from './composables/useFlow';
 export {default as useFlowMeta} from './composables/useFlowMeta';
 export {default as useI18n} from './composables/useI18n';
@@ -50,7 +48,6 @@ export {default as ThunderIDVueClient} from './ThunderIDVueClient';
 // ── Keys ──
 export {
   THUNDERID_KEY,
-  BRANDING_KEY,
   FLOW_KEY,
   FLOW_META_KEY,
   I18N_KEY,
@@ -63,7 +60,6 @@ export {
 export type {ThunderIDVueConfig} from './models/config';
 export type {
   ThunderIDContext,
-  BrandingContextValue,
   FlowContextValue,
   FlowMessage,
   FlowMetaContextValue,
diff --git a/packages/vue/src/keys.ts b/packages/vue/src/keys.ts
index 2aa14d5..406672f 100644
--- a/packages/vue/src/keys.ts
+++ b/packages/vue/src/keys.ts
@@ -19,7 +19,6 @@
 import type {InjectionKey} from 'vue';
 import type {
   ThunderIDContext,
-  BrandingContextValue,
   FlowContextValue,
   FlowMetaContextValue,
   I18nContextValue,
@@ -58,11 +57,6 @@ export const FLOW_META_KEY: InjectionKey<FlowMetaContextValue> = Symbol('thunder
  */
 export const THEME_KEY: InjectionKey<ThemeContextValue> = Symbol('thunderid-theme');
 
-/**
- * Injection key for the Branding context (branding preferences from server).
- */
-export const BRANDING_KEY: InjectionKey<BrandingContextValue> = Symbol('thunderid-branding');
-
 /**
  * Injection key for the I18n context (translation function, language switching).
  */
diff --git a/packages/vue/src/models/contexts.ts b/packages/vue/src/models/contexts.ts
index 14d0a95..8f80fc5 100644
--- a/packages/vue/src/models/contexts.ts
+++ b/packages/vue/src/models/contexts.ts
@@ -18,7 +18,6 @@
 
 import type {
   AllOrganizationsApiResponse,
-  BrandingPreference,
   CreateOrganizationPayload,
   FlowMetadataResponse,
   HttpRequestConfig,
@@ -252,46 +251,16 @@ export interface FlowMetaContextValue {
  * Shape of the Theme context exposed by `useTheme()`.
  */
 export interface ThemeContextValue {
-  /** Error from the branding theme fetch, if any. */
-  brandingError: Readonly<Ref<Error | null>>;
   /** The current color scheme ('light' | 'dark'). */
   colorScheme: Readonly<Ref<'light' | 'dark'>>;
   /** The text direction for the UI. */
   direction: Readonly<Ref<'ltr' | 'rtl'>>;
-  /** Whether the theme inherits from ThunderID branding preferences. */
-  inheritFromBranding: boolean;
-  /** Whether the branding theme is currently loading. */
-  isBrandingLoading: Readonly<Ref<boolean>>;
   /** The resolved Theme object used by all styled components. */
   theme: Readonly<Ref<Theme>>;
   /** Toggle between light and dark mode. */
   toggleTheme: () => void;
 }
 
-// ─────────────────────────────────────────────────────────────────────────────
-// Branding Context
-// ─────────────────────────────────────────────────────────────────────────────
-
-/**
- * Shape of the Branding context exposed by `useBranding()`.
- */
-export interface BrandingContextValue {
-  /** The active theme from the branding preference ('light' | 'dark'), or null. */
-  activeTheme: Readonly<Ref<'light' | 'dark' | null>>;
-  /** The raw branding preference data from the server. */
-  brandingPreference: Readonly<Ref<BrandingPreference | null>>;
-  /** Error from the branding fetch, if any. */
-  error: Readonly<Ref<Error | null>>;
-  /** Trigger a branding preference fetch (deduplicated). */
-  fetchBranding: () => Promise<void>;
-  /** Whether the branding preference is currently loading. */
-  isLoading: Readonly<Ref<boolean>>;
-  /** Force a fresh branding preference fetch (bypasses dedup). */
-  refetch: () => Promise<void>;
-  /** The transformed `Theme` object derived from the branding preference. */
-  theme: Readonly<Ref<Theme | null>>;
-}
-
 // ─────────────────────────────────────────────────────────────────────────────
 // I18n Context
 // ─────────────────────────────────────────────────────────────────────────────
diff --git a/packages/vue/src/providers/BrandingProvider.ts b/packages/vue/src/providers/BrandingProvider.ts
deleted file mode 100644
index 913ab9c..0000000
--- a/packages/vue/src/providers/BrandingProvider.ts
+++ /dev/null
@@ -1,142 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {BrandingPreference, Theme, transformBrandingPreferenceToTheme} from '@thunderid/browser';
-import {
-  computed,
-  defineComponent,
-  h,
-  provide,
-  readonly,
-  shallowReadonly,
-  ref,
-  watch,
-  type Component,
-  type PropType,
-  type Ref,
-  type SetupContext,
-  type VNode,
-} from 'vue';
-import {BRANDING_KEY} from '../keys';
-import type {BrandingContextValue} from '../models/contexts';
-
-interface BrandingProviderProps {
-  brandingPreference: BrandingPreference | null;
-  enabled: boolean;
-  error: Error | null;
-  forceTheme: 'light' | 'dark' | undefined;
-  isLoading: boolean;
-  refetch: (() => Promise<void>) | undefined;
-}
-
-/**
- * BrandingProvider manages branding preference state and makes branding data
- * available to child components via `useBranding()`.
- *
- * It receives branding preferences from a parent component (typically
- * `<ThunderIDProvider>`) and transforms them into `Theme` objects.
- *
- * @internal — This provider is mounted automatically by `<ThunderIDProvider>`.
- */
-const BrandingProvider: Component = defineComponent({
-  name: 'BrandingProvider',
-  props: {
-    /** Whether branding is enabled. When false the context provides null. */
-    brandingPreference: {
-      default: null,
-      type: Object as PropType<BrandingPreference | null>,
-    },
-    /** Loading state from the parent. */
-    enabled: {
-      default: true,
-      type: Boolean,
-    },
-    error: {
-      default: null,
-      type: Object as PropType<Error | null>,
-    },
-    /** Force a specific theme mode, overriding the one declared in branding. */
-    forceTheme: {
-      default: undefined,
-      type: String as PropType<'light' | 'dark'>,
-    },
-    /** Re-fetch callback from the parent (bypasses dedup). */
-    isLoading: {
-      default: false,
-      type: Boolean,
-    },
-    refetch: {
-      default: undefined,
-      type: Function as PropType<() => Promise<void>>,
-    },
-  },
-  setup(props: BrandingProviderProps, {slots}: SetupContext): () => VNode {
-    const theme: Ref<Theme | null> = ref(null);
-    const activeTheme: Ref<'light' | 'dark' | null> = ref(null);
-
-    // Process branding preference whenever it changes
-    const processBranding = (): void => {
-      if (!props.enabled || !props.brandingPreference) {
-        theme.value = null;
-        activeTheme.value = null;
-        return;
-      }
-
-      const activeThemeFromBranding: string | undefined = (props.brandingPreference as any)?.preference?.theme
-        ?.activeTheme;
-      if (activeThemeFromBranding) {
-        const mode: string = activeThemeFromBranding.toLowerCase();
-        activeTheme.value = mode === 'light' || mode === 'dark' ? mode : null;
-      } else {
-        activeTheme.value = null;
-      }
-
-      const transformedTheme: Theme | null = transformBrandingPreferenceToTheme(
-        props.brandingPreference,
-        props.forceTheme,
-      );
-      theme.value = transformedTheme;
-    };
-
-    watch(() => [props.brandingPreference, props.forceTheme, props.enabled], processBranding, {immediate: true});
-
-    const fetchBranding = async (): Promise<void> => {
-      if (props.refetch) {
-        await props.refetch();
-      }
-    };
-
-    const context: BrandingContextValue = {
-      activeTheme: readonly(activeTheme),
-      brandingPreference: readonly(computed(() => props.brandingPreference)) as Readonly<
-        Ref<BrandingPreference | null>
-      >,
-      error: readonly(computed(() => props.error)) as Readonly<Ref<Error | null>>,
-      fetchBranding,
-      isLoading: readonly(computed(() => props.isLoading)) as Readonly<Ref<boolean>>,
-      refetch: props.refetch ?? fetchBranding,
-      theme: shallowReadonly(theme),
-    };
-
-    provide(BRANDING_KEY, context);
-
-    return (): VNode => h('div', {style: 'display:contents'}, slots['default']?.());
-  },
-});
-
-export default BrandingProvider;
diff --git a/packages/vue/src/providers/ThemeProvider.ts b/packages/vue/src/providers/ThemeProvider.ts
index 12180ab..c7c5875 100644
--- a/packages/vue/src/providers/ThemeProvider.ts
+++ b/packages/vue/src/providers/ThemeProvider.ts
@@ -33,7 +33,6 @@ import {
   computed,
   defineComponent,
   h,
-  inject,
   onBeforeUnmount,
   onMounted,
   provide,
@@ -47,11 +46,8 @@ import {
   type SetupContext,
   type VNode,
 } from 'vue';
-import {BRANDING_KEY, THEME_KEY} from '../keys';
-import type {BrandingContextValue, ThemeContextValue} from '../models/contexts';
-import {createVueLogger} from '../utils/logger';
-
-const logger: ReturnType<typeof createVueLogger> = createVueLogger('ThemeProvider');
+import {THEME_KEY} from '../keys';
+import type {ThemeContextValue} from '../models/contexts';
 
 /**
  * ThemeProvider manages theme state and provides it to child components via `useTheme()`.
@@ -60,20 +56,17 @@ const logger: ReturnType<typeof createVueLogger> = createVueLogger('ThemeProvide
  * - Fixed color schemes (`light` | `dark`)
  * - System preference detection (`system`)
  * - CSS-class-based detection (`class`)
- * - Branding-driven mode (`branding`) — inherits the active theme from `BrandingProvider`
- * - Merging server branding theme with local overrides
  * - CSS variable injection onto `document.documentElement`
  *
  * @example
  * ```vue
- * <ThemeProvider mode="system" :inherit-from-branding="true">
+ * <ThemeProvider mode="system">
  *   <App />
  * </ThemeProvider>
  * ```
  */
 interface ThemeProviderProps {
   detection: BrowserThemeDetection;
-  inheritFromBranding: boolean;
   mode: ThemeMode | 'branding';
   theme: RecursivePartial<ThemeConfig> | undefined;
 }
@@ -83,8 +76,6 @@ const ThemeProvider: Component = defineComponent({
   props: {
     /** Theme detection configuration (for 'class' or 'system' mode). */
     detection: {default: () => ({}), type: Object as PropType<BrowserThemeDetection>},
-    /** Whether to inherit theme from ThunderID branding preference. */
-    inheritFromBranding: {default: true as ThemePreferences['inheritFromBranding'], type: Boolean},
     /**
      * The theme mode:
      * - `'light'` | `'dark'`: Fixed color scheme.
@@ -100,9 +91,6 @@ const ThemeProvider: Component = defineComponent({
     theme: {default: undefined, type: Object as PropType<RecursivePartial<ThemeConfig>>},
   },
   setup(props: ThemeProviderProps, {slots}: SetupContext): () => VNode {
-    // Try to consume branding context – it is optional (BrandingProvider may not be mounted)
-    const brandingContext: BrandingContextValue | null = inject(BRANDING_KEY, null);
-
     const initColorScheme = (): 'light' | 'dark' => {
       if (props.mode === 'light' || props.mode === 'dark') return props.mode;
       if (props.mode === 'branding') return detectThemeMode('system', props.detection);
@@ -111,58 +99,9 @@ const ThemeProvider: Component = defineComponent({
 
     const colorScheme: Ref<'light' | 'dark'> = ref(initColorScheme());
 
-    // Update color scheme when branding's active theme is available
-    watch(
-      () => (brandingContext as any)?.activeTheme.value,
-      (brandingActiveTheme: string | 'light' | 'dark' | undefined): void => {
-        if (!props.inheritFromBranding || !brandingActiveTheme) return;
-        if (props.mode === 'branding') {
-          colorScheme.value = brandingActiveTheme as 'light' | 'dark';
-        } else if (props.mode === 'system' && !(brandingContext as any)?.isLoading.value) {
-          colorScheme.value = brandingActiveTheme as 'light' | 'dark';
-        }
-      },
-    );
-
-    // Warn if inheritFromBranding is true but no BrandingProvider is present
-    if (props.inheritFromBranding && !brandingContext) {
-      logger.warn(
-        'ThemeProvider: inheritFromBranding is enabled but BrandingProvider is not available. ' +
-          'Make sure to wrap your app with BrandingProvider or ThunderIDProvider.',
-      );
-    }
-
-    // Merge branding theme with user-provided overrides
     const finalThemeConfig: Ref<RecursivePartial<ThemeConfig> | undefined> = computed<
       RecursivePartial<ThemeConfig> | undefined
-    >(() => {
-      const themeConfig: RecursivePartial<ThemeConfig> | undefined = props.theme;
-      const brandingTheme: RecursivePartial<ThemeConfig> | null | undefined = props.inheritFromBranding
-        ? (brandingContext as any)?.theme.value
-        : null;
-
-      if (!brandingTheme) return themeConfig;
-
-      const brandingThemeConfig: RecursivePartial<ThemeConfig> = {
-        borderRadius: brandingTheme.borderRadius,
-        colors: brandingTheme.colors,
-        components: brandingTheme.components,
-        images: brandingTheme.images,
-        shadows: brandingTheme.shadows,
-        spacing: brandingTheme.spacing,
-      };
-
-      return {
-        ...brandingThemeConfig,
-        ...themeConfig,
-        borderRadius: {...brandingThemeConfig.borderRadius, ...themeConfig?.borderRadius},
-        colors: {...brandingThemeConfig.colors, ...themeConfig?.colors},
-        components: {...brandingThemeConfig.components, ...themeConfig?.components},
-        images: {...brandingThemeConfig.images, ...themeConfig?.images},
-        shadows: {...brandingThemeConfig.shadows, ...themeConfig?.shadows},
-        spacing: {...brandingThemeConfig.spacing, ...themeConfig?.spacing},
-      };
-    });
+    >(() => props.theme);
 
     const resolvedTheme: Ref<Theme> = computed<Theme>(() =>
       createTheme(finalThemeConfig.value, colorScheme.value === 'dark'),
@@ -217,9 +156,7 @@ const ThemeProvider: Component = defineComponent({
           classObserver = createClassObserver(targetElement, handleThemeChange, props.detection);
         }
       } else if (props.mode === 'system') {
-        if (!props.inheritFromBranding || !(brandingContext as any)?.activeTheme.value) {
-          mediaQuery = createMediaQueryListener(handleThemeChange);
-        }
+        mediaQuery = createMediaQueryListener(handleThemeChange);
       }
     });
 
@@ -231,11 +168,8 @@ const ThemeProvider: Component = defineComponent({
     });
 
     const context: ThemeContextValue = {
-      brandingError: brandingContext?.error ?? readonly(ref(null)),
       colorScheme: readonly(colorScheme),
       direction: readonly(direction) as Readonly<Ref<'ltr' | 'rtl'>>,
-      inheritFromBranding: props.inheritFromBranding,
-      isBrandingLoading: brandingContext?.isLoading ?? readonly(ref(false)),
       theme: shallowReadonly(resolvedTheme),
       toggleTheme,
     };
diff --git a/packages/vue/src/providers/ThunderIDProvider.ts b/packages/vue/src/providers/ThunderIDProvider.ts
index 6053eba..11dbd06 100644
--- a/packages/vue/src/providers/ThunderIDProvider.ts
+++ b/packages/vue/src/providers/ThunderIDProvider.ts
@@ -47,7 +47,6 @@ import {
   type PropType,
   type VNode,
 } from 'vue';
-import BrandingProvider from './BrandingProvider';
 import FlowMetaProvider from './FlowMetaProvider';
 import FlowProvider from './FlowProvider';
 import I18nProvider from './I18nProvider';
@@ -484,70 +483,67 @@ const ThunderIDProvider: Component = defineComponent({
             {enabled: true},
             {
               default: (): any =>
-                h(BrandingProvider, null, {
+                h(ThemeProvider, null, {
                   default: (): any =>
-                    h(ThemeProvider, null, {
+                    h(FlowProvider, null, {
                       default: (): any =>
-                        h(FlowProvider, null, {
-                          default: (): any =>
-                            h(
-                              UserProvider,
-                              {
-                                onUpdateProfile: (updatedUser: User): void => {
-                                  user.value = updatedUser;
-                                  userProfile.value = {
-                                    flattenedProfile: generateFlattenedUserProfile(
-                                      updatedUser,
-                                      userProfile.value?.schemas ?? [],
-                                    ),
-                                    profile: updatedUser,
-                                    schemas: userProfile.value?.schemas ?? [],
-                                  };
+                        h(
+                          UserProvider,
+                          {
+                            onUpdateProfile: (updatedUser: User): void => {
+                              user.value = updatedUser;
+                              userProfile.value = {
+                                flattenedProfile: generateFlattenedUserProfile(
+                                  updatedUser,
+                                  userProfile.value?.schemas ?? [],
+                                ),
+                                profile: updatedUser,
+                                schemas: userProfile.value?.schemas ?? [],
+                              };
+                            },
+                            profile: userProfile.value,
+                            revalidateProfile: async (): Promise<void> => {
+                              try {
+                                const decodedToken: IdToken = await client.getDecodedIdToken();
+                                const claims: User = extractUserClaimsFromIdToken(decodedToken);
+                                user.value = claims;
+                                userProfile.value = {
+                                  flattenedProfile: claims,
+                                  profile: claims,
+                                  schemas: [],
+                                };
+                              } catch {
+                                // silent
+                              }
+                            },
+                          },
+                          {
+                            default: (): any =>
+                              h(
+                                OrganizationProvider,
+                                {
+                                  currentOrganization: currentOrganization.value,
+                                  getAllOrganizations: async (): Promise<AllOrganizationsApiResponse> =>
+                                    client.getAllOrganizations({baseUrl: resolvedBaseUrl.value}),
+                                  myOrganizations: myOrganizations.value,
+                                  onOrganizationSwitch: switchOrganization,
+                                  revalidateMyOrganizations: async (): Promise<Organization[]> => {
+                                    const baseUrl: string = resolvedBaseUrl.value;
+                                    try {
+                                      const orgs: Organization[] = await client.getMyOrganizations({baseUrl});
+                                      myOrganizations.value = orgs || [];
+                                      return orgs || [];
+                                    } catch {
+                                      return [];
+                                    }
+                                  },
                                 },
-                                profile: userProfile.value,
-                                revalidateProfile: async (): Promise<void> => {
-                                  try {
-                                    const decodedToken: IdToken = await client.getDecodedIdToken();
-                                    const claims: User = extractUserClaimsFromIdToken(decodedToken);
-                                    user.value = claims;
-                                    userProfile.value = {
-                                      flattenedProfile: claims,
-                                      profile: claims,
-                                      schemas: [],
-                                    };
-                                  } catch {
-                                    // silent
-                                  }
+                                {
+                                  default: (): any => slots['default']?.(),
                                 },
-                              },
-                              {
-                                default: (): any =>
-                                  h(
-                                    OrganizationProvider,
-                                    {
-                                      currentOrganization: currentOrganization.value,
-                                      getAllOrganizations: async (): Promise<AllOrganizationsApiResponse> =>
-                                        client.getAllOrganizations({baseUrl: resolvedBaseUrl.value}),
-                                      myOrganizations: myOrganizations.value,
-                                      onOrganizationSwitch: switchOrganization,
-                                      revalidateMyOrganizations: async (): Promise<Organization[]> => {
-                                        const baseUrl: string = resolvedBaseUrl.value;
-                                        try {
-                                          const orgs: Organization[] = await client.getMyOrganizations({baseUrl});
-                                          myOrganizations.value = orgs || [];
-                                          return orgs || [];
-                                        } catch {
-                                          return [];
-                                        }
-                                      },
-                                    },
-                                    {
-                                      default: (): any => slots['default']?.(),
-                                    },
-                                  ),
-                              },
-                            ),
-                        }),
+                              ),
+                          },
+                        ),
                     }),
                 }),
             },

From 37fced3abd45ae519c4faa6671c825f86b70dd3f Mon Sep 17 00:00:00 2001
From: Brion <info@brionmario.com>
Date: Sat, 27 Jun 2026 00:17:40 +0530
Subject: [PATCH 2/5] Remove deriveOrganizationHandleFromBaseUrl

---
 packages/javascript/src/errors/exception.ts   |   8 +-
 ...eriveOrganizationHandleFromBaseUrl.test.ts | 163 ----------
 ...transformBrandingPreferenceToTheme.test.ts | 291 ------------------
 .../deriveOrganizationHandleFromBaseUrl.ts    |  99 ------
 .../transformBrandingPreferenceToTheme.ts     | 242 ---------------
 .../nextjs/src/server/actions/signInAction.ts |  10 +-
 packages/react/src/ThunderIDReactClient.ts    |   8 -
 packages/vue/src/ThunderIDVueClient.ts        |  11 +-
 8 files changed, 11 insertions(+), 821 deletions(-)
 delete mode 100644 packages/javascript/src/utils/__tests__/deriveOrganizationHandleFromBaseUrl.test.ts
 delete mode 100644 packages/javascript/src/utils/__tests__/transformBrandingPreferenceToTheme.test.ts
 delete mode 100644 packages/javascript/src/utils/deriveOrganizationHandleFromBaseUrl.ts
 delete mode 100644 packages/javascript/src/utils/transformBrandingPreferenceToTheme.ts

diff --git a/packages/javascript/src/errors/exception.ts b/packages/javascript/src/errors/exception.ts
index d2af3e1..47bead2 100644
--- a/packages/javascript/src/errors/exception.ts
+++ b/packages/javascript/src/errors/exception.ts
@@ -19,15 +19,11 @@
 /**
  * @deprecated Use `ThunderIDRuntimeError` for runtime errors and `ThunderIDAPIError` for API errors.
  */
-export class ThunderIDAuthException {
-  public name: string;
-
+export class ThunderIDAuthException extends Error {
   public code: string | undefined;
 
-  public message: string;
-
   public constructor(code: string, name: string, message: string) {
-    this.message = message;
+    super(message);
     this.name = name;
     this.code = code;
     Object.setPrototypeOf(this, new.target.prototype);
diff --git a/packages/javascript/src/utils/__tests__/deriveOrganizationHandleFromBaseUrl.test.ts b/packages/javascript/src/utils/__tests__/deriveOrganizationHandleFromBaseUrl.test.ts
deleted file mode 100644
index ec57a23..0000000
--- a/packages/javascript/src/utils/__tests__/deriveOrganizationHandleFromBaseUrl.test.ts
+++ /dev/null
@@ -1,163 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import ThunderIDRuntimeError from '../../errors/ThunderIDRuntimeError';
-import deriveOrganizationHandleFromBaseUrl from '../deriveOrganizationHandleFromBaseUrl';
-
-describe('deriveOrganizationHandleFromBaseUrl', () => {
-  describe('Valid ThunderID URLs', () => {
-    it('should extract organization handle from URL with /t/{org} pattern', () => {
-      const result: string = deriveOrganizationHandleFromBaseUrl('https://localhost:8090/t/dxlab');
-      expect(result).toBe('dxlab');
-    });
-
-    it('should extract organization handle with trailing slash', () => {
-      const result: string = deriveOrganizationHandleFromBaseUrl('https://localhost:8090/t/dxlab/');
-      expect(result).toBe('dxlab');
-    });
-
-    it('should extract organization handle with additional path segments', () => {
-      const result: string = deriveOrganizationHandleFromBaseUrl('https://localhost:8090/t/dxlab/api/v1');
-      expect(result).toBe('dxlab');
-    });
-
-    it('should handle different organization handles', () => {
-      expect(deriveOrganizationHandleFromBaseUrl('https://localhost:8090/t/myorg')).toBe('myorg');
-      expect(deriveOrganizationHandleFromBaseUrl('https://localhost:8090/t/test-org')).toBe('test-org');
-      expect(deriveOrganizationHandleFromBaseUrl('https://localhost:8090/t/org123')).toBe('org123');
-    });
-  });
-
-  describe('Invalid URLs - Custom Domains', () => {
-    let warnSpy: ReturnType<typeof vi.spyOn>;
-
-    beforeEach(() => {
-      warnSpy = vi.spyOn(console, 'warn').mockImplementation(() => {});
-    });
-
-    afterEach(() => {
-      warnSpy.mockRestore();
-    });
-
-    it('should return empty string and warn for URLs without /t/{org} pattern', () => {
-      const result: string = deriveOrganizationHandleFromBaseUrl('https://custom.example.com/auth');
-
-      expect(result).toBe('');
-      expect(warnSpy).toHaveBeenCalled();
-      expect(warnSpy.mock.calls[0][0]).toContain(
-        'Organization handle is required since a custom domain is configured.',
-      );
-      warnSpy.mockRestore();
-    });
-
-    it('should return empty string and warn for URLs without /t/ pattern', () => {
-      const result: string = deriveOrganizationHandleFromBaseUrl('https://localhost:8090/oauth2/token');
-
-      expect(result).toBe('');
-      expect(warnSpy).toHaveBeenCalled();
-      expect(warnSpy.mock.calls[0][0]).toContain(
-        'Organization handle is required since a custom domain is configured.',
-      );
-    });
-
-    it('should return empty string and warn for URLs with malformed /t/ pattern', () => {
-      const result1: string = deriveOrganizationHandleFromBaseUrl('https://localhost:8090/t/');
-      const result2: string = deriveOrganizationHandleFromBaseUrl('https://localhost:8090/t');
-
-      expect(result1).toBe('');
-      expect(result2).toBe('');
-      expect(warnSpy).toHaveBeenCalled();
-    });
-
-    it('should return empty string and warn for URLs with empty organization handle', () => {
-      const result: string = deriveOrganizationHandleFromBaseUrl('https://localhost:8090/t//');
-
-      expect(result).toBe('');
-      expect(warnSpy).toHaveBeenCalled();
-    });
-  });
-
-  describe('Invalid Input', () => {
-    it('should throw error for undefined baseUrl', () => {
-      expect(() => {
-        deriveOrganizationHandleFromBaseUrl(undefined);
-      }).toThrow(ThunderIDRuntimeError);
-
-      expect(() => {
-        deriveOrganizationHandleFromBaseUrl(undefined);
-      }).toThrow('Base URL is required to derive organization handle.');
-    });
-
-    it('should throw error for empty baseUrl', () => {
-      expect(() => {
-        deriveOrganizationHandleFromBaseUrl('');
-      }).toThrow(ThunderIDRuntimeError);
-
-      expect(() => {
-        deriveOrganizationHandleFromBaseUrl('');
-      }).toThrow('Base URL is required to derive organization handle.');
-    });
-
-    it('should throw error for invalid URL format', () => {
-      expect(() => {
-        deriveOrganizationHandleFromBaseUrl('not-a-valid-url');
-      }).toThrow(ThunderIDRuntimeError);
-
-      expect(() => {
-        deriveOrganizationHandleFromBaseUrl('not-a-valid-url');
-      }).toThrow('Invalid base URL format');
-    });
-  });
-
-  describe('Error Details', () => {
-    it('should surface correct error codes for missing/invalid baseUrl and warn for custom domains', () => {
-      // 1) Missing baseUrl -> throws with *-ValidationError-001
-      expect(() => {
-        deriveOrganizationHandleFromBaseUrl(undefined as any);
-      }).toThrow(
-        expect.objectContaining({
-          code: 'javascript-deriveOrganizationHandleFromBaseUrl-ValidationError-001',
-          origin: '@thunderid/javascript',
-        }),
-      );
-
-      // 2) Invalid baseUrl -> throws with *-ValidationError-002
-      expect(() => {
-        deriveOrganizationHandleFromBaseUrl('invalid-url');
-      }).toThrow(
-        expect.objectContaining({
-          code: 'javascript-deriveOrganizationHandleFromBaseUrl-ValidationError-002',
-          origin: '@thunderid/javascript',
-        }),
-      );
-
-      // 3) Custom domain (no /t/{org}) -> DOES NOT throw; warns and returns ''
-      const warnSpy: ReturnType<typeof vi.spyOn> = vi.spyOn(console, 'warn').mockImplementation(() => {});
-      const res: string = deriveOrganizationHandleFromBaseUrl('https://custom.domain.com/auth');
-
-      expect(res).toBe('');
-      expect(warnSpy).toHaveBeenCalled();
-
-      const warned = String(warnSpy.mock.calls[0][0]);
-      expect(warned).toContain('ThunderIDRuntimeError');
-      expect(warned).toContain('javascript-deriveOrganizationHandleFromBaseUrl-CustomDomainError-002');
-
-      warnSpy.mockRestore();
-    });
-  });
-});
diff --git a/packages/javascript/src/utils/__tests__/transformBrandingPreferenceToTheme.test.ts b/packages/javascript/src/utils/__tests__/transformBrandingPreferenceToTheme.test.ts
deleted file mode 100644
index ac94af0..0000000
--- a/packages/javascript/src/utils/__tests__/transformBrandingPreferenceToTheme.test.ts
+++ /dev/null
@@ -1,291 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {describe, it, expect, vi, beforeEach, afterEach} from 'vitest';
-import type {BrandingPreference, ThemeVariant} from '../../models/branding-preference';
-
-import createTheme from '../../theme/createTheme';
-import {transformBrandingPreferenceToTheme} from '../transformBrandingPreferenceToTheme';
-
-vi.mock('../../theme/createTheme', () => ({
-  default: vi.fn((config: any, isDark: boolean) => ({__config: config, __isDark: isDark})),
-}));
-
-const lightVariant = (overrides?: Partial<ThemeVariant>): ThemeVariant =>
-  ({
-    buttons: undefined,
-    colors: {
-      background: {
-        body: {main: '#fbfbfb'},
-        surface: {main: '#ffffff'},
-      },
-      primary: {contrastText: '#fff', main: '#FF7300'},
-      secondary: {contrastText: '#000', main: '#E0E1E2'},
-      text: {primary: '#000000de', secondary: '#00000066'},
-    },
-    images: undefined,
-    inputs: undefined,
-    ...(overrides || {}),
-  }) as any;
-
-const darkVariant = (overrides?: Partial<ThemeVariant>): ThemeVariant =>
-  ({
-    colors: {
-      background: {
-        body: {main: '#17191a'},
-        surface: {main: '#242627'},
-      },
-      primary: {contrastText: '#fff', dark: '#222222', main: '#111111'},
-      text: {primary: '#EBEBEF', secondary: '#B9B9C6'},
-    },
-    ...(overrides || {}),
-  }) as any;
-
-const basePref = (pref: Partial<BrandingPreference['preference']>): BrandingPreference => ({
-  locale: 'en-US',
-  name: 'dxlab',
-  preference: pref as any,
-  type: 'ORG',
-});
-
-describe('transformBrandingPreferenceToTheme', () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-  });
-
-  afterEach(() => {
-    vi.clearAllMocks();
-  });
-
-  it('should return default light theme when theme config is missing', () => {
-    const bp: BrandingPreference = basePref({} as any);
-
-    const out: Record<string, unknown> = transformBrandingPreferenceToTheme(bp);
-
-    expect(createTheme).toHaveBeenCalledWith({}, false);
-
-    expect(out).toEqual({__config: {}, __isDark: false});
-  });
-
-  it('should use activeTheme from branding preference when forceTheme is not provided', () => {
-    const bp: BrandingPreference = basePref({
-      theme: {
-        DARK: darkVariant(),
-        LIGHT: lightVariant(),
-        activeTheme: 'LIGHT',
-      },
-    });
-
-    const out: Record<string, unknown> = transformBrandingPreferenceToTheme(bp);
-
-    expect((createTheme as any).mock.calls[0][1]).toBe(false);
-
-    const cfg: Record<string, any> = (out as any).__config;
-    expect(cfg.colors.primary.main).toBe('#FF7300');
-    expect(cfg.colors.secondary.main).toBe('#E0E1E2');
-    expect(cfg.colors.background.surface).toBe('#ffffff');
-    expect(cfg.colors.background.body.main).toBe('#fbfbfb');
-  });
-
-  it('should respect forceTheme=dark and passes isDark=true', () => {
-    const bp: BrandingPreference = basePref({
-      theme: {
-        DARK: darkVariant(),
-        LIGHT: lightVariant(),
-        activeTheme: 'LIGHT',
-      },
-    });
-
-    const out: Record<string, unknown> = transformBrandingPreferenceToTheme(bp, 'dark');
-
-    expect((createTheme as any).mock.calls[0][1]).toBe(true);
-
-    const cfg: Record<string, any> = (out as any).__config;
-
-    expect(cfg.colors.primary.main).toBe('#222222');
-    expect(cfg.colors.background.surface).toBe('#242627');
-  });
-
-  it('should fall back to LIGHT config when requested variant missing, but preserves isDark from activeTheme', () => {
-    const bp: BrandingPreference = basePref({
-      theme: {
-        LIGHT: lightVariant(),
-        activeTheme: 'DARK',
-      } as any,
-    });
-
-    const out: Record<string, unknown> = transformBrandingPreferenceToTheme(bp);
-
-    expect((createTheme as any).mock.calls[0][1]).toBe(true);
-
-    const cfg: Record<string, any> = (out as any).__config;
-
-    expect(cfg.colors.primary.main).toBe('#FF7300');
-  });
-
-  it('should return default light theme when no variants exist', () => {
-    const bp: BrandingPreference = basePref({
-      theme: {} as any,
-    });
-
-    const out: Record<string, unknown> = transformBrandingPreferenceToTheme(bp);
-
-    expect(createTheme).toHaveBeenCalledWith({}, false);
-
-    expect(out).toEqual({__config: {}, __isDark: false});
-  });
-
-  it('should map images (logo & favicon) into config correctly', () => {
-    const bp: BrandingPreference = basePref({
-      theme: {
-        LIGHT: lightVariant({
-          images: {
-            favicon: {
-              altText: 'App Icon',
-              imgURL: 'https://example.com/favicon.ico',
-              title: 'My App Favicon',
-            },
-            logo: {
-              altText: 'Company Brand Logo',
-              imgURL: 'https://example.com/logo.png',
-              title: 'Company Logo',
-            },
-          },
-        }),
-        activeTheme: 'LIGHT',
-      },
-    });
-
-    const out: Record<string, unknown> = transformBrandingPreferenceToTheme(bp);
-
-    const cfg: Record<string, any> = (out as any).__config;
-
-    expect(cfg.images.favicon).toEqual({
-      alt: 'App Icon',
-      title: 'My App Favicon',
-      url: 'https://example.com/favicon.ico',
-    });
-
-    expect(cfg.images.logo).toEqual({
-      alt: 'Company Brand Logo',
-      title: 'Company Logo',
-      url: 'https://example.com/logo.png',
-    });
-  });
-
-  it('should apply component borderRadius overrides for Button and Field when present', () => {
-    const bp: BrandingPreference = basePref({
-      theme: {
-        LIGHT: lightVariant({
-          buttons: {
-            primary: {
-              base: {
-                border: {borderRadius: 12},
-              },
-            },
-          } as any,
-          inputs: {
-            base: {
-              border: {borderRadius: 6},
-            },
-          } as any,
-        }),
-        activeTheme: 'LIGHT',
-      },
-    });
-
-    const out: Record<string, unknown> = transformBrandingPreferenceToTheme(bp);
-
-    const cfg: Record<string, any> = (out as any).__config;
-
-    expect(cfg.components.Button.styleOverrides.root.borderRadius).toBe(12);
-    expect(cfg.components.Field.styleOverrides.root.borderRadius).toBe(6);
-  });
-
-  it('should omit components section when no button/field borderRadius provided', () => {
-    const bp: BrandingPreference = basePref({
-      theme: {
-        LIGHT: lightVariant(),
-        activeTheme: 'LIGHT',
-      },
-    });
-
-    const out: Record<string, unknown> = transformBrandingPreferenceToTheme(bp);
-
-    const cfg: Record<string, any> = (out as any).__config;
-
-    expect(cfg.components).toBeUndefined();
-  });
-
-  it('should resolve dark color selection correctly for primary when both main and dark are provided', () => {
-    const bp: BrandingPreference = basePref({
-      theme: {
-        DARK: darkVariant({
-          colors: {
-            background: {
-              body: {main: '#111'},
-              surface: {main: '#222'},
-            },
-            primary: {contrastText: '#fff', dark: '#010101', main: '#999999'},
-            text: {primary: '#eee', secondary: '#aaa'},
-          } as any,
-        }),
-        activeTheme: 'DARK',
-      },
-    });
-
-    const out: Record<string, unknown> = transformBrandingPreferenceToTheme(bp);
-
-    const cfg: Record<string, any> = (out as any).__config;
-
-    expect(cfg.colors.primary.main).toBe('#010101');
-    expect(cfg.colors.primary.dark).toBe('#010101');
-    expect((createTheme as any).mock.calls[0][1]).toBe(true);
-  });
-
-  it('should use contrastText if provided on color variants', () => {
-    const bp: BrandingPreference = basePref({
-      theme: {
-        LIGHT: lightVariant({
-          colors: {
-            alerts: {
-              error: {contrastText: '#fff', main: '#ff0000'},
-              info: {contrastText: '#111', main: '#0000ff'},
-              neutral: {contrastText: '#222', main: '#00ff00'},
-              warning: {contrastText: '#333', main: '#ffff00'},
-            } as any,
-            primary: {contrastText: '#abcdef', main: '#123456'},
-            secondary: {contrastText: '#fefefe', main: '#222222'},
-          } as any,
-        }),
-        activeTheme: 'LIGHT',
-      },
-    });
-
-    const out: Record<string, unknown> = transformBrandingPreferenceToTheme(bp);
-
-    const cfg: Record<string, any> = (out as any).__config;
-
-    expect(cfg.colors.primary.contrastText).toBe('#abcdef');
-    expect(cfg.colors.secondary.contrastText).toBe('#fefefe');
-    expect(cfg.colors.error.contrastText).toBe('#fff');
-    expect(cfg.colors.info.contrastText).toBe('#111');
-    expect(cfg.colors.success.contrastText).toBe('#222');
-    expect(cfg.colors.warning.contrastText).toBe('#333');
-  });
-});
diff --git a/packages/javascript/src/utils/deriveOrganizationHandleFromBaseUrl.ts b/packages/javascript/src/utils/deriveOrganizationHandleFromBaseUrl.ts
deleted file mode 100644
index 3c630e2..0000000
--- a/packages/javascript/src/utils/deriveOrganizationHandleFromBaseUrl.ts
+++ /dev/null
@@ -1,99 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import logger from './logger';
-import ThunderIDRuntimeError from '../errors/ThunderIDRuntimeError';
-
-/**
- * Extracts the organization handle from a ThunderID base URL.
- *
- * Parses URLs following the `/t/{orgHandle}` pattern.
- *
- * @param baseUrl - The base URL of the ThunderID identity server
- * @returns The extracted organization handle
- * @throws {ThunderIDRuntimeError} When the URL doesn't match the expected ThunderID pattern,
- *   indicating a custom domain is configured and organizationHandle must be provided explicitly
- *
- * @example
- * ```typescript
- * const handle = deriveOrganizationHandleFromBaseUrl('https://localhost:8090/t/dxlab');
- * // Returns: 'dxlab'
- *
- * // Custom domain - returns empty string with a warning
- * const handle2 = deriveOrganizationHandleFromBaseUrl('https://custom.example.com/auth');
- * // Returns: '' and logs a warning
- * ```
- */
-const deriveOrganizationHandleFromBaseUrl = (baseUrl?: string): string => {
-  if (!baseUrl) {
-    throw new ThunderIDRuntimeError(
-      '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: URL;
-
-  try {
-    parsedUrl = new URL(baseUrl);
-  } catch (error) {
-    throw new ThunderIDRuntimeError(
-      `Invalid base URL format: ${baseUrl}`,
-      'javascript-deriveOrganizationHandleFromBaseUrl-ValidationError-002',
-      'javascript',
-      'The provided base URL does not conform to valid URL syntax.',
-    );
-  }
-
-  // Extract the organization handle from the path pattern: /t/{orgHandle}
-  const pathSegments: string[] = parsedUrl.pathname?.split('/')?.filter((segment: string) => segment?.length > 0);
-
-  if (pathSegments.length < 2 || pathSegments[0] !== 't') {
-    logger.warn(
-      new ThunderIDRuntimeError(
-        'Organization handle is required since a custom domain is configured.',
-        'javascript-deriveOrganizationHandleFromBaseUrl-CustomDomainError-002',
-        'javascript',
-        'The provided base URL does not follow the expected URL pattern (/t/{orgHandle}). Please provide the organizationHandle explicitly in the configuration.',
-      ).toString(),
-    );
-
-    return '';
-  }
-
-  const organizationHandle: string = pathSegments[1];
-
-  if (!organizationHandle || organizationHandle.trim().length === 0) {
-    logger.warn(
-      new ThunderIDRuntimeError(
-        '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.',
-      ).toString(),
-    );
-
-    return '';
-  }
-
-  return organizationHandle;
-};
-
-export default deriveOrganizationHandleFromBaseUrl;
diff --git a/packages/javascript/src/utils/transformBrandingPreferenceToTheme.ts b/packages/javascript/src/utils/transformBrandingPreferenceToTheme.ts
deleted file mode 100644
index 85c2115..0000000
--- a/packages/javascript/src/utils/transformBrandingPreferenceToTheme.ts
+++ /dev/null
@@ -1,242 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {BrandingPreference, BrandingTheme, ThemeVariant} from '../models/branding-preference';
-import createTheme from '../theme/createTheme';
-import {Theme, ThemeConfig} from '../theme/types';
-
-/**
- * Safely extracts a color value from the branding preference structure
- */
-interface ColorVariant {
-  contrastText?: string;
-  dark?: string;
-  main?: string;
-}
-interface TextColors {
-  dark?: string;
-  primary?: string;
-  secondary?: string;
-}
-
-const extractColorValue = (colorVariant?: ColorVariant, preferDark = false): string | undefined => {
-  if (preferDark && colorVariant?.dark?.trim()) {
-    return colorVariant.dark;
-  }
-  return colorVariant?.main;
-};
-
-/**
- * Safely extracts contrast text color from the branding preference structure
- */
-const extractContrastText = (colorVariant?: {contrastText?: string; main?: string}): string | undefined =>
-  colorVariant?.contrastText;
-
-/**
- * Transforms a ThemeVariant from branding preference to ThemeConfig
- */
-const transformThemeVariant = (themeVariant: ThemeVariant, isDark = false): Partial<ThemeConfig> => {
-  const {buttons} = themeVariant;
-  const {colors} = themeVariant;
-  const {images} = themeVariant;
-  const {inputs} = themeVariant;
-
-  const config: Partial<ThemeConfig> = {
-    colors: {
-      action: {
-        activatedOpacity: 0.12,
-        active: isDark ? 'rgba(255, 255, 255, 0.70)' : 'rgba(0, 0, 0, 0.54)',
-        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,
-        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,
-      },
-      background: {
-        body: {
-          dark: (colors?.background?.body as ColorVariant)?.dark || (colors?.background?.body as ColorVariant)?.main,
-          main: extractColorValue(colors?.background?.body as ColorVariant, isDark) ?? '',
-        },
-        dark:
-          (colors?.background?.surface as ColorVariant)?.dark || (colors?.background?.surface as ColorVariant)?.main,
-        disabled: extractColorValue(colors?.background?.surface as ColorVariant, isDark) ?? '',
-        surface: extractColorValue(colors?.background?.surface as ColorVariant, isDark) ?? '',
-      },
-      border: colors?.outlined?.default ?? '',
-      error: {
-        contrastText: extractContrastText(colors?.alerts?.error) ?? '',
-        dark: (colors?.alerts?.error as ColorVariant)?.dark || (colors?.alerts?.error as ColorVariant)?.main,
-        main: extractColorValue(colors?.alerts?.error as ColorVariant, isDark) ?? '',
-      },
-      info: {
-        contrastText: extractContrastText(colors?.alerts?.info) ?? '',
-        dark: (colors?.alerts?.info as ColorVariant)?.dark || (colors?.alerts?.info as ColorVariant)?.main,
-        main: extractColorValue(colors?.alerts?.info as ColorVariant, isDark) ?? '',
-      },
-      primary: {
-        contrastText: extractContrastText(colors?.primary) ?? '',
-        dark: colors?.primary?.dark || (colors?.primary as ColorVariant)?.main,
-        main: extractColorValue(colors?.primary as ColorVariant, isDark) ?? '',
-      },
-      secondary: {
-        contrastText: extractContrastText(colors?.secondary) ?? '',
-        dark: colors?.secondary?.dark || (colors?.secondary as ColorVariant)?.main,
-        main: extractColorValue(colors?.secondary as ColorVariant, isDark) ?? '',
-      },
-      success: {
-        contrastText: extractContrastText(colors?.alerts?.neutral) ?? '',
-        dark: (colors?.alerts?.neutral as ColorVariant)?.dark || (colors?.alerts?.neutral as ColorVariant)?.main,
-        main: extractColorValue(colors?.alerts?.neutral as ColorVariant, isDark) ?? '',
-      },
-      text: {
-        dark: (colors?.text as TextColors)?.dark || (colors?.text as TextColors)?.primary,
-        primary: (colors?.text as TextColors)?.primary ?? '',
-        secondary: (colors?.text as TextColors)?.secondary ?? '',
-      },
-      warning: {
-        contrastText: extractContrastText(colors?.alerts?.warning) ?? '',
-        dark: (colors?.alerts?.warning as ColorVariant)?.dark || (colors?.alerts?.warning as ColorVariant)?.main,
-        main: extractColorValue(colors?.alerts?.warning as ColorVariant, isDark) ?? '',
-      },
-    },
-    images: {
-      favicon: images?.favicon
-        ? {
-            alt: images.favicon.altText,
-            title: images.favicon.title,
-            url: images.favicon.imgURL,
-          }
-        : undefined,
-      logo: images?.logo
-        ? {
-            alt: images.logo.altText,
-            title: images.logo.title,
-            url: images.logo.imgURL,
-          }
-        : undefined,
-    },
-  };
-
-  /* |---------------------------------------------------------------| */
-  /* |                       Components                              | */
-  /* |---------------------------------------------------------------| */
-
-  const buttonBorderRadius: string | undefined = buttons?.primary?.base?.border?.borderRadius;
-  const fieldBorderRadius: string | undefined = inputs?.base?.border?.borderRadius;
-
-  if (buttonBorderRadius || fieldBorderRadius) {
-    config.components = {
-      ...(buttonBorderRadius && {
-        Button: {
-          styleOverrides: {
-            root: {
-              borderRadius: buttonBorderRadius,
-            },
-          },
-        },
-      }),
-      ...(fieldBorderRadius && {
-        Field: {
-          styleOverrides: {
-            root: {
-              borderRadius: fieldBorderRadius,
-            },
-          },
-        },
-      }),
-    };
-  }
-
-  return config;
-};
-
-/**
- * Transforms branding preference response to Theme object
- *
- * @param brandingPreference - The branding preference response from getBrandingPreference
- * @param forceTheme - Optional parameter to force a specific theme ('light' or 'dark'),
- *                     if not provided, will use the activeTheme from branding preference
- * @returns Theme object that can be used with the theme system
- *
- * The function extracts the following from branding preference:
- * - Colors (primary, secondary, background, text, alerts, etc.)
- * - Border radius from buttons and inputs
- * - Images (logo and favicon with their URLs, titles, and alt text)
- * - Typography settings
- *
- * @example
- * ```typescript
- * const brandingPreference = await getBrandingPreference({ baseUrl: "..." });
- * const theme = transformBrandingPreferenceToTheme(brandingPreference);
- *
- * // Access image URLs via CSS variables
- * // Logo: var(--wso2-image-logo-url)
- * // Favicon: var(--wso2-image-favicon-url)
- *
- * // Force light theme regardless of branding preference activeTheme
- * const lightTheme = transformBrandingPreferenceToTheme(brandingPreference, 'light');
- * ```
- */
-export const transformBrandingPreferenceToTheme = (
-  brandingPreference: BrandingPreference,
-  forceTheme?: 'light' | 'dark',
-): Theme => {
-  // Extract theme configuration
-  const themeConfig: BrandingTheme | undefined = brandingPreference?.preference?.theme;
-
-  if (!themeConfig) {
-    // If no theme config is provided, return default light theme
-    return createTheme({}, false);
-  }
-
-  // Determine which theme variant to use
-  let activeThemeKey: string;
-  if (forceTheme) {
-    activeThemeKey = forceTheme.toUpperCase();
-  } else {
-    activeThemeKey = themeConfig.activeTheme || 'LIGHT';
-  }
-
-  // Get the theme variant (LIGHT or DARK)
-  const themeVariant: ThemeVariant | undefined = themeConfig[
-    activeThemeKey as keyof typeof themeConfig
-  ] as ThemeVariant;
-
-  if (!themeVariant) {
-    // If the specified theme variant doesn't exist, fallback to light theme
-    const fallbackVariant: ThemeVariant | undefined = themeConfig.LIGHT || themeConfig.DARK;
-    if (fallbackVariant) {
-      const transformedConfig: Partial<ThemeConfig> = transformThemeVariant(fallbackVariant, activeThemeKey === 'DARK');
-      return createTheme(transformedConfig, activeThemeKey === 'DARK');
-    }
-    // If no theme variants exist, return default theme
-    return createTheme({}, activeThemeKey === 'DARK');
-  }
-
-  // Transform the theme variant to ThemeConfig
-  const transformedConfig: Partial<ThemeConfig> = transformThemeVariant(themeVariant, activeThemeKey === 'DARK');
-
-  // Create the theme using the transformed config
-  return createTheme(transformedConfig, activeThemeKey === 'DARK');
-};
-
-export default transformBrandingPreferenceToTheme;
diff --git a/packages/nextjs/src/server/actions/signInAction.ts b/packages/nextjs/src/server/actions/signInAction.ts
index fe97285..4cc9e50 100644
--- a/packages/nextjs/src/server/actions/signInAction.ts
+++ b/packages/nextjs/src/server/actions/signInAction.ts
@@ -163,8 +163,14 @@ const signInAction = async (
 
     return {data: response as Record<string, unknown>, success: true};
   } catch (error) {
-    logger.error(`[signInAction] Error during sign-in: ${error instanceof Error ? error.message : String(error)}`);
-    return {error: String(error), success: false};
+    const message =
+      error instanceof Error
+        ? error.message
+        : typeof (error as any)?.message === 'string'
+          ? (error as any).message
+          : String(error);
+    logger.error(`[signInAction] Error during sign-in: ${message}`);
+    return {error: message, success: false};
   }
 };
 
diff --git a/packages/react/src/ThunderIDReactClient.ts b/packages/react/src/ThunderIDReactClient.ts
index 71127d6..179d274 100644
--- a/packages/react/src/ThunderIDReactClient.ts
+++ b/packages/react/src/ThunderIDReactClient.ts
@@ -26,7 +26,6 @@ import {
   executeEmbeddedSignInFlow,
   Organization,
   IdToken,
-  deriveOrganizationHandleFromBaseUrl,
   AllOrganizationsApiResponse,
   extractUserClaimsFromIdToken,
   TokenResponse,
@@ -68,16 +67,9 @@ class ThunderIDReactClient<T extends ThunderIDReactConfig = ThunderIDReactConfig
   }
 
   override initialize(config: ThunderIDReactConfig): Promise<boolean> {
-    let resolvedOrganizationHandle: string | undefined = config?.organizationHandle;
-
-    if (!resolvedOrganizationHandle) {
-      resolvedOrganizationHandle = deriveOrganizationHandleFromBaseUrl(config?.baseUrl);
-    }
-
     return this.withLoading(async () => {
       this._initializeConfig = {
         ...config,
-        organizationHandle: resolvedOrganizationHandle,
         periodicTokenRefresh:
           config?.tokenLifecycle?.refreshToken?.autoRefresh ?? (config as any)?.periodicTokenRefresh,
       } as any;
diff --git a/packages/vue/src/ThunderIDVueClient.ts b/packages/vue/src/ThunderIDVueClient.ts
index 8617a8c..fbb4696 100644
--- a/packages/vue/src/ThunderIDVueClient.ts
+++ b/packages/vue/src/ThunderIDVueClient.ts
@@ -39,7 +39,6 @@ import {
   EmbeddedSignInFlowResponse,
   EmbeddedSignInFlowStatus,
   EmbeddedSignUpFlowStatus,
-  deriveOrganizationHandleFromBaseUrl,
   StorageManager,
 } from '@thunderid/browser';
 import getAllOrganizations from './api/getAllOrganizations';
@@ -76,15 +75,7 @@ class ThunderIDVueClient<T extends ThunderIDVueConfig = ThunderIDVueConfig> exte
   }
 
   override initialize(config: ThunderIDVueConfig): Promise<boolean> {
-    let resolvedOrganizationHandle: string | undefined = config?.organizationHandle;
-
-    if (!resolvedOrganizationHandle) {
-      resolvedOrganizationHandle = deriveOrganizationHandleFromBaseUrl(config?.baseUrl);
-    }
-
-    return this.withLoading(async () =>
-      super.initialize({...config, organizationHandle: resolvedOrganizationHandle} as unknown as T),
-    );
+    return this.withLoading(async () => super.initialize(config as unknown as T));
   }
 
   override reInitialize(config: Partial<ThunderIDVueConfig>): Promise<boolean> {

From ac1152627c09ea66da0f1dfa1179eda828adac3a Mon Sep 17 00:00:00 2001
From: Brion <info@brionmario.com>
Date: Sat, 27 Jun 2026 00:23:05 +0530
Subject: [PATCH 3/5] Refactor Next.js SDK: streamline package.json exports,
 enhance rolldown config, remove deprecated middleware, and introduce new
 proxy functionalities

---
 packages/nextjs/package.json                  | 16 ++-----
 packages/nextjs/rolldown.config.js            | 48 +++++--------------
 packages/nextjs/src/ThunderIDNextClient.ts    | 18 +++----
 packages/nextjs/src/middleware.ts             | 37 --------------
 packages/nextjs/src/server/index.ts           |  6 +++
 .../createRouteMatcher.ts                     |  0
 .../thunderIDProxy.ts}                        | 38 +++++++--------
 packages/nextjs/tsconfig.lib.json             |  1 -
 8 files changed, 48 insertions(+), 116 deletions(-)
 delete mode 100644 packages/nextjs/src/middleware.ts
 rename packages/nextjs/src/server/{middleware => proxy}/createRouteMatcher.ts (100%)
 rename packages/nextjs/src/server/{middleware/thunderIDMiddleware.ts => proxy/thunderIDProxy.ts} (92%)

diff --git a/packages/nextjs/package.json b/packages/nextjs/package.json
index 98404f9..6b7eac4 100644
--- a/packages/nextjs/package.json
+++ b/packages/nextjs/package.json
@@ -15,24 +15,14 @@
   "author": "WSO2",
   "license": "Apache-2.0",
   "type": "module",
-  "main": "dist/cjs/index.cjs",
-  "module": "dist/index.js",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.js",
-      "require": "./dist/cjs/index.cjs"
+      "import": "./dist/index.js"
     },
     "./server": {
       "types": "./dist/server/index.d.ts",
-      "import": "./dist/server/index.js",
-      "require": "./dist/cjs/server/index.cjs"
-    },
-    "./middleware": {
-      "types": "./dist/middleware.d.ts",
-      "edge-light": "./dist/middleware.js",
-      "import": "./dist/middleware.js",
-      "require": "./dist/cjs/middleware.cjs"
+      "import": "./dist/server/index.js"
     }
   },
   "files": [
@@ -47,7 +37,7 @@
     "directory": "packages/nextjs"
   },
   "scripts": {
-    "build": "pnpm clean:dist &&  rolldown -c rolldown.config.js && tsc -p tsconfig.lib.json --emitDeclarationOnly --outDir dist",
+    "build": "pnpm clean:dist && rolldown -c rolldown.config.js && tsc -p tsconfig.lib.json --emitDeclarationOnly --outDir dist",
     "clean": "pnpm clean:node_modules && pnpm clean:dist",
     "clean:dist": "rimraf dist",
     "clean:node_modules": "rimraf node_modules",
diff --git a/packages/nextjs/rolldown.config.js b/packages/nextjs/rolldown.config.js
index da2abba..eb865e0 100644
--- a/packages/nextjs/rolldown.config.js
+++ b/packages/nextjs/rolldown.config.js
@@ -22,62 +22,36 @@ import {defineConfig} from 'rolldown';
 
 const pkg = JSON.parse(readFileSync('./package.json', 'utf8'));
 
-const external = [...Object.keys(pkg.dependencies || {}), ...Object.keys(pkg.peerDependencies || {})];
+const externalPackages = [...Object.keys(pkg.dependencies || {}), ...Object.keys(pkg.peerDependencies || {})];
+const external = id => externalPackages.some(name => id === name || id.startsWith(`${name}/`));
 
-const nodeOptions = {
+const commonOptions = {
   input: [join('src', 'index.ts'), join('src', 'server', 'index.ts')],
-  preserveModules: true,
   external,
   platform: 'node',
-  target: 'es2020',
-  sourcemap: true,
-};
-
-const edgeOptions = {
-  input: [join('src', 'middleware.ts')],
-  preserveModules: true,
-  external,
-  platform: 'browser',
-  target: 'es2020',
-  sourcemap: true,
 };
 
 export default defineConfig([
-  // ESM build (node)
-  {
-    ...nodeOptions,
-    output: {
-      dir: 'dist',
-      format: 'esm',
-      preserveModulesRoot: 'src',
-    },
-  },
-  // CommonJS build (node)
-  {
-    ...nodeOptions,
-    output: {
-      dir: join('dist', 'cjs'),
-      entryFileNames: '[name].cjs',
-      format: 'cjs',
-      preserveModulesRoot: 'src',
-    },
-  },
-  // Edge/middleware ESM build (browser)
+  // ESM build
   {
-    ...edgeOptions,
+    ...commonOptions,
     output: {
       dir: 'dist',
       format: 'esm',
+      sourcemap: true,
+      preserveModules: true,
       preserveModulesRoot: 'src',
     },
   },
-  // Edge/middleware CommonJS build (browser)
+  // CommonJS build
   {
-    ...edgeOptions,
+    ...commonOptions,
     output: {
       dir: join('dist', 'cjs'),
       entryFileNames: '[name].cjs',
       format: 'cjs',
+      sourcemap: true,
+      preserveModules: true,
       preserveModulesRoot: 'src',
     },
   },
diff --git a/packages/nextjs/src/ThunderIDNextClient.ts b/packages/nextjs/src/ThunderIDNextClient.ts
index f84d055..494a624 100644
--- a/packages/nextjs/src/ThunderIDNextClient.ts
+++ b/packages/nextjs/src/ThunderIDNextClient.ts
@@ -36,7 +36,6 @@ import {
   User,
   UserProfile,
   createOrganization,
-  deriveOrganizationHandleFromBaseUrl,
   extractUserClaimsFromIdToken,
   flattenUserSchema,
   generateFlattenedUserProfile,
@@ -61,6 +60,13 @@ class ThunderIDNextClient<T extends ThunderIDNextConfig = ThunderIDNextConfig> e
   }
 
   private async ensureInitialized(): Promise<void> {
+    if (!this.isInitialized) {
+      // Server actions may run in a module context that hasn't been through
+      // ThunderIDServerProvider (e.g. a different worker). Try to initialize
+      // from environment variables before giving up.
+      await this.initialize({} as T);
+    }
+
     if (!this.isInitialized) {
       throw new Error(
         '[ThunderIDNextClient] Client is not initialized. Make sure you have wrapped your app with ThunderIDProvider and provided the required configuration (baseUrl, clientId, etc.).',
@@ -85,12 +91,6 @@ class ThunderIDNextClient<T extends ThunderIDNextConfig = ThunderIDNextConfig> e
       ...rest
     } = decorateConfigWithNextEnv(config);
 
-    let resolvedOrganizationHandle: string | undefined = organizationHandle;
-
-    if (!resolvedOrganizationHandle) {
-      resolvedOrganizationHandle = deriveOrganizationHandleFromBaseUrl(baseUrl);
-    }
-
     const origin: string = await getClientOrigin();
 
     const initialized: boolean = await super.initialize(
@@ -101,8 +101,8 @@ class ThunderIDNextClient<T extends ThunderIDNextConfig = ThunderIDNextConfig> e
         baseUrl,
         clientId,
         clientSecret,
-        enablePKCE: clientSecret == null,
-        organizationHandle: resolvedOrganizationHandle,
+        enablePKCE: (rest as any).enablePKCE ?? true,
+        organizationHandle,
         signInUrl,
         signUpUrl,
       } as any,
diff --git a/packages/nextjs/src/middleware.ts b/packages/nextjs/src/middleware.ts
deleted file mode 100644
index 6d228a7..0000000
--- a/packages/nextjs/src/middleware.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/**
- * Edge Runtime entry point — safe for use in Next.js middleware.ts.
- *
- * This file must only import modules whose full transitive dependency graph
- * contains zero Node.js-only APIs (process.versions, fs, crypto, etc.).
- * Permitted dependencies: jose, fetch, next/server, and local utilities
- * that themselves satisfy the same constraint.
- *
- * Do NOT import from:
- *   - ThunderIDNextClient (depends on @thunderid/node → @thunderid/javascript)
- *   - server/ThunderIDProvider (depends on @thunderid/node)
- *   - server/actions/* (depend on @thunderid/node)
- *   - client/* (depend on @thunderid/javascript via @thunderid/react)
- */
-
-export {default as thunderIDMiddleware} from './server/middleware/thunderIDMiddleware';
-export * from './server/middleware/thunderIDMiddleware';
-
-export {default as createRouteMatcher} from './server/middleware/createRouteMatcher';
diff --git a/packages/nextjs/src/server/index.ts b/packages/nextjs/src/server/index.ts
index 287ae23..8fb8585 100644
--- a/packages/nextjs/src/server/index.ts
+++ b/packages/nextjs/src/server/index.ts
@@ -22,3 +22,9 @@ export {default as thunderid} from './thunderid';
 
 export {default as ThunderIDProvider} from './ThunderIDProvider.js';
 export * from './ThunderIDProvider.js';
+
+export {default as thunderIDProxy} from './proxy/thunderIDProxy';
+export * from './proxy/thunderIDProxy';
+
+export {default as createRouteMatcher} from './proxy/createRouteMatcher';
+
diff --git a/packages/nextjs/src/server/middleware/createRouteMatcher.ts b/packages/nextjs/src/server/proxy/createRouteMatcher.ts
similarity index 100%
rename from packages/nextjs/src/server/middleware/createRouteMatcher.ts
rename to packages/nextjs/src/server/proxy/createRouteMatcher.ts
diff --git a/packages/nextjs/src/server/middleware/thunderIDMiddleware.ts b/packages/nextjs/src/server/proxy/thunderIDProxy.ts
similarity index 92%
rename from packages/nextjs/src/server/middleware/thunderIDMiddleware.ts
rename to packages/nextjs/src/server/proxy/thunderIDProxy.ts
index 0dc3473..aad40f5 100644
--- a/packages/nextjs/src/server/middleware/thunderIDMiddleware.ts
+++ b/packages/nextjs/src/server/proxy/thunderIDProxy.ts
@@ -24,9 +24,9 @@ import handleRefreshToken from '../../utils/handleRefreshToken';
 import SessionManager, {SessionTokenPayload} from '../../utils/SessionManager';
 import {getSessionFromRequest, getSessionIdFromRequest} from '../../utils/sessionUtils';
 
-export type ThunderIDMiddlewareOptions = Partial<ThunderIDNextConfig>;
+export type ThunderIDProxyOptions = Partial<ThunderIDNextConfig>;
 
-export interface ThunderIDMiddlewareContext {
+export interface ThunderIDProxyContext {
   /** Get the session payload from JWT session if available */
   getSession: () => Promise<SessionTokenPayload | undefined>;
   /** Get the session ID from the current request */
@@ -45,8 +45,8 @@ export interface ThunderIDMiddlewareContext {
   protectRoute: (routeOptions?: {redirect?: string}) => Promise<NextResponse | void>;
 }
 
-type ThunderIDMiddlewareHandler = (
-  thunderid: ThunderIDMiddlewareContext,
+type ThunderIDProxyHandler = (
+  thunderid: ThunderIDProxyContext,
   req: NextRequest,
 ) => Promise<NextResponse | void> | NextResponse | void;
 
@@ -93,7 +93,7 @@ const replaceCookieInHeader = (cookieHeader: string, name: string, value: string
 };
 
 /**
- * ThunderID middleware that integrates authentication into your Next.js application.
+ * ThunderID proxy that integrates authentication into your Next.js application.
  * Similar to Clerk's clerkMiddleware pattern.
  *
  * Proactively refreshes the access token when it is within REFRESH_BUFFER_SECONDS of
@@ -110,16 +110,16 @@ const replaceCookieInHeader = (cookieHeader: string, name: string, value: string
  * (NEXT_PUBLIC_THUNDERID_BASE_URL, NEXT_PUBLIC_THUNDERID_CLIENT_ID,
  * THUNDERID_CLIENT_SECRET). If none are available the refresh step is skipped silently.
  *
- * @param handler - Optional handler function to customize middleware behavior
- * @param options - Configuration options for the middleware
+ * @param handler - Optional handler function to customize proxy behavior
+ * @param options - Configuration options for the proxy
  * @returns Next.js middleware function
  *
  * @example
  * ```typescript
  * // middleware.ts - Basic usage (config read from env vars automatically)
- * import { thunderIDMiddleware } from '@thunderid/nextjs';
+ * import { thunderIDProxy } from '@thunderid/nextjs/server';
  *
- * export default thunderIDMiddleware();
+ * export default thunderIDProxy();
  *
  * export const config = {
  *   matcher: ['/((?!_next/static|_next/image|favicon.ico).*)'],
@@ -129,24 +129,24 @@ const replaceCookieInHeader = (cookieHeader: string, name: string, value: string
  * @example
  * ```typescript
  * // With route protection
- * import { thunderIDMiddleware, createRouteMatcher } from '@thunderid/nextjs';
+ * import { thunderIDProxy, createRouteMatcher } from '@thunderid/nextjs/server';
  *
  * const isProtectedRoute = createRouteMatcher(['/dashboard(.*)']);
  *
- * export default thunderIDMiddleware(async (thunderid, req) => {
+ * export default thunderIDProxy(async (thunderid, req) => {
  *   if (isProtectedRoute(req)) {
  *     await thunderid.protectRoute();
  *   }
  * });
  * ```
  */
-const thunderIDMiddleware =
+const thunderIDProxy =
   (
-    handler?: ThunderIDMiddlewareHandler,
-    options?: ThunderIDMiddlewareOptions | ((req: NextRequest) => ThunderIDMiddlewareOptions),
+    handler?: ThunderIDProxyHandler,
+    options?: ThunderIDProxyOptions | ((req: NextRequest) => ThunderIDProxyOptions),
   ): ((request: NextRequest) => Promise<NextResponse>) =>
   async (request: NextRequest): Promise<NextResponse> => {
-    const resolvedOptions: ThunderIDMiddlewareOptions =
+    const resolvedOptions: ThunderIDProxyOptions =
       typeof options === 'function' ? options(request) : options || {};
 
     // Resolve full config from passed options + environment variable fallbacks.
@@ -176,7 +176,7 @@ const thunderIDMiddleware =
     const verifiedSession: SessionTokenPayload | undefined = await getSessionFromRequest(request);
 
     // Step 2: If no verified session exists, verify the raw cookie's signature
-    // without enforcing expiry. This allows the middleware to recover from an
+    // without enforcing expiry. This allows the proxy to recover from an
     // expired access token as long as the JWT is authentic and a refresh token
     // is present. Skipping the signature check here would let a tampered cookie
     // drive identity-confusion attacks since handleRefreshToken reuses `sub`,
@@ -249,8 +249,8 @@ const thunderIDMiddleware =
     const sessionId: string | undefined = activeSession?.sessionId ?? (await getSessionIdFromRequest(request));
     const isAuthenticated = !!activeSession;
 
-    // ── Middleware context ────────────────────────────────────────────────────
-    const thunderid: ThunderIDMiddlewareContext = {
+    // ── Proxy context ─────────────────────────────────────────────────────────
+    const thunderid: ThunderIDProxyContext = {
       getSession: async (): Promise<SessionTokenPayload | undefined> => activeSession,
       getSessionId: (): string | undefined => sessionId,
       isSignedIn: (): boolean => isAuthenticated,
@@ -343,4 +343,4 @@ const thunderIDMiddleware =
     return response;
   };
 
-export default thunderIDMiddleware;
+export default thunderIDProxy;
diff --git a/packages/nextjs/tsconfig.lib.json b/packages/nextjs/tsconfig.lib.json
index 0e89616..30cb881 100644
--- a/packages/nextjs/tsconfig.lib.json
+++ b/packages/nextjs/tsconfig.lib.json
@@ -4,7 +4,6 @@
     "declaration": true,
     "declarationMap": true,
     "outDir": "dist",
-    "declarationDir": "dist/types",
     "types": ["node"]
   },
   "exclude": [

From fe15a523c46369b2267d7d45efd30e0e91de8128 Mon Sep 17 00:00:00 2001
From: Brion <info@brionmario.com>
Date: Sat, 27 Jun 2026 01:40:08 +0530
Subject: [PATCH 4/5] Clean up B2B components

---
 .../src/ThunderIDJavaScriptClient.ts          |  17 -
 .../api/__tests__/createOrganization.test.ts  | 295 ----------
 .../api/__tests__/getAllOrganizations.test.ts | 222 -------
 .../api/__tests__/getMeOrganizations.test.ts  | 222 -------
 .../src/api/__tests__/getOrganization.test.ts | 204 -------
 .../api/__tests__/updateOrganization.test.ts  | 341 -----------
 .../javascript/src/api/createOrganization.ts  | 214 -------
 .../javascript/src/api/getAllOrganizations.ts | 189 ------
 .../javascript/src/api/getMeOrganizations.ts  | 205 -------
 .../javascript/src/api/getOrganization.ts     | 187 ------
 .../src/api/getOrganizationUnitChildren.ts    | 157 +++--
 .../javascript/src/api/updateOrganization.ts  | 225 --------
 packages/javascript/src/index.ts              |  22 +-
 packages/javascript/src/models/client.ts      |  29 -
 packages/javascript/src/models/config.ts      |   8 -
 .../src/models/organization-unit.ts           | 112 ----
 .../javascript/src/models/organization.ts     |  35 --
 packages/nextjs/src/ThunderIDNextClient.ts    | 143 -----
 .../CreateOrganization/CreateOrganization.tsx | 159 -----
 .../Organization/Organization.tsx             |  83 ---
 .../OrganizationList/OrganizationList.tsx     | 136 -----
 .../OrganizationProfile.tsx                   | 221 -------
 .../OrganizationSwitcher.tsx                  | 199 -------
 .../contexts/ThunderID/ThunderIDProvider.tsx  |  28 +-
 packages/nextjs/src/client/index.ts           |  16 +-
 .../nextjs/src/server/ThunderIDProvider.tsx   |  41 +-
 .../__tests__/createOrganization.test.ts      | 128 -----
 .../__tests__/getAllOrganizations.test.ts     | 120 ----
 .../getCurrentOrganizationAction.test.ts      | 112 ----
 .../__tests__/getMyOrganizations.test.ts      | 211 -------
 .../__tests__/getOrganizationAction.test.ts   | 126 ----
 .../src/server/actions/createOrganization.ts  |  42 --
 .../src/server/actions/getAllOrganizations.ts |  42 --
 .../actions/getCurrentOrganizationAction.ts   |  49 --
 .../src/server/actions/getMyOrganizations.ts  |  82 ---
 .../server/actions/getOrganizationAction.ts   |  50 --
 .../src/server/actions/switchOrganization.ts  |  90 ---
 packages/nuxt/src/index.ts                    |   2 +-
 packages/nuxt/src/module.ts                   |  53 +-
 .../src/runtime/components/ThunderIDRoot.ts   |  87 +--
 .../organization/CreateOrganization.ts        |  71 ---
 .../components/organization/Organization.ts   |  58 --
 .../organization/OrganizationList.ts          |  67 ---
 .../organization/OrganizationProfile.ts       |  74 ---
 .../organization/OrganizationSwitcher.ts      |  64 ---
 .../nuxt/src/runtime/errors/error-codes.ts    |   3 -
 .../nuxt/src/runtime/plugins/thunderid.ts     |  14 +-
 .../src/runtime/server/ThunderIDNuxtClient.ts |  94 ---
 .../runtime/server/plugins/thunderid-ssr.ts   |  18 +-
 .../routes/auth/organizations/current.get.ts  |  56 --
 .../routes/auth/organizations/id.get.ts       |  60 --
 .../routes/auth/organizations/index.get.ts    |  55 --
 .../routes/auth/organizations/index.post.ts   |  64 ---
 .../routes/auth/organizations/me.get.ts       |  55 --
 .../routes/auth/organizations/switch.post.ts  |  91 ---
 packages/nuxt/src/runtime/types.ts            |   7 -
 packages/react/src/ThunderIDReactClient.ts    | 107 ----
 packages/react/src/api/createOrganization.ts  | 123 ----
 packages/react/src/api/getAllOrganizations.ts | 114 ----
 packages/react/src/api/getMeOrganizations.ts  | 118 ----
 packages/react/src/api/getOrganization.ts     | 110 ----
 packages/react/src/api/getSchemas.ts          | 104 ----
 packages/react/src/api/updateOrganization.ts  | 121 ----
 .../OrganizationContext.tsx                   |  84 ---
 .../OrganizationContextController.tsx         | 106 ----
 .../BaseCreateOrganization.styles.ts          | 180 ------
 .../BaseCreateOrganization.tsx                | 279 ---------
 .../CreateOrganization/CreateOrganization.tsx | 147 -----
 .../Organization/BaseOrganization.tsx         |  84 ---
 .../Organization/Organization.tsx             |  82 ---
 .../BaseOrganizationList.styles.ts            | 281 ---------
 .../OrganizationList/BaseOrganizationList.tsx | 432 --------------
 .../OrganizationList.styles.ts                |  89 ---
 .../OrganizationList/OrganizationList.tsx     | 143 -----
 .../BaseOrganizationProfile.styles.ts         | 182 ------
 .../BaseOrganizationProfile.tsx               | 541 ------------------
 .../OrganizationProfile.tsx                   | 216 -------
 .../BaseOrganizationSwitcher.styles.ts        | 275 ---------
 .../BaseOrganizationSwitcher.test.tsx         | 279 ---------
 .../BaseOrganizationSwitcher.tsx              | 522 -----------------
 .../OrganizationSwitcher.tsx                  | 201 -------
 .../UserAvatar/BaseUserAvatar.tsx             |  90 +++
 .../presentation/UserAvatar/UserAvatar.tsx    |  55 ++
 .../UserDropdown/BaseUserDropdown.tsx         |  14 +-
 .../presentation/auth/AuthOptionFactory.tsx   |  30 +-
 .../OrganizationUnitPicker.styles.ts          | 153 -----
 .../OrganizationUnitPicker.tsx                | 245 --------
 .../auth/OrganizationUnitPicker/index.ts      |  20 -
 .../Organization/OrganizationContext.ts       |  59 --
 .../Organization/OrganizationProvider.tsx     | 178 ------
 .../contexts/Organization/useOrganization.ts  | 116 ----
 .../contexts/ThunderID/ThunderIDContext.ts    |   7 +-
 .../contexts/ThunderID/ThunderIDProvider.tsx  |  49 +-
 .../ThunderID/__tests__/useThunderID.test.tsx |   3 -
 packages/react/src/index.ts                   |  53 --
 packages/vue/src/ThunderIDVueClient.ts        | 107 ----
 .../composables/useOrganization.test.ts       | 100 ----
 packages/vue/src/api/getAllOrganizations.ts   |  62 --
 packages/vue/src/api/getMeOrganizations.ts    |  62 --
 .../BaseCreateOrganization.ts                 | 118 ----
 .../CreateOrganization.css.ts                 |  67 ---
 .../create-organization/CreateOrganization.ts |  64 ---
 .../organization-list/BaseOrganizationList.ts |  82 ---
 .../organization-list/OrganizationList.css.ts |  89 ---
 .../organization-list/OrganizationList.ts     |  61 --
 .../BaseOrganizationProfile.ts                | 412 -------------
 .../OrganizationProfile.css.ts                | 219 -------
 .../OrganizationProfile.ts                    |  67 ---
 .../BaseOrganizationSwitcher.ts               | 131 -----
 .../OrganizationSwitcher.css.ts               | 154 -----
 .../OrganizationSwitcher.ts                   |  53 --
 .../presentation/organization/Organization.ts |  57 --
 .../vue/src/composables/useOrganization.ts    |  57 --
 packages/vue/src/index.ts                     |  15 -
 packages/vue/src/keys.ts                      |   6 -
 packages/vue/src/models/contexts.ts           |  35 --
 .../vue/src/providers/OrganizationProvider.ts | 148 -----
 .../vue/src/providers/ThunderIDProvider.ts    |  57 +-
 packages/vue/src/styles/injectStyles.ts       |   8 -
 119 files changed, 294 insertions(+), 13684 deletions(-)
 delete mode 100644 packages/javascript/src/api/__tests__/createOrganization.test.ts
 delete mode 100644 packages/javascript/src/api/__tests__/getAllOrganizations.test.ts
 delete mode 100644 packages/javascript/src/api/__tests__/getMeOrganizations.test.ts
 delete mode 100644 packages/javascript/src/api/__tests__/getOrganization.test.ts
 delete mode 100644 packages/javascript/src/api/__tests__/updateOrganization.test.ts
 delete mode 100644 packages/javascript/src/api/createOrganization.ts
 delete mode 100644 packages/javascript/src/api/getAllOrganizations.ts
 delete mode 100644 packages/javascript/src/api/getMeOrganizations.ts
 delete mode 100644 packages/javascript/src/api/getOrganization.ts
 delete mode 100644 packages/javascript/src/api/updateOrganization.ts
 delete mode 100644 packages/javascript/src/models/organization-unit.ts
 delete mode 100644 packages/javascript/src/models/organization.ts
 delete mode 100644 packages/nextjs/src/client/components/presentation/CreateOrganization/CreateOrganization.tsx
 delete mode 100644 packages/nextjs/src/client/components/presentation/Organization/Organization.tsx
 delete mode 100644 packages/nextjs/src/client/components/presentation/OrganizationList/OrganizationList.tsx
 delete mode 100644 packages/nextjs/src/client/components/presentation/OrganizationProfile/OrganizationProfile.tsx
 delete mode 100644 packages/nextjs/src/client/components/presentation/OrganizationSwitcher/OrganizationSwitcher.tsx
 delete mode 100644 packages/nextjs/src/server/actions/__tests__/createOrganization.test.ts
 delete mode 100644 packages/nextjs/src/server/actions/__tests__/getAllOrganizations.test.ts
 delete mode 100644 packages/nextjs/src/server/actions/__tests__/getCurrentOrganizationAction.test.ts
 delete mode 100644 packages/nextjs/src/server/actions/__tests__/getMyOrganizations.test.ts
 delete mode 100644 packages/nextjs/src/server/actions/__tests__/getOrganizationAction.test.ts
 delete mode 100644 packages/nextjs/src/server/actions/createOrganization.ts
 delete mode 100644 packages/nextjs/src/server/actions/getAllOrganizations.ts
 delete mode 100644 packages/nextjs/src/server/actions/getCurrentOrganizationAction.ts
 delete mode 100644 packages/nextjs/src/server/actions/getMyOrganizations.ts
 delete mode 100644 packages/nextjs/src/server/actions/getOrganizationAction.ts
 delete mode 100644 packages/nextjs/src/server/actions/switchOrganization.ts
 delete mode 100644 packages/nuxt/src/runtime/components/organization/CreateOrganization.ts
 delete mode 100644 packages/nuxt/src/runtime/components/organization/Organization.ts
 delete mode 100644 packages/nuxt/src/runtime/components/organization/OrganizationList.ts
 delete mode 100644 packages/nuxt/src/runtime/components/organization/OrganizationProfile.ts
 delete mode 100644 packages/nuxt/src/runtime/components/organization/OrganizationSwitcher.ts
 delete mode 100644 packages/nuxt/src/runtime/server/routes/auth/organizations/current.get.ts
 delete mode 100644 packages/nuxt/src/runtime/server/routes/auth/organizations/id.get.ts
 delete mode 100644 packages/nuxt/src/runtime/server/routes/auth/organizations/index.get.ts
 delete mode 100644 packages/nuxt/src/runtime/server/routes/auth/organizations/index.post.ts
 delete mode 100644 packages/nuxt/src/runtime/server/routes/auth/organizations/me.get.ts
 delete mode 100644 packages/nuxt/src/runtime/server/routes/auth/organizations/switch.post.ts
 delete mode 100644 packages/react/src/api/createOrganization.ts
 delete mode 100644 packages/react/src/api/getAllOrganizations.ts
 delete mode 100644 packages/react/src/api/getMeOrganizations.ts
 delete mode 100644 packages/react/src/api/getOrganization.ts
 delete mode 100644 packages/react/src/api/getSchemas.ts
 delete mode 100644 packages/react/src/api/updateOrganization.ts
 delete mode 100644 packages/react/src/components/control/OrganizationContext/OrganizationContext.tsx
 delete mode 100644 packages/react/src/components/control/OrganizationContext/OrganizationContextController.tsx
 delete mode 100644 packages/react/src/components/presentation/CreateOrganization/BaseCreateOrganization.styles.ts
 delete mode 100644 packages/react/src/components/presentation/CreateOrganization/BaseCreateOrganization.tsx
 delete mode 100644 packages/react/src/components/presentation/CreateOrganization/CreateOrganization.tsx
 delete mode 100644 packages/react/src/components/presentation/Organization/BaseOrganization.tsx
 delete mode 100644 packages/react/src/components/presentation/Organization/Organization.tsx
 delete mode 100644 packages/react/src/components/presentation/OrganizationList/BaseOrganizationList.styles.ts
 delete mode 100644 packages/react/src/components/presentation/OrganizationList/BaseOrganizationList.tsx
 delete mode 100644 packages/react/src/components/presentation/OrganizationList/OrganizationList.styles.ts
 delete mode 100644 packages/react/src/components/presentation/OrganizationList/OrganizationList.tsx
 delete mode 100644 packages/react/src/components/presentation/OrganizationProfile/BaseOrganizationProfile.styles.ts
 delete mode 100644 packages/react/src/components/presentation/OrganizationProfile/BaseOrganizationProfile.tsx
 delete mode 100644 packages/react/src/components/presentation/OrganizationProfile/OrganizationProfile.tsx
 delete mode 100644 packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.styles.ts
 delete mode 100644 packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.test.tsx
 delete mode 100644 packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.tsx
 delete mode 100644 packages/react/src/components/presentation/OrganizationSwitcher/OrganizationSwitcher.tsx
 create mode 100644 packages/react/src/components/presentation/UserAvatar/BaseUserAvatar.tsx
 create mode 100644 packages/react/src/components/presentation/UserAvatar/UserAvatar.tsx
 delete mode 100644 packages/react/src/components/presentation/auth/OrganizationUnitPicker/OrganizationUnitPicker.styles.ts
 delete mode 100644 packages/react/src/components/presentation/auth/OrganizationUnitPicker/OrganizationUnitPicker.tsx
 delete mode 100644 packages/react/src/components/presentation/auth/OrganizationUnitPicker/index.ts
 delete mode 100644 packages/react/src/contexts/Organization/OrganizationContext.ts
 delete mode 100644 packages/react/src/contexts/Organization/OrganizationProvider.tsx
 delete mode 100644 packages/react/src/contexts/Organization/useOrganization.ts
 delete mode 100644 packages/vue/src/__tests__/composables/useOrganization.test.ts
 delete mode 100644 packages/vue/src/api/getAllOrganizations.ts
 delete mode 100644 packages/vue/src/api/getMeOrganizations.ts
 delete mode 100644 packages/vue/src/components/presentation/create-organization/BaseCreateOrganization.ts
 delete mode 100644 packages/vue/src/components/presentation/create-organization/CreateOrganization.css.ts
 delete mode 100644 packages/vue/src/components/presentation/create-organization/CreateOrganization.ts
 delete mode 100644 packages/vue/src/components/presentation/organization-list/BaseOrganizationList.ts
 delete mode 100644 packages/vue/src/components/presentation/organization-list/OrganizationList.css.ts
 delete mode 100644 packages/vue/src/components/presentation/organization-list/OrganizationList.ts
 delete mode 100644 packages/vue/src/components/presentation/organization-profile/BaseOrganizationProfile.ts
 delete mode 100644 packages/vue/src/components/presentation/organization-profile/OrganizationProfile.css.ts
 delete mode 100644 packages/vue/src/components/presentation/organization-profile/OrganizationProfile.ts
 delete mode 100644 packages/vue/src/components/presentation/organization-switcher/BaseOrganizationSwitcher.ts
 delete mode 100644 packages/vue/src/components/presentation/organization-switcher/OrganizationSwitcher.css.ts
 delete mode 100644 packages/vue/src/components/presentation/organization-switcher/OrganizationSwitcher.ts
 delete mode 100644 packages/vue/src/components/presentation/organization/Organization.ts
 delete mode 100644 packages/vue/src/composables/useOrganization.ts
 delete mode 100644 packages/vue/src/providers/OrganizationProvider.ts

diff --git a/packages/javascript/src/ThunderIDJavaScriptClient.ts b/packages/javascript/src/ThunderIDJavaScriptClient.ts
index 415bafa..b4358dd 100644
--- a/packages/javascript/src/ThunderIDJavaScriptClient.ts
+++ b/packages/javascript/src/ThunderIDJavaScriptClient.ts
@@ -33,7 +33,6 @@ import {Crypto} from './models/crypto';
 import {ExtendedAuthorizeRequestUrlParams} from './models/oauth-request';
 import {OIDCDiscoveryApiResponse} from './models/oidc-discovery';
 import {OIDCEndpoints} from './models/oidc-endpoints';
-import {AllOrganizationsApiResponse, Organization} from './models/organization';
 import {SessionData, UserSession} from './models/session';
 import {Storage, TemporaryStore} from './models/store';
 import {IdToken, TokenExchangeRequestConfig, TokenResponse} from './models/token';
@@ -312,22 +311,6 @@ class ThunderIDJavaScriptClient<T = Config> implements ThunderIDClient<T> {
     throw new Error('Method not implemented.');
   }
 
-  public switchOrganization(_organization: Organization, _sessionId?: string): Promise<TokenResponse | Response> {
-    throw new Error('Method not implemented.');
-  }
-
-  public getCurrentOrganization(_sessionId?: string): Promise<Organization | null> {
-    throw new Error('Method not implemented.');
-  }
-
-  public getAllOrganizations(_options?: any, _sessionId?: string): Promise<AllOrganizationsApiResponse> {
-    throw new Error('Method not implemented.');
-  }
-
-  public getMyOrganizations(_options?: any, _sessionId?: string): Promise<Organization[]> {
-    throw new Error('Method not implemented.');
-  }
-
   public getUserProfile(_options?: any): Promise<UserProfile> {
     throw new Error('Method not implemented.');
   }
diff --git a/packages/javascript/src/api/__tests__/createOrganization.test.ts b/packages/javascript/src/api/__tests__/createOrganization.test.ts
deleted file mode 100644
index cd1bd38..0000000
--- a/packages/javascript/src/api/__tests__/createOrganization.test.ts
+++ /dev/null
@@ -1,295 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {describe, it, expect, vi, beforeEach} from 'vitest';
-import ThunderIDAPIError from '../../errors/ThunderIDAPIError';
-import {Organization} from '../../models/organization';
-import createOrganization, {CreateOrganizationPayload} from '../createOrganization';
-
-describe('createOrganization', (): void => {
-  beforeEach((): void => {
-    vi.resetAllMocks();
-  });
-
-  it('should create organization successfully with default fetch', async (): Promise<void> => {
-    const mockOrg: Organization = {
-      id: 'org-001',
-      name: 'Team Viewer',
-      orgHandle: 'team-viewer',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const payload: CreateOrganizationPayload = {
-      description: 'Screen sharing organization',
-      name: 'Team Viewer',
-      orgHandle: 'team-viewer',
-      parentId: 'parent-123',
-      type: 'TENANT',
-    };
-
-    const baseUrl = 'https://localhost:8090';
-    const result: Organization = await createOrganization({baseUrl, payload});
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/organizations`, {
-      body: JSON.stringify(payload),
-      headers: {
-        Accept: 'application/json',
-        'Content-Type': 'application/json',
-      },
-      method: 'POST',
-    });
-    expect(result).toEqual(mockOrg);
-  });
-
-  it('should use custom fetcher when provided', async (): Promise<void> => {
-    const mockOrg: Organization = {
-      id: 'org-002',
-      name: 'Demo Org',
-      orgHandle: 'demo-org',
-    };
-
-    const customFetcher: typeof fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const payload: CreateOrganizationPayload = {
-      description: 'Example org',
-      name: 'Demo Org',
-      parentId: 'p123',
-      type: 'TENANT',
-    };
-
-    const baseUrl = 'https://localhost:8090';
-    const result: Organization = await createOrganization({
-      baseUrl,
-      fetcher: customFetcher,
-      payload,
-    });
-
-    expect(result).toEqual(mockOrg);
-    expect(customFetcher).toHaveBeenCalledWith(
-      `${baseUrl}/api/server/v1/organizations`,
-      expect.objectContaining({
-        headers: expect.objectContaining({
-          Accept: 'application/json',
-          'Content-Type': 'application/json',
-        }),
-        method: 'POST',
-      }),
-    );
-  });
-
-  it('should handle errors thrown directly by custom fetcher', async (): Promise<void> => {
-    const customFetcher: typeof fetch = vi.fn().mockImplementation(() => {
-      throw new Error('Custom fetcher failure');
-    });
-
-    const payload: CreateOrganizationPayload = {
-      description: 'Error via fetcher',
-      name: 'Fetcher Org',
-      parentId: 'p222',
-      type: 'TENANT',
-    };
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(createOrganization({baseUrl, fetcher: customFetcher, payload})).rejects.toThrow(
-      'Network or parsing error: Custom fetcher failure',
-    );
-  });
-
-  it('should throw ThunderIDAPIError for invalid base URL', async (): Promise<void> => {
-    const payload: CreateOrganizationPayload = {
-      description: 'Invalid test',
-      name: 'Broken Org',
-      parentId: 'p1',
-      type: 'TENANT',
-    };
-
-    await expect(createOrganization({baseUrl: 'invalid-url', payload})).rejects.toThrow(ThunderIDAPIError);
-    await expect(createOrganization({baseUrl: 'invalid-url', payload})).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should throw ThunderIDAPIError for undefined baseUrl', async (): Promise<void> => {
-    const payload: CreateOrganizationPayload = {
-      description: 'No URL test',
-      name: 'Broken Org',
-      parentId: 'p1',
-      type: 'TENANT',
-    };
-
-    await expect(createOrganization({baseUrl: undefined, payload})).rejects.toThrow(ThunderIDAPIError);
-    await expect(createOrganization({baseUrl: undefined, payload})).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should throw ThunderIDAPIError for empty string baseUrl', async (): Promise<void> => {
-    const payload: CreateOrganizationPayload = {
-      description: 'Empty URL test',
-      name: 'Broken Org',
-      parentId: 'p1',
-      type: 'TENANT',
-    };
-    await expect(createOrganization({baseUrl: '', payload})).rejects.toThrow(ThunderIDAPIError);
-    await expect(createOrganization({baseUrl: '', payload})).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should throw ThunderIDAPIError when payload is missing', async (): Promise<void> => {
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(createOrganization({baseUrl} as any)).rejects.toThrow(ThunderIDAPIError);
-    await expect(createOrganization({baseUrl} as any)).rejects.toThrow('Organization payload is required');
-  });
-
-  it("should always set type to 'TENANT' in payload", async (): Promise<void> => {
-    const mockOrg: Organization = {
-      id: 'org-002',
-      name: 'Demo Org',
-      orgHandle: 'demo-org',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const payload: CreateOrganizationPayload = {
-      description: 'Example org',
-      name: 'Demo Org',
-      parentId: 'p123',
-      type: 'GROUP', // Intentionally incorrect to test override
-    };
-
-    const baseUrl = 'https://localhost:8090';
-    await createOrganization({baseUrl, payload});
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/organizations`, {
-      body: JSON.stringify({
-        ...payload,
-        type: 'TENANT',
-      }),
-      headers: {
-        Accept: 'application/json',
-        'Content-Type': 'application/json',
-      },
-      method: 'POST',
-    });
-  });
-
-  it('should handle HTTP error responses', async (): Promise<void> => {
-    global.fetch = vi.fn().mockResolvedValue({
-      ok: false,
-      status: 400,
-      statusText: 'Bad Request',
-      text: () => Promise.resolve('Invalid organization data'),
-    });
-
-    const payload: CreateOrganizationPayload = {
-      description: 'Error test',
-      name: 'Bad Org',
-      parentId: 'p99',
-      type: 'TENANT',
-    };
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(createOrganization({baseUrl, payload})).rejects.toThrow(ThunderIDAPIError);
-    await expect(createOrganization({baseUrl, payload})).rejects.toThrow(
-      'Failed to create organization: Invalid organization data',
-    );
-  });
-
-  it('should handle network or parsing errors', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue(new Error('Network error'));
-
-    const payload: CreateOrganizationPayload = {
-      description: 'Network issue',
-      name: 'Fail Org',
-      parentId: 'p404',
-      type: 'TENANT',
-    };
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(createOrganization({baseUrl, payload})).rejects.toThrow(ThunderIDAPIError);
-    await expect(createOrganization({baseUrl, payload})).rejects.toThrow('Network or parsing error: Network error');
-  });
-
-  it('should handle non-Error rejections', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue('unexpected failure');
-
-    const payload: CreateOrganizationPayload = {
-      description: 'Unknown error org',
-      name: 'Unknown Org',
-      parentId: 'p000',
-      type: 'TENANT',
-    };
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(createOrganization({baseUrl, payload})).rejects.toThrow('Network or parsing error: Unknown error');
-  });
-
-  it('should pass through custom headers', async (): Promise<void> => {
-    const mockOrg: Organization = {
-      id: 'org-003',
-      name: 'Header Org',
-      orgHandle: 'header-org',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const payload: CreateOrganizationPayload = {
-      description: 'Header test org',
-      name: 'Header Org',
-      parentId: 'p456',
-      type: 'TENANT',
-    };
-
-    const customHeaders: Record<string, string> = {
-      Authorization: 'Bearer token',
-      'X-Custom-Header': 'custom-value',
-    };
-
-    const baseUrl = 'https://localhost:8090';
-
-    await createOrganization({
-      baseUrl,
-      headers: customHeaders,
-      payload,
-    });
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/organizations`, {
-      body: JSON.stringify(payload),
-      headers: {
-        Accept: 'application/json',
-        Authorization: 'Bearer token',
-        'Content-Type': 'application/json',
-        'X-Custom-Header': 'custom-value',
-      },
-      method: 'POST',
-    });
-  });
-});
diff --git a/packages/javascript/src/api/__tests__/getAllOrganizations.test.ts b/packages/javascript/src/api/__tests__/getAllOrganizations.test.ts
deleted file mode 100644
index 9a52161..0000000
--- a/packages/javascript/src/api/__tests__/getAllOrganizations.test.ts
+++ /dev/null
@@ -1,222 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {describe, it, expect, vi, beforeEach} from 'vitest';
-import ThunderIDAPIError from '../../errors/ThunderIDAPIError';
-import {AllOrganizationsApiResponse} from '../../models/organization';
-import getAllOrganizations from '../getAllOrganizations';
-
-describe('getAllOrganizations', (): void => {
-  beforeEach((): void => {
-    vi.resetAllMocks();
-  });
-
-  it('should fetch all organizations successfully with default fetch', async (): Promise<void> => {
-    const mockResponse: AllOrganizationsApiResponse = {
-      hasMore: false,
-      nextCursor: null,
-      organizations: [
-        {id: 'org1', name: 'Org One', orgHandle: 'org-one'},
-        {id: 'org2', name: 'Org Two', orgHandle: 'org-two'},
-      ],
-      totalCount: 2,
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockResponse),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const result: AllOrganizationsApiResponse = await getAllOrganizations({baseUrl});
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/organizations?limit=10&recursive=false`, {
-      headers: {
-        Accept: 'application/json',
-        'Content-Type': 'application/json',
-      },
-      method: 'GET',
-    });
-    expect(result).toEqual(mockResponse);
-  });
-
-  it('should append query parameters when provided', async (): Promise<void> => {
-    const mockResponse: AllOrganizationsApiResponse = {
-      hasMore: true,
-      nextCursor: 'abc123',
-      organizations: [],
-      totalCount: 5,
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockResponse),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    await getAllOrganizations({
-      baseUrl,
-      filter: 'type eq TENANT',
-      limit: 20,
-      recursive: true,
-    });
-
-    expect(fetch).toHaveBeenCalledWith(
-      `${baseUrl}/api/server/v1/organizations?filter=type+eq+TENANT&limit=20&recursive=true`,
-      expect.any(Object),
-    );
-  });
-
-  it('should use custom fetcher when provided', async (): Promise<void> => {
-    const mockResponse: AllOrganizationsApiResponse = {
-      hasMore: false,
-      nextCursor: null,
-      organizations: [{id: 'org1', name: 'Custom Org', orgHandle: 'custom-org'}],
-      totalCount: 1,
-    };
-
-    const customFetcher: typeof fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockResponse),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const result: AllOrganizationsApiResponse = await getAllOrganizations({baseUrl, fetcher: customFetcher});
-
-    expect(result).toEqual(mockResponse);
-    expect(customFetcher).toHaveBeenCalledWith(
-      `${baseUrl}/api/server/v1/organizations?limit=10&recursive=false`,
-      expect.objectContaining({
-        method: 'GET',
-      }),
-    );
-  });
-
-  it('should handle errors thrown directly by custom fetcher', async (): Promise<void> => {
-    const customFetcher: typeof fetch = vi.fn().mockImplementation(() => {
-      throw new Error('Custom fetcher failure');
-    });
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getAllOrganizations({baseUrl, fetcher: customFetcher})).rejects.toThrow(
-      'Network or parsing error: Custom fetcher failure',
-    );
-  });
-
-  it('should throw ThunderIDAPIError for invalid base URL', async (): Promise<void> => {
-    await expect(getAllOrganizations({baseUrl: 'invalid-url'})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getAllOrganizations({baseUrl: 'invalid-url'})).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should throw ThunderIDAPIError for undefined baseUrl', async (): Promise<void> => {
-    await expect(getAllOrganizations({baseUrl: undefined} as any)).rejects.toThrow(ThunderIDAPIError);
-    await expect(getAllOrganizations({baseUrl: undefined} as any)).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should throw ThunderIDAPIError for empty string baseUrl', async (): Promise<void> => {
-    await expect(getAllOrganizations({baseUrl: ''})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getAllOrganizations({baseUrl: ''})).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should handle HTTP error responses', async (): Promise<void> => {
-    global.fetch = vi.fn().mockResolvedValue({
-      ok: false,
-      status: 400,
-      statusText: 'Bad Request',
-      text: () => Promise.resolve('Invalid query'),
-    });
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getAllOrganizations({baseUrl})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getAllOrganizations({baseUrl})).rejects.toThrow('Failed to get organizations: Invalid query');
-  });
-
-  it('should handle network or parsing errors', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue(new Error('Network error'));
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getAllOrganizations({baseUrl})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getAllOrganizations({baseUrl})).rejects.toThrow('Network or parsing error: Network error');
-  });
-
-  it('should handle non-Error rejections', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue('unexpected failure');
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getAllOrganizations({baseUrl})).rejects.toThrow('Network or parsing error: Unknown error');
-  });
-
-  it('should pass through custom headers (and enforces content-type & accept)', async (): Promise<void> => {
-    const mockResponse: AllOrganizationsApiResponse = {
-      hasMore: false,
-      nextCursor: null,
-      organizations: [],
-      totalCount: 1,
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockResponse),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const customHeaders: Record<string, string> = {
-      Accept: 'text/plain',
-      Authorization: 'Bearer token',
-      'Content-Type': 'text/plain',
-      'X-Custom-Header': 'custom-value',
-    };
-
-    await getAllOrganizations({
-      baseUrl,
-      headers: customHeaders,
-    });
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/organizations?limit=10&recursive=false`, {
-      headers: {
-        Accept: 'application/json',
-        Authorization: 'Bearer token',
-        'Content-Type': 'application/json',
-        'X-Custom-Header': 'custom-value',
-      },
-      method: 'GET',
-    });
-  });
-
-  it('should return an empty organization list if none exist', async (): Promise<void> => {
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () =>
-        Promise.resolve({
-          hasMore: false,
-          nextCursor: null,
-          totalCount: 0, // missing organizations
-        }),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const result: AllOrganizationsApiResponse = await getAllOrganizations({baseUrl});
-
-    expect(result.organizations).toEqual([]);
-    expect(result.totalCount).toBe(0);
-  });
-});
diff --git a/packages/javascript/src/api/__tests__/getMeOrganizations.test.ts b/packages/javascript/src/api/__tests__/getMeOrganizations.test.ts
deleted file mode 100644
index a169ec4..0000000
--- a/packages/javascript/src/api/__tests__/getMeOrganizations.test.ts
+++ /dev/null
@@ -1,222 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {Mock, beforeEach, describe, expect, it, vi} from 'vitest';
-import ThunderIDAPIError from '../../errors/ThunderIDAPIError';
-import type {Organization} from '../../models/organization';
-import getMeOrganizations from '../getMeOrganizations';
-
-describe('getMeOrganizations', (): void => {
-  beforeEach((): void => {
-    vi.resetAllMocks();
-  });
-
-  it('should fetch associated orgs successfully (default fetch)', async (): Promise<void> => {
-    const mock: {organizations: Organization[]} = {
-      organizations: [
-        {id: 'o1', name: 'One', orgHandle: 'one'},
-        {id: 'o2', name: 'Two', orgHandle: 'two'},
-      ],
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mock),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const result: Organization[] = await getMeOrganizations({baseUrl});
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/users/v1/me/organizations?limit=10&recursive=false`, {
-      headers: {
-        Accept: 'application/json',
-        'Content-Type': 'application/json',
-      },
-      method: 'GET',
-    });
-    expect(result).toEqual(mock.organizations);
-  });
-
-  it('should append query params when provided', async (): Promise<void> => {
-    const mock: {organizations: Organization[]} = {organizations: [] as Organization[]};
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mock),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    await getMeOrganizations({
-      after: 'YWZ0',
-      authorizedAppName: 'my-app',
-      baseUrl,
-      before: 'YmZy',
-      filter: 'name co "acme"',
-      limit: 25,
-      recursive: true,
-    });
-
-    expect(fetch).toHaveBeenCalledWith(
-      `${baseUrl}/api/users/v1/me/organizations?after=YWZ0&authorizedAppName=my-app&before=YmZy&filter=name+co+%22acme%22&limit=25&recursive=true`,
-      expect.any(Object),
-    );
-  });
-
-  it('should use custom fetcher when provided', async (): Promise<void> => {
-    const mock: {organizations: Organization[]} = {organizations: [{id: 'o1', name: 'C', orgHandle: 'c'}]};
-
-    const customFetcher: Mock = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mock),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const result: Organization[] = await getMeOrganizations({baseUrl, fetcher: customFetcher});
-
-    expect(result).toEqual(mock.organizations);
-    expect(customFetcher).toHaveBeenCalledWith(
-      `${baseUrl}/api/users/v1/me/organizations?limit=10&recursive=false`,
-      expect.objectContaining({method: 'GET'}),
-    );
-  });
-
-  it('should handle errors thrown directly by custom fetcher', async (): Promise<void> => {
-    const customFetcher: Mock = vi.fn().mockImplementation(() => {
-      throw new Error('Custom fetcher failure');
-    });
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getMeOrganizations({baseUrl, fetcher: customFetcher})).rejects.toThrow(
-      'Network or parsing error: Custom fetcher failure',
-    );
-  });
-
-  it('should throw ThunderIDAPIError for invalid base URL', async (): Promise<void> => {
-    await expect(getMeOrganizations({baseUrl: 'invalid-url' as any})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getMeOrganizations({baseUrl: 'invalid-url' as any})).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should throw ThunderIDAPIError for undefined baseUrl', async (): Promise<void> => {
-    await expect(getMeOrganizations({baseUrl: undefined as any})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getMeOrganizations({baseUrl: undefined as any})).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should throw ThunderIDAPIError for empty string baseUrl', async (): Promise<void> => {
-    await expect(getMeOrganizations({baseUrl: ''})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getMeOrganizations({baseUrl: ''})).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should handle HTTP error responses', async (): Promise<void> => {
-    global.fetch = vi.fn().mockResolvedValue({
-      ok: false,
-      status: 403,
-      statusText: 'Forbidden',
-      text: () => Promise.resolve('Not authorized'),
-    });
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getMeOrganizations({baseUrl})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getMeOrganizations({baseUrl})).rejects.toThrow(
-      'Failed to fetch associated organizations of the user: Not authorized',
-    );
-  });
-
-  it('should handle network or parsing errors', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue(new Error('Network error'));
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getMeOrganizations({baseUrl})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getMeOrganizations({baseUrl})).rejects.toThrow('Network or parsing error: Network error');
-  });
-
-  it('should handle non-Error rejections', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue('unexpected failure');
-
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getMeOrganizations({baseUrl})).rejects.toThrow('Network or parsing error: Unknown error');
-  });
-
-  it('should include custom headers when provided', async (): Promise<void> => {
-    const mock: {organizations: Organization[]} = {organizations: [] as Organization[]};
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mock),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const customHeaders: Record<string, string> = {
-      Authorization: 'Bearer token',
-      'X-Custom-Header': 'custom-value',
-    };
-
-    await getMeOrganizations({baseUrl, headers: customHeaders});
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/users/v1/me/organizations?limit=10&recursive=false`, {
-      headers: {
-        Accept: 'application/json',
-        Authorization: 'Bearer token',
-        'Content-Type': 'application/json',
-        'X-Custom-Header': 'custom-value',
-      },
-      method: 'GET',
-    });
-  });
-
-  it('should return [] if response has no organizations property', async (): Promise<void> => {
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve({}), // missing organizations
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const result: Organization[] = await getMeOrganizations({baseUrl});
-
-    expect(result).toEqual([]);
-  });
-
-  it('should pass custom headers to fetch correctly', async (): Promise<void> => {
-    const mock: {organizations: Organization[]} = {organizations: [] as Organization[]};
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mock),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const customHeaders: Record<string, string> = {
-      Authorization: 'Bearer token',
-      'X-Custom-Header': 'custom-value',
-    };
-
-    await getMeOrganizations({baseUrl, headers: customHeaders});
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/users/v1/me/organizations?limit=10&recursive=false`, {
-      headers: {
-        Accept: 'application/json',
-        Authorization: 'Bearer token',
-        'Content-Type': 'application/json',
-        'X-Custom-Header': 'custom-value',
-      },
-      method: 'GET',
-    });
-  });
-});
diff --git a/packages/javascript/src/api/__tests__/getOrganization.test.ts b/packages/javascript/src/api/__tests__/getOrganization.test.ts
deleted file mode 100644
index eacb092..0000000
--- a/packages/javascript/src/api/__tests__/getOrganization.test.ts
+++ /dev/null
@@ -1,204 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {describe, it, expect, vi, beforeEach} from 'vitest';
-import ThunderIDAPIError from '../../errors/ThunderIDAPIError';
-import getOrganization from '../getOrganization';
-import type {OrganizationDetails} from '../getOrganization';
-
-describe('getOrganization', (): void => {
-  beforeEach((): void => {
-    vi.resetAllMocks();
-  });
-
-  it('should fetch organization details successfully (default fetch)', async (): Promise<void> => {
-    const mockOrg: OrganizationDetails = {
-      description: 'Demo org',
-      id: '0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1',
-      name: 'DX Lab',
-      orgHandle: 'dxlab',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const organizationId: string = mockOrg.id;
-    const result: OrganizationDetails = await getOrganization({baseUrl, organizationId});
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/organizations/${organizationId}`, {
-      headers: {
-        Accept: 'application/json',
-        'Content-Type': 'application/json',
-      },
-      method: 'GET',
-    });
-    expect(result).toEqual(mockOrg);
-  });
-
-  it('should use custom fetcher when provided', async (): Promise<void> => {
-    const mockOrg: OrganizationDetails = {
-      id: 'org-123',
-      name: 'Custom Org',
-      orgHandle: 'custom-org',
-    };
-
-    const customFetcher: typeof fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const organizationId = 'org-123';
-    const result: OrganizationDetails = await getOrganization({
-      baseUrl,
-      fetcher: customFetcher,
-      organizationId,
-    });
-
-    expect(result).toEqual(mockOrg);
-    expect(customFetcher).toHaveBeenCalledWith(
-      `${baseUrl}/api/server/v1/organizations/${organizationId}`,
-      expect.objectContaining({
-        headers: expect.objectContaining({
-          Accept: 'application/json',
-          'Content-Type': 'application/json',
-        }),
-        method: 'GET',
-      }),
-    );
-  });
-
-  it('should handle errors thrown directly by custom fetcher', async (): Promise<void> => {
-    const customFetcher: typeof fetch = vi.fn().mockImplementation(() => {
-      throw new Error('Custom fetcher failure');
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const organizationId = 'org-1';
-
-    await expect(getOrganization({baseUrl, fetcher: customFetcher, organizationId})).rejects.toThrow(
-      'Network or parsing error: Custom fetcher failure',
-    );
-  });
-
-  it('should throw ThunderIDAPIError for invalid base URL', async (): Promise<void> => {
-    await expect(getOrganization({baseUrl: 'invalid-url' as any, organizationId: 'org-1'})).rejects.toThrow(
-      ThunderIDAPIError,
-    );
-    // Substring match is fine because the implementation appends the native error text
-    await expect(getOrganization({baseUrl: 'invalid-url' as any, organizationId: 'org-1'})).rejects.toThrow(
-      'Invalid base URL provided.',
-    );
-  });
-
-  it('should throw ThunderIDAPIError for undefined baseUrl', async (): Promise<void> => {
-    await expect(getOrganization({baseUrl: undefined as any, organizationId: 'org-1'})).rejects.toThrow(
-      ThunderIDAPIError,
-    );
-    await expect(getOrganization({baseUrl: undefined as any, organizationId: 'org-1'})).rejects.toThrow(
-      'Invalid base URL provided.',
-    );
-  });
-
-  it('should throw ThunderIDAPIError for empty string baseUrl', async (): Promise<void> => {
-    await expect(getOrganization({baseUrl: '', organizationId: 'org-1'})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getOrganization({baseUrl: '', organizationId: 'org-1'})).rejects.toThrow('Invalid base URL provided.');
-  });
-
-  it('should throw ThunderIDAPIError when organizationId is missing', async (): Promise<void> => {
-    const baseUrl = 'https://localhost:8090';
-
-    await expect(getOrganization({baseUrl, organizationId: '' as any})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getOrganization({baseUrl, organizationId: '' as any})).rejects.toThrow('Organization ID is required');
-  });
-
-  it('should handle HTTP error responses', async (): Promise<void> => {
-    global.fetch = vi.fn().mockResolvedValue({
-      ok: false,
-      status: 404,
-      statusText: 'Not Found',
-      text: () => Promise.resolve('Organization not found'),
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const organizationId = 'missing-org';
-
-    await expect(getOrganization({baseUrl, organizationId})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getOrganization({baseUrl, organizationId})).rejects.toThrow(
-      'Failed to fetch organization details: Organization not found',
-    );
-  });
-
-  it('should handle network or parsing errors', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue(new Error('Network error'));
-
-    const baseUrl = 'https://localhost:8090';
-    const organizationId = 'org-1';
-
-    await expect(getOrganization({baseUrl, organizationId})).rejects.toThrow(ThunderIDAPIError);
-    await expect(getOrganization({baseUrl, organizationId})).rejects.toThrow('Network or parsing error: Network error');
-  });
-
-  it('should handle non-Error rejections', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue('unexpected failure');
-
-    const baseUrl = 'https://localhost:8090';
-    const organizationId = 'org-1';
-
-    await expect(getOrganization({baseUrl, organizationId})).rejects.toThrow('Network or parsing error: Unknown error');
-  });
-
-  it('should include custom headers when provided', async (): Promise<void> => {
-    const mockOrg: OrganizationDetails = {
-      id: 'org-003',
-      name: 'Header Org',
-      orgHandle: 'header-org',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const baseUrl = 'https://localhost:8090';
-    const organizationId = 'org-003';
-    const customHeaders: Record<string, string> = {
-      Authorization: 'Bearer token',
-      'X-Custom-Header': 'custom-value',
-    };
-
-    await getOrganization({
-      baseUrl,
-      headers: customHeaders,
-      organizationId,
-    });
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/organizations/${organizationId}`, {
-      headers: {
-        Accept: 'application/json',
-        Authorization: 'Bearer token',
-        'Content-Type': 'application/json',
-        'X-Custom-Header': 'custom-value',
-      },
-      method: 'GET',
-    });
-  });
-});
diff --git a/packages/javascript/src/api/__tests__/updateOrganization.test.ts b/packages/javascript/src/api/__tests__/updateOrganization.test.ts
deleted file mode 100644
index 025d1a6..0000000
--- a/packages/javascript/src/api/__tests__/updateOrganization.test.ts
+++ /dev/null
@@ -1,341 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {describe, it, expect, vi, beforeEach} from 'vitest';
-import ThunderIDAPIError from '../../errors/ThunderIDAPIError';
-import type {OrganizationDetails} from '../getOrganization';
-import updateOrganization, {createPatchOperations} from '../updateOrganization';
-
-interface PatchOp {
-  operation: 'REPLACE' | 'ADD' | 'REMOVE';
-  path: string;
-  value?: unknown;
-}
-
-describe('updateOrganization', (): void => {
-  const baseUrl = 'https://localhost:8090';
-  const organizationId = '0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1';
-
-  beforeEach((): void => {
-    vi.resetAllMocks();
-  });
-
-  it('should update organization successfully with default fetch', async (): Promise<void> => {
-    const mockOrg: OrganizationDetails = {
-      description: 'Updated',
-      id: organizationId,
-      name: 'Updated Name',
-      orgHandle: 'demo',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const operations: PatchOp[] = [
-      {operation: 'REPLACE' as const, path: '/name', value: 'Updated Name'},
-      {operation: 'REPLACE' as const, path: '/description', value: 'Updated'},
-    ];
-
-    const result: OrganizationDetails = await updateOrganization({
-      baseUrl,
-      operations,
-      organizationId,
-    });
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/organizations/${organizationId}`, {
-      body: JSON.stringify(operations),
-      headers: {
-        Accept: 'application/json',
-        'Content-Type': 'application/json',
-      },
-      method: 'PATCH',
-    });
-    expect(result).toEqual(mockOrg);
-  });
-
-  it('should use custom fetcher when provided', async (): Promise<void> => {
-    const mockOrg: OrganizationDetails = {
-      id: organizationId,
-      name: 'Custom',
-      orgHandle: 'custom',
-    };
-
-    const customFetcher: ReturnType<typeof vi.fn> = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const operations: PatchOp[] = [{operation: 'REPLACE' as const, path: '/name', value: 'Custom'}];
-
-    const result: OrganizationDetails = await updateOrganization({
-      baseUrl,
-      fetcher: customFetcher,
-      operations,
-      organizationId,
-    });
-
-    expect(result).toEqual(mockOrg);
-    expect(customFetcher).toHaveBeenCalledWith(
-      `${baseUrl}/api/server/v1/organizations/${organizationId}`,
-      expect.objectContaining({
-        body: JSON.stringify(operations),
-        headers: expect.objectContaining({
-          Accept: 'application/json',
-          'Content-Type': 'application/json',
-        }),
-        method: 'PATCH',
-      }),
-    );
-  });
-
-  it('should handle errors thrown directly by custom fetcher', async (): Promise<void> => {
-    const customFetcher: ReturnType<typeof vi.fn> = vi.fn().mockImplementation(() => {
-      throw new Error('Custom fetcher failure');
-    });
-
-    const operations: PatchOp[] = [{operation: 'REPLACE' as const, path: '/name', value: 'X'}];
-
-    await expect(updateOrganization({baseUrl, fetcher: customFetcher, operations, organizationId})).rejects.toThrow(
-      'Network or parsing error: Custom fetcher failure',
-    );
-  });
-
-  it('should throw ThunderIDAPIError for invalid base URL', async (): Promise<void> => {
-    const operations: PatchOp[] = [{operation: 'REPLACE' as const, path: '/name', value: 'X'}];
-
-    await expect(updateOrganization({baseUrl: 'invalid-url' as any, operations, organizationId})).rejects.toThrow(
-      ThunderIDAPIError,
-    );
-
-    await expect(updateOrganization({baseUrl: 'invalid-url' as any, operations, organizationId})).rejects.toThrow(
-      'Invalid base URL provided.',
-    );
-  });
-
-  it('should throw ThunderIDAPIError for undefined baseUrl', async (): Promise<void> => {
-    const operations: PatchOp[] = [{operation: 'REPLACE' as const, path: '/name', value: 'X'}];
-
-    await expect(updateOrganization({baseUrl: undefined as any, operations, organizationId})).rejects.toThrow(
-      ThunderIDAPIError,
-    );
-    await expect(updateOrganization({baseUrl: undefined as any, operations, organizationId})).rejects.toThrow(
-      'Invalid base URL provided.',
-    );
-  });
-
-  it('should throw ThunderIDAPIError for empty string baseUrl', async (): Promise<void> => {
-    const operations: PatchOp[] = [{operation: 'REPLACE' as const, path: '/name', value: 'X'}];
-
-    await expect(updateOrganization({baseUrl: '', operations, organizationId})).rejects.toThrow(ThunderIDAPIError);
-    await expect(updateOrganization({baseUrl: '', operations, organizationId})).rejects.toThrow(
-      'Invalid base URL provided.',
-    );
-  });
-
-  it('should throw ThunderIDAPIError when organizationId is missing', async (): Promise<void> => {
-    const operations: PatchOp[] = [{operation: 'REPLACE' as const, path: '/name', value: 'X'}];
-
-    await expect(updateOrganization({baseUrl, operations, organizationId: '' as any})).rejects.toThrow(
-      ThunderIDAPIError,
-    );
-    await expect(updateOrganization({baseUrl, operations, organizationId: '' as any})).rejects.toThrow(
-      'Organization ID is required',
-    );
-  });
-
-  it('should throw ThunderIDAPIError when operations is missing/empty', async (): Promise<void> => {
-    await expect(updateOrganization({baseUrl, operations: undefined as any, organizationId})).rejects.toThrow(
-      'Operations array is required and cannot be empty',
-    );
-
-    await expect(updateOrganization({baseUrl, operations: [], organizationId})).rejects.toThrow(
-      'Operations array is required and cannot be empty',
-    );
-
-    await expect(updateOrganization({baseUrl, operations: 'not-array' as any, organizationId})).rejects.toThrow(
-      'Operations array is required and cannot be empty',
-    );
-  });
-
-  it('should handle HTTP error responses', async (): Promise<void> => {
-    global.fetch = vi.fn().mockResolvedValue({
-      ok: false,
-      status: 400,
-      statusText: 'Bad Request',
-      text: () => Promise.resolve('Invalid operations'),
-    });
-
-    const operations: PatchOp[] = [{operation: 'REPLACE' as const, path: '/name', value: 'X'}];
-
-    await expect(updateOrganization({baseUrl, operations, organizationId})).rejects.toThrow(ThunderIDAPIError);
-    await expect(updateOrganization({baseUrl, operations, organizationId})).rejects.toThrow(
-      'Failed to update organization: Invalid operations',
-    );
-  });
-
-  it('should handle network or parsing errors', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue(new Error('Network error'));
-
-    const operations: PatchOp[] = [{operation: 'REPLACE' as const, path: '/name', value: 'X'}];
-
-    await expect(updateOrganization({baseUrl, operations, organizationId})).rejects.toThrow(ThunderIDAPIError);
-    await expect(updateOrganization({baseUrl, operations, organizationId})).rejects.toThrow(
-      'Network or parsing error: Network error',
-    );
-  });
-
-  it('should handle non-Error rejections', async (): Promise<void> => {
-    global.fetch = vi.fn().mockRejectedValue('unexpected failure');
-
-    const operations: PatchOp[] = [{operation: 'REPLACE' as const, path: '/name', value: 'X'}];
-
-    await expect(updateOrganization({baseUrl, operations, organizationId})).rejects.toThrow(
-      'Network or parsing error: Unknown error',
-    );
-  });
-
-  it('should include custom headers when provided', async (): Promise<void> => {
-    const mockOrg: OrganizationDetails = {
-      id: organizationId,
-      name: 'Header Org',
-      orgHandle: 'header-org',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const operations: PatchOp[] = [{operation: 'REPLACE' as const, path: '/name', value: 'Header Org'}];
-
-    const customHeaders: Record<string, string> = {
-      Authorization: 'Bearer token',
-      'X-Custom-Header': 'custom-value',
-    };
-
-    await updateOrganization({
-      baseUrl,
-      headers: customHeaders,
-      operations,
-      organizationId,
-    });
-
-    expect(fetch).toHaveBeenCalledWith(`${baseUrl}/api/server/v1/organizations/${organizationId}`, {
-      body: JSON.stringify(operations),
-      headers: {
-        Accept: 'application/json',
-        Authorization: 'Bearer token',
-        'Content-Type': 'application/json',
-        'X-Custom-Header': 'custom-value',
-      },
-      method: 'PATCH',
-    });
-  });
-
-  it('should always use HTTP PATCH even if a different method is passed in requestConfig', async (): Promise<void> => {
-    const mockOrg: OrganizationDetails = {
-      id: organizationId,
-      name: 'A',
-      orgHandle: 'a',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const operations: PatchOp[] = [{operation: 'REPLACE' as const, path: '/name', value: 'A'}];
-
-    await updateOrganization({
-      baseUrl,
-      method: 'PUT',
-      operations,
-      organizationId,
-    });
-
-    expect(fetch).toHaveBeenCalledWith(
-      `${baseUrl}/api/server/v1/organizations/${organizationId}`,
-      expect.objectContaining({method: 'PATCH'}),
-    );
-  });
-
-  it('should send the exact operations array as body (no mutation)', async (): Promise<void> => {
-    const mockOrg: OrganizationDetails = {
-      id: organizationId,
-      name: 'B',
-      orgHandle: 'b',
-    };
-
-    global.fetch = vi.fn().mockResolvedValue({
-      json: () => Promise.resolve(mockOrg),
-      ok: true,
-    });
-
-    const operations: PatchOp[] = [
-      {operation: 'REPLACE' as const, path: 'name', value: 'B'},
-      {operation: 'REMOVE' as const, path: 'description'},
-    ];
-
-    await updateOrganization({baseUrl, operations, organizationId});
-
-    const [, init] = (fetch as any).mock.calls[0];
-    expect(JSON.parse(init.body)).toEqual(operations);
-  });
-});
-
-describe('createPatchOperations', (): void => {
-  it('should generate REPLACE for non-empty values and REMOVE for empty', (): void => {
-    const payload: Record<string, unknown> = {
-      description: '',
-      extra: 'value',
-      name: 'Updated Organization',
-      note: null,
-    };
-
-    const ops: PatchOp[] = createPatchOperations(payload);
-
-    expect(ops).toEqual(
-      expect.arrayContaining([
-        {operation: 'REPLACE', path: '/name', value: 'Updated Organization'},
-        {operation: 'REPLACE', path: '/extra', value: 'value'},
-        {operation: 'REMOVE', path: '/description'},
-        {operation: 'REMOVE', path: '/note'},
-      ]),
-    );
-  });
-
-  it('should prefix all paths with a slash', (): void => {
-    const ops: PatchOp[] = createPatchOperations({
-      summary: '',
-      title: 'A',
-    });
-
-    expect(ops.find((o: PatchOp) => o.path === '/title')).toBeDefined();
-    expect(ops.find((o: PatchOp) => o.path === '/summary')).toBeDefined();
-  });
-
-  it('should handle undefined payload values as REMOVE', (): void => {
-    const ops: PatchOp[] = createPatchOperations({
-      something: undefined,
-    });
-
-    expect(ops).toEqual([{operation: 'REMOVE', path: '/something'}]);
-  });
-});
diff --git a/packages/javascript/src/api/createOrganization.ts b/packages/javascript/src/api/createOrganization.ts
deleted file mode 100644
index 7c438de..0000000
--- a/packages/javascript/src/api/createOrganization.ts
+++ /dev/null
@@ -1,214 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import ThunderIDAPIError from '../errors/ThunderIDAPIError';
-import {Organization} from '../models/organization';
-
-/**
- * Interface for organization creation payload.
- */
-export interface CreateOrganizationPayload {
-  /**
-   * Organization description.
-   */
-  description: string;
-  /**
-   * Organization name.
-   */
-  name: string;
-  /**
-   * Organization handle/slug.
-   */
-  orgHandle?: string;
-  /**
-   * Parent organization ID.
-   */
-  parentId: string;
-  /**
-   * Organization type.
-   */
-  type: 'TENANT';
-}
-
-/**
- * Configuration for the createOrganization request
- */
-export interface CreateOrganizationConfig extends Omit<RequestInit, 'method' | 'body'> {
-  /**
-   * The base URL for the API endpoint.
-   */
-  baseUrl: string;
-  /**
-   * Optional custom fetcher function.
-   * If not provided, native fetch will be used
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * Organization creation payload
-   */
-  payload: CreateOrganizationPayload;
-}
-
-/**
- * Creates a new organization.
- *
- * @param config - Configuration object containing baseUrl, payload and optional request config.
- * @returns A promise that resolves with the created organization information.
- * @example
- * ```typescript
- * // Using default fetch
- * try {
- *   const organization = await createOrganization({
- *     baseUrl: "https://localhost:8090",
- *     payload: {
- *       description: "Share your screens",
- *       name: "Team Viewer",
- *       orgHandle: "team-viewer",
- *       parentId: "f4825104-4948-40d9-ab65-a960eee3e3d5",
- *       type: "TENANT"
- *     }
- *   });
- *   console.log(organization);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to create organization:', error.message);
- *   }
- * }
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher (e.g., axios-based httpClient)
- * try {
- *   const organization = await createOrganization({
- *     baseUrl: "https://localhost:8090",
- *     payload: {
- *       description: "Share your screens",
- *       name: "Team Viewer",
- *       orgHandle: "team-viewer",
- *       parentId: "f4825104-4948-40d9-ab65-a960eee3e3d5",
- *       type: "TENANT"
- *     },
- *     fetcher: async (url, config) => {
- *       const response = await httpClient({
- *         url,
- *         method: config.method,
- *         headers: config.headers,
- *         data: config.body,
- *         ...config
- *       });
- *       // Convert axios-like response to fetch-like Response
- *       return {
- *         ok: response.status >= 200 && response.status < 300,
- *         status: response.status,
- *         statusText: response.statusText,
- *         json: () => Promise.resolve(response.data),
- *         text: () => Promise.resolve(typeof response.data === 'string' ? response.data : JSON.stringify(response.data))
- *       } as Response;
- *     }
- *   });
- *   console.log(organization);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to create organization:', error.message);
- *   }
- * }
- * ```
- */
-const createOrganization = async ({
-  baseUrl,
-  payload,
-  fetcher,
-  ...requestConfig
-}: CreateOrganizationConfig): Promise<Organization> => {
-  try {
-    // eslint-disable-next-line no-new
-    new URL(baseUrl);
-  } catch (error) {
-    throw new ThunderIDAPIError(
-      `Invalid base URL provided. ${error?.toString()}`,
-      'createOrganization-ValidationError-001',
-      'javascript',
-      400,
-      'The provided `baseUrl` does not adhere to the URL schema.',
-    );
-  }
-
-  if (!payload) {
-    throw new ThunderIDAPIError(
-      'Organization payload is required',
-      'createOrganization-ValidationError-002',
-      'javascript',
-      400,
-      'Invalid Request',
-    );
-  }
-
-  // Always set type to TENANT for now
-  const organizationPayload: CreateOrganizationPayload = {
-    ...payload,
-    type: 'TENANT' as const,
-  };
-
-  const fetchFn: typeof fetch = fetcher || fetch;
-  const resolvedUrl = `${baseUrl}/api/server/v1/organizations`;
-
-  const requestInit: RequestInit = {
-    ...requestConfig,
-    body: JSON.stringify(organizationPayload),
-    headers: {
-      Accept: 'application/json',
-      'Content-Type': 'application/json',
-      ...requestConfig.headers,
-    },
-    method: 'POST',
-  };
-
-  try {
-    const response: Response = await fetchFn(resolvedUrl, requestInit);
-
-    if (!response?.ok) {
-      const errorText: string = await response.text();
-
-      throw new ThunderIDAPIError(
-        errorText,
-        'createOrganization-ResponseError-001',
-        'javascript',
-        response.status,
-        response.statusText,
-        'Failed to create organization',
-      );
-    }
-
-    return (await response.json()) as Organization;
-  } catch (error) {
-    if (error instanceof ThunderIDAPIError) {
-      throw error;
-    }
-
-    throw new ThunderIDAPIError(
-      `Network or parsing error: ${error instanceof Error ? error.message : 'Unknown error'}`,
-      'createOrganization-NetworkError-001',
-      'javascript',
-      0,
-      'Network Error',
-    );
-  }
-};
-
-export default createOrganization;
diff --git a/packages/javascript/src/api/getAllOrganizations.ts b/packages/javascript/src/api/getAllOrganizations.ts
deleted file mode 100644
index 3af34f6..0000000
--- a/packages/javascript/src/api/getAllOrganizations.ts
+++ /dev/null
@@ -1,189 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import ThunderIDAPIError from '../errors/ThunderIDAPIError';
-import {AllOrganizationsApiResponse} from '../models/organization';
-
-/**
- * Configuration for the getAllOrganizations request
- */
-export interface GetAllOrganizationsConfig extends Omit<RequestInit, 'method'> {
-  /**
-   * The base URL for the API endpoint.
-   */
-  baseUrl: string;
-  /**
-   * Optional custom fetcher function.
-   * If not provided, native fetch will be used
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * Filter expression for organizations
-   */
-  filter?: string;
-  /**
-   * Maximum number of organizations to return
-   */
-  limit?: number;
-  /**
-   * Whether to include child organizations recursively
-   */
-  recursive?: boolean;
-}
-
-/**
- * Retrieves all organizations with pagination support.
- *
- * @param config - Configuration object containing baseUrl, optional query parameters, and request config.
- * @returns A promise that resolves with the paginated organizations information.
- * @example
- * ```typescript
- * // Using default fetch
- * try {
- *   const response = await getAllOrganizations({
- *     baseUrl: "https://localhost:8090",
- *     filter: "",
- *     limit: 10,
- *     recursive: false
- *   });
- *   console.log(response.organizations);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organizations:', error.message);
- *   }
- * }
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher (e.g., axios-based httpClient)
- * try {
- *   const response = await getAllOrganizations({
- *     baseUrl: "https://localhost:8090",
- *     filter: "",
- *     limit: 10,
- *     recursive: false,
- *     fetcher: async (url, config) => {
- *       const response = await httpClient({
- *         url,
- *         method: config.method,
- *         headers: config.headers,
- *         ...config
- *       });
- *       // Convert axios-like response to fetch-like Response
- *       return {
- *         ok: response.status >= 200 && response.status < 300,
- *         status: response.status,
- *         statusText: response.statusText,
- *         json: () => Promise.resolve(response.data),
- *         text: () => Promise.resolve(typeof response.data === 'string' ? response.data : JSON.stringify(response.data))
- *       } as Response;
- *     }
- *   });
- *   console.log(response.organizations);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organizations:', error.message);
- *   }
- * }
- * ```
- */
-const getAllOrganizations = async ({
-  baseUrl,
-  filter = '',
-  limit = 10,
-  recursive = false,
-  fetcher,
-  ...requestConfig
-}: GetAllOrganizationsConfig): Promise<AllOrganizationsApiResponse> => {
-  try {
-    // eslint-disable-next-line no-new
-    new URL(baseUrl);
-  } catch (error) {
-    throw new ThunderIDAPIError(
-      `Invalid base URL provided. ${error?.toString()}`,
-      'getAllOrganizations-ValidationError-001',
-      'javascript',
-      400,
-      'The provided `baseUrl` does not adhere to the URL schema.',
-    );
-  }
-
-  const queryParams: URLSearchParams = new URLSearchParams(
-    Object.fromEntries(
-      Object.entries({
-        filter,
-        limit: limit.toString(),
-        recursive: recursive.toString(),
-      }).filter(([, value]: [string, string]) => Boolean(value)),
-    ),
-  );
-
-  const fetchFn: typeof fetch = fetcher || fetch;
-  const resolvedUrl = `${baseUrl}/api/server/v1/organizations?${queryParams.toString()}`;
-
-  const requestInit: RequestInit = {
-    ...requestConfig,
-    headers: {
-      ...requestConfig.headers,
-      Accept: 'application/json',
-      'Content-Type': 'application/json',
-    },
-    method: 'GET',
-  };
-
-  try {
-    const response: Response = await fetchFn(resolvedUrl, requestInit);
-
-    if (!response?.ok) {
-      const errorText: string = await response.text();
-
-      throw new ThunderIDAPIError(
-        errorText,
-        'getAllOrganizations-ResponseError-001',
-        'javascript',
-        response.status,
-        response.statusText,
-        'Failed to get organizations',
-      );
-    }
-
-    const data: AllOrganizationsApiResponse = await response.json();
-
-    return {
-      hasMore: data.hasMore,
-      nextCursor: data.nextCursor,
-      organizations: data.organizations || [],
-      totalCount: data.totalCount,
-    };
-  } catch (error) {
-    if (error instanceof ThunderIDAPIError) {
-      throw error;
-    }
-
-    throw new ThunderIDAPIError(
-      `Network or parsing error: ${error instanceof Error ? error.message : 'Unknown error'}`,
-      'getAllOrganizations-NetworkError-001',
-      'javascript',
-      0,
-      'Network Error',
-    );
-  }
-};
-
-export default getAllOrganizations;
diff --git a/packages/javascript/src/api/getMeOrganizations.ts b/packages/javascript/src/api/getMeOrganizations.ts
deleted file mode 100644
index be7e08a..0000000
--- a/packages/javascript/src/api/getMeOrganizations.ts
+++ /dev/null
@@ -1,205 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import ThunderIDAPIError from '../errors/ThunderIDAPIError';
-import {Organization} from '../models/organization';
-
-/**
- * Configuration for the getMeOrganizations request
- */
-export interface GetMeOrganizationsConfig extends Omit<RequestInit, 'method'> {
-  /**
-   * Base64 encoded cursor value for forward pagination
-   */
-  after?: string;
-  /**
-   * Authorized application name filter
-   */
-  authorizedAppName?: string;
-  /**
-   * The base URL for the API endpoint.
-   */
-  baseUrl: string;
-  /**
-   * Base64 encoded cursor value for backward pagination
-   */
-  before?: string;
-  /**
-   * Optional custom fetcher function.
-   * If not provided, native fetch will be used
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * Filter expression for organizations
-   */
-  filter?: string;
-  /**
-   * Maximum number of organizations to return
-   */
-  limit?: number;
-  /**
-   * Whether to include child organizations recursively
-   */
-  recursive?: boolean;
-}
-
-/**
- * Retrieves the organizations associated with the current user.
- *
- * @param config - Configuration object containing baseUrl, optional query parameters, and request config.
- * @returns A promise that resolves with the organizations information.
- * @example
- * ```typescript
- * // Using default fetch
- * try {
- *   const organizations = await getMeOrganizations({
- *     baseUrl: "https://localhost:8090",
- *     after: "",
- *     before: "",
- *     filter: "",
- *     limit: 10,
- *     recursive: false
- *   });
- *   console.log(organizations);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organizations:', error.message);
- *   }
- * }
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher (e.g., axios-based httpClient)
- * try {
- *   const organizations = await getMeOrganizations({
- *     baseUrl: "https://localhost:8090",
- *     after: "",
- *     before: "",
- *     filter: "",
- *     limit: 10,
- *     recursive: false,
- *     fetcher: async (url, config) => {
- *       const response = await httpClient({
- *         url,
- *         method: config.method,
- *         headers: config.headers,
- *         ...config
- *       });
- *       // Convert axios-like response to fetch-like Response
- *       return {
- *         ok: response.status >= 200 && response.status < 300,
- *         status: response.status,
- *         statusText: response.statusText,
- *         json: () => Promise.resolve(response.data),
- *         text: () => Promise.resolve(typeof response.data === 'string' ? response.data : JSON.stringify(response.data))
- *       } as Response;
- *     }
- *   });
- *   console.log(organizations);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organizations:', error.message);
- *   }
- * }
- * ```
- */
-const getMeOrganizations = async ({
-  baseUrl,
-  after = '',
-  authorizedAppName = '',
-  before = '',
-  filter = '',
-  limit = 10,
-  recursive = false,
-  fetcher,
-  ...requestConfig
-}: GetMeOrganizationsConfig): Promise<Organization[]> => {
-  try {
-    // eslint-disable-next-line no-new
-    new URL(baseUrl);
-  } catch (error) {
-    throw new ThunderIDAPIError(
-      `Invalid base URL provided. ${error?.toString()}`,
-      'getMeOrganizations-ValidationError-001',
-      'javascript',
-      400,
-      'The provided `baseUrl` does not adhere to the URL schema.',
-    );
-  }
-
-  const queryParams: URLSearchParams = new URLSearchParams(
-    Object.fromEntries(
-      Object.entries({
-        after,
-        authorizedAppName,
-        before,
-        filter,
-        limit: limit.toString(),
-        recursive: recursive.toString(),
-      }).filter(([, value]: [string, string]) => Boolean(value)),
-    ),
-  );
-
-  const fetchFn: typeof fetch = fetcher || fetch;
-  const resolvedUrl = `${baseUrl}/api/users/v1/me/organizations?${queryParams.toString()}`;
-
-  const requestInit: RequestInit = {
-    ...requestConfig,
-    headers: {
-      Accept: 'application/json',
-      'Content-Type': 'application/json',
-      ...requestConfig.headers,
-    },
-    method: 'GET',
-  };
-
-  try {
-    const response: Response = await fetchFn(resolvedUrl, requestInit);
-
-    if (!response?.ok) {
-      const errorText: string = await response.text();
-
-      throw new ThunderIDAPIError(
-        errorText,
-        'getMeOrganizations-ResponseError-001',
-        'javascript',
-        response.status,
-        response.statusText,
-        'Failed to fetch associated organizations of the user',
-      );
-    }
-
-    const data: Record<string, unknown> = await response.json();
-    return (data['organizations'] as Organization[]) || [];
-  } catch (error) {
-    if (error instanceof ThunderIDAPIError) {
-      throw error;
-    }
-
-    throw new ThunderIDAPIError(
-      `Network or parsing error: ${error instanceof Error ? error.message : 'Unknown error'}`,
-      'getMeOrganizations-NetworkError-001',
-      'javascript',
-      0,
-      'Network Error',
-    );
-  }
-};
-
-export default getMeOrganizations;
diff --git a/packages/javascript/src/api/getOrganization.ts b/packages/javascript/src/api/getOrganization.ts
deleted file mode 100644
index 7b246b3..0000000
--- a/packages/javascript/src/api/getOrganization.ts
+++ /dev/null
@@ -1,187 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import ThunderIDAPIError from '../errors/ThunderIDAPIError';
-
-/**
- * Extended organization interface with additional properties
- */
-export interface OrganizationDetails {
-  attributes?: Record<string, any>;
-  created?: string;
-  description?: string;
-  id: string;
-  lastModified?: string;
-  name: string;
-  orgHandle: string;
-  parent?: {
-    id: string;
-    ref: string;
-  };
-  permissions?: string[];
-  status?: string;
-  type?: string;
-}
-
-/**
- * Configuration for the getOrganization request
- */
-export interface GetOrganizationConfig extends Omit<RequestInit, 'method'> {
-  /**
-   * The base URL for the API endpoint.
-   */
-  baseUrl: string;
-  /**
-   * Optional custom fetcher function.
-   * If not provided, native fetch will be used
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * The ID of the organization to retrieve
-   */
-  organizationId: string;
-}
-
-/**
- * Retrieves detailed information for a specific organization.
- *
- * @param config - Configuration object containing baseUrl, organizationId, and request config.
- * @returns A promise that resolves with the organization details.
- * @example
- * ```typescript
- * // Using default fetch
- * try {
- *   const organization = await getOrganization({
- *     baseUrl: "https://localhost:8090",
- *     organizationId: "0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
- *   });
- *   console.log(organization);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organization:', error.message);
- *   }
- * }
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher (e.g., axios-based httpClient)
- * try {
- *   const organization = await getOrganization({
- *     baseUrl: "https://localhost:8090",
- *     organizationId: "0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1",
- *     fetcher: async (url, config) => {
- *       const response = await httpClient({
- *         url,
- *         method: config.method,
- *         headers: config.headers,
- *         ...config
- *       });
- *       // Convert axios-like response to fetch-like Response
- *       return {
- *         ok: response.status >= 200 && response.status < 300,
- *         status: response.status,
- *         statusText: response.statusText,
- *         json: () => Promise.resolve(response.data),
- *         text: () => Promise.resolve(typeof response.data === 'string' ? response.data : JSON.stringify(response.data))
- *       } as Response;
- *     }
- *   });
- *   console.log(organization);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organization:', error.message);
- *   }
- * }
- * ```
- */
-const getOrganization = async ({
-  baseUrl,
-  organizationId,
-  fetcher,
-  ...requestConfig
-}: GetOrganizationConfig): Promise<OrganizationDetails> => {
-  try {
-    // eslint-disable-next-line no-new
-    new URL(baseUrl);
-  } catch (error) {
-    throw new ThunderIDAPIError(
-      `Invalid base URL provided. ${error?.toString()}`,
-      'getOrganization-ValidationError-001',
-      'javascript',
-      400,
-      'The provided `baseUrl` does not adhere to the URL schema.',
-    );
-  }
-
-  if (!organizationId) {
-    throw new ThunderIDAPIError(
-      'Organization ID is required',
-      'getOrganization-ValidationError-002',
-      'javascript',
-      400,
-      'Invalid Request',
-    );
-  }
-
-  const fetchFn: typeof fetch = fetcher || fetch;
-  const resolvedUrl = `${baseUrl}/api/server/v1/organizations/${organizationId}`;
-
-  const requestInit: RequestInit = {
-    ...requestConfig,
-    headers: {
-      Accept: 'application/json',
-      'Content-Type': 'application/json',
-      ...requestConfig.headers,
-    },
-    method: 'GET',
-  };
-
-  try {
-    const response: Response = await fetchFn(resolvedUrl, requestInit);
-
-    if (!response?.ok) {
-      const errorText: string = await response.text();
-
-      throw new ThunderIDAPIError(
-        errorText,
-        'getOrganization-ResponseError-001',
-        'javascript',
-        response.status,
-        response.statusText,
-        'Failed to fetch organization details',
-      );
-    }
-
-    return (await response.json()) as OrganizationDetails;
-  } catch (error) {
-    if (error instanceof ThunderIDAPIError) {
-      throw error;
-    }
-
-    throw new ThunderIDAPIError(
-      `Network or parsing error: ${error instanceof Error ? error.message : 'Unknown error'}`,
-      'getOrganization-NetworkError-001',
-      'javascript',
-      0,
-      'Network Error',
-    );
-  }
-};
-
-export default getOrganization;
diff --git a/packages/javascript/src/api/getOrganizationUnitChildren.ts b/packages/javascript/src/api/getOrganizationUnitChildren.ts
index 0d8f22e..2e0d4c2 100644
--- a/packages/javascript/src/api/getOrganizationUnitChildren.ts
+++ b/packages/javascript/src/api/getOrganizationUnitChildren.ts
@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2026, WSO2 LLC. (https://www.wso2.com).
+ * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
  *
  * WSO2 LLC. licenses this file to you under the Apache License,
  * Version 2.0 (the "License"); you may not use this file except
@@ -17,80 +17,149 @@
  */
 
 import ThunderIDAPIError from '../errors/ThunderIDAPIError';
-import {GetOrganizationUnitChildrenConfig, OrganizationUnitListResponse} from '../models/organization-unit';
 
 /**
- * Retrieves the child organization units of a given parent OU.
- *
- * @param config - Request configuration including `baseUrl`/`url`, `organizationUnitId`,
- *                 and optional `limit`/`offset` pagination parameters.
- * @returns A promise that resolves with the paginated list of child organization units.
- *
- * @throws {ThunderIDAPIError} When the server returns a non-OK response.
- *
- * @example
- * ```typescript
- * const children = await getOrganizationUnitChildren({
- *   baseUrl: 'https://localhost:8090',
- *   organizationUnitId: '0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1',
- *   limit: 10,
- *   offset: 0,
- * });
- * console.log(children.organizationUnits);
- * ```
+ * Represents a single organization unit entry.
+ */
+export interface OrganizationUnit {
+  /** Optional description of the organization unit. */
+  description?: string;
+  /** Unique identifier of the organization unit. */
+  id: string;
+  /** Human-readable name of the organization unit. */
+  name: string;
+  /** Identifier of the parent organization unit, if any. */
+  parentId?: string;
+  /** Status of the organization unit (e.g. ACTIVE). */
+  status?: string;
+}
+
+/**
+ * Response shape for the organization unit children list endpoint.
+ */
+export interface OrganizationUnitListResponse {
+  /** Number of items returned in this page. */
+  count?: number;
+  /** List of child organization units. */
+  organizationUnits: OrganizationUnit[];
+  /** Pagination start index (1-based). */
+  startIndex?: number;
+  /** Total number of matching organization units. */
+  totalResults?: number;
+}
+
+/**
+ * Configuration for the getOrganizationUnitChildren request.
+ */
+export interface GetOrganizationUnitChildrenConfig extends Omit<RequestInit, 'method'> {
+  /**
+   * The base URL of the ThunderID server.
+   * Used to derive the endpoint when `url` is not provided.
+   */
+  baseUrl?: string;
+  /**
+   * Optional custom fetcher function.
+   * If not provided, native fetch will be used.
+   */
+  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
+  /**
+   * Maximum number of results to return.
+   */
+  limit?: number;
+  /**
+   * Zero-based offset for pagination.
+   */
+  offset?: number;
+  /**
+   * The identifier of the parent organization unit whose children to list.
+   */
+  organizationUnitId: string;
+  /**
+   * The absolute API endpoint URL.
+   * When provided, `baseUrl` and `organizationUnitId` are not used for URL construction.
+   */
+  url?: string;
+}
+
+/**
+ * Retrieves the child organization units of a given organization unit.
  *
- * @experimental This function targets the ThunderID V2 platform API
+ * @param config - Request configuration object.
+ * @returns A promise that resolves with the list of child organization units.
  */
 const getOrganizationUnitChildren = async ({
   url,
   baseUrl,
   organizationUnitId,
-  limit = 10,
-  offset = 0,
+  limit,
+  offset,
+  fetcher,
   ...requestConfig
 }: GetOrganizationUnitChildrenConfig): Promise<OrganizationUnitListResponse> => {
-  if (!organizationUnitId) {
+  try {
+    // eslint-disable-next-line no-new
+    new URL((url ?? baseUrl)!);
+  } catch (error) {
     throw new ThunderIDAPIError(
-      'Organization Unit ID is required',
+      `Invalid URL provided. ${error?.toString()}`,
       'getOrganizationUnitChildren-ValidationError-001',
       'javascript',
       400,
-      'If an organization unit ID is not provided, the request cannot be constructed correctly.',
+      'The provided `url` or `baseUrl` path does not adhere to the URL schema.',
     );
   }
 
-  const queryParams: URLSearchParams = new URLSearchParams({
-    limit: String(limit),
-    offset: String(offset),
-  });
+  const fetchFn: typeof fetch = fetcher || fetch;
 
-  const endpoint: string = url ?? `${baseUrl}/organization-units/${organizationUnitId}/ous?${queryParams.toString()}`;
+  const queryParams = new URLSearchParams();
+  if (limit !== undefined) queryParams.set('limit', String(limit));
+  if (offset !== undefined) queryParams.set('offset', String(offset));
+  const query = queryParams.toString();
 
-  const response: Response = await fetch(endpoint, {
+  const resolvedBase =
+    url ?? `${baseUrl}/api/server/v1/organization-units/${organizationUnitId}/children`;
+  const resolvedUrl = query ? `${resolvedBase}?${query}` : resolvedBase;
+
+  const requestInit: RequestInit = {
     ...requestConfig,
     headers: {
       Accept: 'application/json',
+      'Content-Type': 'application/json',
       ...requestConfig.headers,
     },
     method: 'GET',
-  });
+  };
+
+  try {
+    const response: Response = await fetchFn(resolvedUrl, requestInit);
 
-  if (!response.ok) {
-    const errorText: string = await response.text();
+    if (!response?.ok) {
+      const errorText: string = await response.text();
+
+      throw new ThunderIDAPIError(
+        errorText,
+        'getOrganizationUnitChildren-ResponseError-001',
+        'javascript',
+        response.status,
+        response.statusText,
+        'Failed to fetch organization unit children',
+      );
+    }
+
+    return (await response.json()) as OrganizationUnitListResponse;
+  } catch (error) {
+    if (error instanceof ThunderIDAPIError) {
+      throw error;
+    }
 
     throw new ThunderIDAPIError(
-      errorText,
-      'getOrganizationUnitChildren-ResponseError-001',
+      `Network or parsing error: ${error instanceof Error ? error.message : 'Unknown error'}`,
+      'getOrganizationUnitChildren-NetworkError-001',
       'javascript',
-      response.status,
-      response.statusText,
-      'Failed to fetch organization unit children',
+      0,
+      'Network Error',
     );
   }
-
-  const listResponse: OrganizationUnitListResponse = await response.json();
-
-  return listResponse;
 };
 
 export default getOrganizationUnitChildren;
diff --git a/packages/javascript/src/api/updateOrganization.ts b/packages/javascript/src/api/updateOrganization.ts
deleted file mode 100644
index ddeffd9..0000000
--- a/packages/javascript/src/api/updateOrganization.ts
+++ /dev/null
@@ -1,225 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {OrganizationDetails} from './getOrganization';
-import ThunderIDAPIError from '../errors/ThunderIDAPIError';
-import isEmpty from '../utils/isEmpty';
-
-/**
- * Configuration for the updateOrganization request
- */
-export interface UpdateOrganizationConfig extends Omit<RequestInit, 'method' | 'body'> {
-  /**
-   * The base URL for the API endpoint.
-   */
-  baseUrl: string;
-  /**
-   * Optional custom fetcher function.
-   * If not provided, native fetch will be used
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * Array of patch operations to apply
-   */
-  operations: {
-    operation: 'REPLACE' | 'ADD' | 'REMOVE';
-    path: string;
-    value?: any;
-  }[];
-  /**
-   * The ID of the organization to update
-   */
-  organizationId: string;
-}
-
-/**
- * Updates the organization information using the Organizations Management API.
- *
- * @param config - Configuration object with baseUrl, organizationId, operations and optional request config.
- * @returns A promise that resolves with the updated organization information.
- * @example
- * ```typescript
- * // Using the helper function to create operations automatically
- * const operations = createPatchOperations({
- *   name: "Updated Organization Name",      // Will use REPLACE
- *   description: "",                        // Will use REMOVE (empty string)
- *   customField: "Some value"              // Will use REPLACE
- * });
- *
- * await updateOrganization({
- *   baseUrl: "https://localhost:8090",
- *   organizationId: "0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1",
- *   operations
- * });
- *
- * // Or manually specify operations
- * await updateOrganization({
- *   baseUrl: "https://localhost:8090",
- *   organizationId: "0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1",
- *   operations: [
- *     { operation: "REPLACE", path: "/name", value: "Updated Organization Name" },
- *     { operation: "REMOVE", path: "/description" }
- *   ]
- * });
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher (e.g., axios-based httpClient)
- * await updateOrganization({
- *   baseUrl: "https://localhost:8090",
- *   organizationId: "0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1",
- *   operations: [
- *     { operation: "REPLACE", path: "/name", value: "Updated Organization Name" }
- *   ],
- *   fetcher: async (url, config) => {
- *     const response = await httpClient({
- *       url,
- *       method: config.method,
- *       headers: config.headers,
- *       data: config.body,
- *       ...config
- *     });
- *     // Convert axios-like response to fetch-like Response
- *     return {
- *       ok: response.status >= 200 && response.status < 300,
- *       status: response.status,
- *       statusText: response.statusText,
- *       json: () => Promise.resolve(response.data),
- *       text: () => Promise.resolve(typeof response.data === 'string' ? response.data : JSON.stringify(response.data))
- *     } as Response;
- *   }
- * });
- * ```
- */
-const updateOrganization = async ({
-  baseUrl,
-  organizationId,
-  operations,
-  fetcher,
-  ...requestConfig
-}: UpdateOrganizationConfig): Promise<OrganizationDetails> => {
-  try {
-    // eslint-disable-next-line no-new
-    new URL(baseUrl);
-  } catch (error) {
-    throw new ThunderIDAPIError(
-      `Invalid base URL provided. ${error?.toString()}`,
-      'updateOrganization-ValidationError-001',
-      'javascript',
-      400,
-      'The provided `baseUrl` does not adhere to the URL schema.',
-    );
-  }
-
-  if (!organizationId) {
-    throw new ThunderIDAPIError(
-      'Organization ID is required',
-      'updateOrganization-ValidationError-002',
-      'javascript',
-      400,
-      'Invalid Request',
-    );
-  }
-
-  if (!operations || !Array.isArray(operations) || operations.length === 0) {
-    throw new ThunderIDAPIError(
-      'Operations array is required and cannot be empty',
-      'updateOrganization-ValidationError-003',
-      'javascript',
-      400,
-      'Invalid Request',
-    );
-  }
-
-  const fetchFn: typeof fetch = fetcher || fetch;
-  const resolvedUrl = `${baseUrl}/api/server/v1/organizations/${organizationId}`;
-
-  const requestInit: RequestInit = {
-    ...requestConfig,
-    body: JSON.stringify(operations),
-    headers: {
-      Accept: 'application/json',
-      'Content-Type': 'application/json',
-      ...requestConfig.headers,
-    },
-    method: 'PATCH',
-  };
-
-  try {
-    const response: Response = await fetchFn(resolvedUrl, requestInit);
-
-    if (!response?.ok) {
-      const errorText: string = await response.text();
-
-      throw new ThunderIDAPIError(
-        errorText,
-        'updateOrganization-ResponseError-001',
-        'javascript',
-        response.status,
-        response.statusText,
-        'Failed to update organization',
-      );
-    }
-
-    return (await response.json()) as OrganizationDetails;
-  } catch (error) {
-    if (error instanceof ThunderIDAPIError) {
-      throw error;
-    }
-
-    throw new ThunderIDAPIError(
-      `Network or parsing error: ${error instanceof Error ? error.message : 'Unknown error'}`,
-      'updateOrganization-NetworkError-001',
-      'javascript',
-      0,
-      'Network Error',
-    );
-  }
-};
-
-/**
- * Helper function to convert field updates to patch operations format.
- * Uses REMOVE operation when the value is empty, otherwise uses REPLACE.
- *
- * @param payload - Object containing field updates
- * @returns Array of patch operations
- */
-export const createPatchOperations = (
-  payload: Record<string, any>,
-): {
-  operation: 'REPLACE' | 'REMOVE';
-  path: string;
-  value?: any;
-}[] =>
-  Object.entries(payload).map(([key, value]: [string, any]) => {
-    if (isEmpty(value)) {
-      return {
-        operation: 'REMOVE' as const,
-        path: `/${key}`,
-      };
-    }
-
-    return {
-      operation: 'REPLACE' as const,
-      path: `/${key}`,
-      value,
-    };
-  });
-
-export default updateOrganization;
diff --git a/packages/javascript/src/index.ts b/packages/javascript/src/index.ts
index ad8d796..3a3a33b 100644
--- a/packages/javascript/src/index.ts
+++ b/packages/javascript/src/index.ts
@@ -25,21 +25,16 @@ export {default as executeEmbeddedUserOnboardingFlow} from './api/executeEmbedde
 export type {EmbeddedUserOnboardingFlowResponse} from './api/executeEmbeddedUserOnboardingFlow';
 export {default as getFlowMeta} from './api/getFlowMeta';
 export {default as getOrganizationUnitChildren} from './api/getOrganizationUnitChildren';
+export type {
+  GetOrganizationUnitChildrenConfig,
+  OrganizationUnit,
+  OrganizationUnitListResponse,
+} from './api/getOrganizationUnitChildren';
 export {default as getUserInfo} from './api/getUserInfo';
 export {default as getScim2Me} from './api/getScim2Me';
 export type {GetScim2MeConfig} from './api/getScim2Me';
 export {default as getSchemas} from './api/getSchemas';
 export type {GetSchemasConfig} from './api/getSchemas';
-export {default as getAllOrganizations} from './api/getAllOrganizations';
-export type {GetAllOrganizationsConfig} from './api/getAllOrganizations';
-export {default as createOrganization} from './api/createOrganization';
-export type {CreateOrganizationPayload, CreateOrganizationConfig} from './api/createOrganization';
-export {default as getMeOrganizations} from './api/getMeOrganizations';
-export type {GetMeOrganizationsConfig} from './api/getMeOrganizations';
-export {default as getOrganization} from './api/getOrganization';
-export type {OrganizationDetails, GetOrganizationConfig} from './api/getOrganization';
-export {default as updateOrganization, createPatchOperations} from './api/updateOrganization';
-export type {UpdateOrganizationConfig} from './api/updateOrganization';
 export {default as updateMeProfile} from './api/updateMeProfile';
 export type {UpdateMeProfileConfig} from './api/updateMeProfile';
 
@@ -55,7 +50,6 @@ export {ThunderIDAuthException} from './errors/exception';
 
 export type {CIBAInitiateOptions, CIBAInitiateResponse, CIBAErrorCode, CIBAPollOptions} from './models/ciba';
 
-export type {AllOrganizationsApiResponse} from './models/organization';
 export {
   EmbeddedFlowComponentType,
   EmbeddedFlowActionVariant,
@@ -101,11 +95,6 @@ export type {
   EmbeddedRecoveryFlowRequest,
   EmbeddedRecoveryFlowErrorResponse,
 } from './models/embedded-recovery-flow';
-export type {
-  OrganizationUnit,
-  OrganizationUnitListResponse,
-  GetOrganizationUnitChildrenConfig,
-} from './models/organization-unit';
 export {FlowMetaType} from './models/flow-meta';
 export type {
   ApplicationMetadata,
@@ -163,7 +152,6 @@ export type {OIDCDiscoveryApiResponse} from './models/oidc-discovery';
 export type {Storage, TemporaryStore} from './models/store';
 export type {User, UserProfile} from './models/user';
 export type {SessionData} from './models/session';
-export type {Organization} from './models/organization';
 export type {TranslationFn} from './models/translation';
 export type {ResolveFlowTemplateLiteralsOptions} from './models/vars';
 export {WellKnownSchemaIds} from './models/scim2-schema';
diff --git a/packages/javascript/src/models/client.ts b/packages/javascript/src/models/client.ts
index f65540c..6d8b1aa 100644
--- a/packages/javascript/src/models/client.ts
+++ b/packages/javascript/src/models/client.ts
@@ -18,7 +18,6 @@
 
 import type {CIBAInitiateOptions, CIBAInitiateResponse, CIBAPollOptions} from './ciba';
 import {SignInOptions, SignOutOptions, SignUpOptions} from './config';
-import {Organization, AllOrganizationsApiResponse} from './organization';
 import {Storage} from './store';
 import {TokenExchangeRequestConfig, TokenResponse} from './token';
 import {User, UserProfile} from './user';
@@ -61,33 +60,12 @@ export interface ThunderIDClient<T> {
    */
   getAccessToken(sessionId?: string): Promise<string>;
 
-  /**
-   * Gets all organizations available to the user.
-   * @param options - Optional parameters for the request.
-   * @param sessionId - Optional session ID to be used for the request.
-   */
-  getAllOrganizations(options?: any, sessionId?: string): Promise<AllOrganizationsApiResponse>;
-
   /**
    * Gets the client configuration.
    * @returns The client configuration.
    */
   getConfiguration(): T;
 
-  /**
-   * Gets the current organization of the user.
-   *
-   * @returns The current organization if available, otherwise null.
-   */
-  getCurrentOrganization(sessionId?: string): Promise<Organization | null>;
-
-  /**
-   * Gets the current signed-in user's associated organizations.
-   *
-   * @returns Associated organizations.
-   */
-  getMyOrganizations(options?: any, sessionId?: string): Promise<Organization[]>;
-
   /**
    * Gets user information from the session.
    *
@@ -220,13 +198,6 @@ export interface ThunderIDClient<T> {
    */
   signUp(options?: SignUpOptions): Promise<void>;
 
-  /**
-   * Switches the current organization to the specified one.
-   * @param organization - The organization to switch to.
-   * @returns A promise that resolves when the switch is complete.
-   */
-  switchOrganization(organization: Organization, sessionId?: string): Promise<TokenResponse | Response>;
-
   /**
    * Updates the user profile with the provided payload.
    * @param payload - The new user profile data.
diff --git a/packages/javascript/src/models/config.ts b/packages/javascript/src/models/config.ts
index 3199396..d107a47 100644
--- a/packages/javascript/src/models/config.ts
+++ b/packages/javascript/src/models/config.ts
@@ -518,14 +518,6 @@ export interface I18nPreferences {
 }
 
 export interface UserPreferences {
-  /**
-   * Whether to automatically fetch the user's associated organizations after sign-in.
-   * When set to false, the SDK will not make API calls to `/api/users/v1/me/organizations`.
-   * @default true
-   * @remarks Disabling this will improve performance if you don't need organization information.
-   * You can manually call `getMyOrganizations()` when needed if this is disabled.
-   */
-  fetchOrganizations?: boolean;
   /**
    * Whether to automatically fetch the user profile from SCIM2 endpoints after sign-in.
    * When set to false, the SDK will not make API calls to `/scim2/Me` and `/scim2/Schemas`.
diff --git a/packages/javascript/src/models/organization-unit.ts b/packages/javascript/src/models/organization-unit.ts
deleted file mode 100644
index 577de21..0000000
--- a/packages/javascript/src/models/organization-unit.ts
+++ /dev/null
@@ -1,112 +0,0 @@
-/**
- * Copyright (c) 2026, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-export interface OrganizationUnit {
-  description?: string;
-  handle: string;
-  id: string;
-  logoUrl?: string;
-  name: string;
-  parent?: {
-    id: string;
-    ref?: string;
-  };
-}
-
-export interface OrganizationUnitListResponse {
-  count: number;
-  organizationUnits: OrganizationUnit[];
-  startIndex: number;
-  totalResults: number;
-}
-
-/**
- * Request configuration for fetching a single organization unit.
- *
- * @example
- * ```typescript
- * const config: GetOrganizationUnitConfig = {
- *   baseUrl: 'https://localhost:8090',
- *   organizationUnitId: '0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1',
- * };
- * ```
- *
- * @experimental This API may change in future versions
- */
-export interface GetOrganizationUnitConfig extends Omit<Partial<RequestInit>, 'method' | 'body'> {
-  /**
-   * Base URL of the API server.
-   * Either `baseUrl` or `url` must be provided.
-   */
-  baseUrl?: string;
-
-  /**
-   * The ID of the organization unit to retrieve.
-   */
-  organizationUnitId: string;
-
-  /**
-   * Fully qualified URL of the organization unit endpoint.
-   * When provided, `baseUrl` is ignored.
-   */
-  url?: string;
-}
-
-/**
- * Request configuration for fetching child organization units.
- *
- * @example
- * ```typescript
- * const config: GetOrganizationUnitChildrenConfig = {
- *   baseUrl: 'https://localhost:8090',
- *   organizationUnitId: '0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1',
- *   limit: 10,
- *   offset: 0,
- * };
- * ```
- *
- * @experimental This API may change in future versions
- */
-export interface GetOrganizationUnitChildrenConfig extends Omit<Partial<RequestInit>, 'method' | 'body'> {
-  /**
-   * Base URL of the API server.
-   * Either `baseUrl` or `url` must be provided.
-   */
-  baseUrl?: string;
-
-  /**
-   * Maximum number of child OUs to return. Defaults to 10.
-   */
-  limit?: number;
-
-  /**
-   * Pagination offset. Defaults to 0.
-   */
-  offset?: number;
-
-  /**
-   * The ID of the parent organization unit.
-   */
-  organizationUnitId: string;
-
-  /**
-   * Fully qualified URL of the organization unit children endpoint.
-   * When provided, `baseUrl` is ignored.
-   */
-  url?: string;
-}
diff --git a/packages/javascript/src/models/organization.ts b/packages/javascript/src/models/organization.ts
deleted file mode 100644
index fd166ca..0000000
--- a/packages/javascript/src/models/organization.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-export interface Organization {
-  id: string;
-  name: string;
-  orgHandle: string;
-  ref?: string;
-  status?: string;
-}
-
-/**
- * Interface for paginated organization response.
- */
-export interface AllOrganizationsApiResponse {
-  hasMore?: boolean;
-  nextCursor?: string;
-  organizations: Organization[];
-  totalCount?: number;
-}
diff --git a/packages/nextjs/src/ThunderIDNextClient.ts b/packages/nextjs/src/ThunderIDNextClient.ts
index 494a624..d27b18a 100644
--- a/packages/nextjs/src/ThunderIDNextClient.ts
+++ b/packages/nextjs/src/ThunderIDNextClient.ts
@@ -17,16 +17,12 @@
  */
 
 import {
-  AllOrganizationsApiResponse,
   ThunderIDNodeClient,
   ThunderIDRuntimeError,
   AuthClientConfig,
-  CreateOrganizationPayload,
   ExtendedAuthorizeRequestUrlParams,
   FlattenedSchema,
   IdToken,
-  Organization,
-  OrganizationDetails,
   Schema,
   SignInOptions,
   SignUpOptions,
@@ -35,14 +31,10 @@ import {
   TokenResponse,
   User,
   UserProfile,
-  createOrganization,
   extractUserClaimsFromIdToken,
   flattenUserSchema,
   generateFlattenedUserProfile,
   generateUserProfile,
-  getAllOrganizations,
-  getMeOrganizations,
-  getOrganization,
   getScim2Me,
   getSchemas,
   updateMeProfile,
@@ -217,141 +209,6 @@ class ThunderIDNextClient<T extends ThunderIDNextConfig = ThunderIDNextConfig> e
     }
   }
 
-  async createOrganization(payload: CreateOrganizationPayload, userId?: string): Promise<Organization> {
-    try {
-      const configData: AuthClientConfig<T> = await this.getStorageManager().getConfigData();
-      const baseUrl: string = configData?.baseUrl!;
-
-      return createOrganization({
-        baseUrl,
-        headers: {
-          Authorization: `Bearer ${await this.getAccessToken(userId)}`,
-        },
-        payload,
-      });
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to create organization: ${error instanceof Error ? error.message : String(error)}`,
-        'ThunderIDReactClient-createOrganization-RuntimeError-001',
-        'nextjs',
-        'An error occurred while creating the organization. Please check your configuration and network connection.',
-      );
-    }
-  }
-
-  async getOrganization(organizationId: string, userId?: string): Promise<OrganizationDetails> {
-    try {
-      const configData: AuthClientConfig<T> = await this.getStorageManager().getConfigData();
-      const baseUrl: string = configData?.baseUrl!;
-
-      return getOrganization({
-        baseUrl,
-        headers: {
-          Authorization: `Bearer ${await this.getAccessToken(userId)}`,
-        },
-        organizationId,
-      });
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to fetch the organization details of ${organizationId}: ${String(error)}`,
-        'ThunderIDReactClient-getOrganization-RuntimeError-001',
-        'nextjs',
-        `An error occurred while fetching the organization with the id: ${organizationId}.`,
-      );
-    }
-  }
-
-  override async getMyOrganizations(options?: any, userId?: string): Promise<Organization[]> {
-    try {
-      const configData: AuthClientConfig<T> = await this.getStorageManager().getConfigData();
-      const baseUrl: string = configData?.baseUrl!;
-
-      return getMeOrganizations({
-        baseUrl,
-        headers: {
-          Authorization: `Bearer ${await this.getAccessToken(userId)}`,
-        },
-      });
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to fetch the user's associated organizations: ${
-          error instanceof Error ? error.message : String(error)
-        }`,
-        'ThunderIDNextClient-getMyOrganizations-RuntimeError-001',
-        'nextjs',
-        'An error occurred while fetching associated organizations of the signed-in user.',
-      );
-    }
-  }
-
-  override async getAllOrganizations(options?: any, userId?: string): Promise<AllOrganizationsApiResponse> {
-    try {
-      const configData: AuthClientConfig<T> = await this.getStorageManager().getConfigData();
-      const baseUrl: string = configData?.baseUrl!;
-
-      return getAllOrganizations({
-        baseUrl,
-        headers: {
-          Authorization: `Bearer ${await this.getAccessToken(userId)}`,
-        },
-      });
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to fetch all organizations: ${error instanceof Error ? error.message : String(error)}`,
-        'ThunderIDNextClient-getAllOrganizations-RuntimeError-001',
-        'nextjs',
-        'An error occurred while fetching all the organizations associated with the user.',
-      );
-    }
-  }
-
-  override async getCurrentOrganization(userId?: string): Promise<Organization | null> {
-    const idToken: IdToken = await super.getDecodedIdToken(userId);
-
-    return {
-      id: idToken?.org_id!,
-      name: idToken?.org_name!,
-      orgHandle: idToken?.org_handle!,
-    };
-  }
-
-  override async switchOrganization(organization: Organization, userId?: string): Promise<TokenResponse | Response> {
-    try {
-      if (!organization.id) {
-        throw new ThunderIDRuntimeError(
-          'Organization ID is required for switching organizations',
-          'ThunderIDNextClient-switchOrganization-ValidationError-001',
-          'nextjs',
-          'The organization object must contain a valid ID to perform the organization switch.',
-        );
-      }
-
-      const exchangeConfig: TokenExchangeRequestConfig = {
-        attachToken: false,
-        data: {
-          client_id: '{{clientId}}',
-          client_secret: '{{clientSecret}}',
-          grant_type: 'organization_switch',
-          scope: '{{scopes}}',
-          switching_organization: organization.id,
-          token: '{{accessToken}}',
-        },
-        id: 'organization-switch',
-        returnsSession: true,
-        signInRequired: true,
-      };
-
-      return super.exchangeToken(exchangeConfig, userId) as unknown as Promise<TokenResponse | Response>;
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to switch organization: ${error instanceof Error ? error.message : String(JSON.stringify(error))}`,
-        'ThunderIDReactClient-RuntimeError-003',
-        'nextjs',
-        'An error occurred while switching to the specified organization. Please try again.',
-      );
-    }
-  }
-
   override isLoading(): boolean {
     return false;
   }
diff --git a/packages/nextjs/src/client/components/presentation/CreateOrganization/CreateOrganization.tsx b/packages/nextjs/src/client/components/presentation/CreateOrganization/CreateOrganization.tsx
deleted file mode 100644
index 6b68d9b..0000000
--- a/packages/nextjs/src/client/components/presentation/CreateOrganization/CreateOrganization.tsx
+++ /dev/null
@@ -1,159 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use client';
-
-import {CreateOrganizationPayload, ThunderIDRuntimeError} from '@thunderid/node';
-import {BaseCreateOrganization, BaseCreateOrganizationProps, useOrganization} from '@thunderid/react';
-import {FC, ReactElement, useState} from 'react';
-import getSessionId from '../../../../server/actions/getSessionId';
-import useThunderID from '../../../contexts/ThunderID/useThunderID';
-
-/**
- * Props interface for the CreateOrganization component.
- */
-export interface CreateOrganizationProps extends Omit<BaseCreateOrganizationProps, 'onSubmit' | 'loading' | 'error'> {
-  /**
-   * Fallback element to render when the user is not signed in.
-   */
-  fallback?: ReactElement;
-  /**
-   * Custom organization creation handler (will use default API if not provided).
-   */
-  onCreateOrganization?: (payload: CreateOrganizationPayload) => Promise<any>;
-}
-
-/**
- * CreateOrganization component that provides organization creation functionality.
- * This component automatically integrates with the ThunderID and Organization contexts.
- *
- * @example
- * ```tsx
- * import { CreateOrganization } from '@thunderid/react';
- *
- * // Basic usage - uses default API and contexts
- * <CreateOrganization
- *   onSuccess={(org) => console.log('Created:', org)}
- *   onCancel={() => navigate('/organizations')}
- * />
- *
- * // With custom organization creation handler
- * <CreateOrganization
- *   onCreateOrganization={async (payload) => {
- *     const result = await myCustomAPI.createOrganization(payload);
- *     return result;
- *   }}
- *   onSuccess={(org) => {
- *     console.log('Organization created:', org.name);
- *     // Custom success logic here
- *   }}
- * />
- *
- * // With fallback for unauthenticated users
- * <CreateOrganization
- *   fallback={<div>Please sign in to create an organization</div>}
- * />
- * ```
- */
-export const CreateOrganization: FC<CreateOrganizationProps> = ({
-  onCreateOrganization,
-  fallback = <></>,
-  onSuccess,
-  defaultParentId,
-  ...props
-}: CreateOrganizationProps): ReactElement => {
-  const {isSignedIn, baseUrl} = useThunderID();
-  const {currentOrganization, revalidateMyOrganizations, createOrganization} = useOrganization();
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  // Don't render if not authenticated
-  if (!isSignedIn && fallback) {
-    return fallback;
-  }
-
-  if (!isSignedIn) {
-    return <></>;
-  }
-
-  // Use current organization as parent if no defaultParentId provided
-  const parentId: string = defaultParentId || currentOrganization?.id || '';
-
-  const handleSubmit = async (payload: CreateOrganizationPayload): Promise<void> => {
-    setLoading(true);
-    setError(null);
-
-    try {
-      let result: any;
-
-      if (onCreateOrganization) {
-        result = await onCreateOrganization(payload);
-      } else {
-        if (!baseUrl) {
-          throw new Error('Base URL is required for organization creation');
-        }
-
-        if (!createOrganization) {
-          throw new ThunderIDRuntimeError(
-            `createOrganization function is not available.`,
-            'CreateOrganization-handleSubmit-RuntimeError-001',
-            'nextjs',
-            'The createOrganization function must be provided by the Organization context.',
-          );
-        }
-
-        result = await createOrganization(
-          {
-            ...payload,
-            parentId,
-          },
-          (await getSessionId())!,
-        );
-      }
-
-      // Refresh organizations list to include the new organization
-      if (revalidateMyOrganizations) {
-        await revalidateMyOrganizations();
-      }
-
-      // Call success callback if provided
-      if (onSuccess) {
-        onSuccess(result);
-      }
-    } catch (createError) {
-      const errorMessage: string = createError instanceof Error ? createError.message : 'Failed to create organization';
-      setError(errorMessage);
-      throw createError; // Re-throw to allow form to handle it
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  return (
-    <BaseCreateOrganization
-      onSubmit={handleSubmit}
-      loading={loading}
-      error={error}
-      defaultParentId={parentId}
-      onSuccess={onSuccess}
-      {...props}
-    />
-  );
-};
-
-export default CreateOrganization;
diff --git a/packages/nextjs/src/client/components/presentation/Organization/Organization.tsx b/packages/nextjs/src/client/components/presentation/Organization/Organization.tsx
deleted file mode 100644
index b76815a..0000000
--- a/packages/nextjs/src/client/components/presentation/Organization/Organization.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use client';
-
-import {Organization as IOrganization} from '@thunderid/node';
-import {BaseOrganization, BaseOrganizationProps, useOrganization} from '@thunderid/react';
-import {FC, ReactElement, ReactNode} from 'react';
-
-/**
- * Props for the Organization component.
- * Extends BaseOrganizationProps but makes the organization prop optional since it will be obtained from useOrganization
- */
-export interface OrganizationProps extends Omit<BaseOrganizationProps, 'organization'> {
-  /**
-   * Render prop that takes the organization object and returns a ReactNode.
-   * @param organization - The current organization object from Organization context.
-   * @returns A ReactNode to render.
-   */
-  children: (organization: IOrganization | null) => ReactNode;
-
-  /**
-   * Optional element to render when no organization is selected.
-   */
-  fallback?: ReactNode;
-}
-
-/**
- * A component that uses render props to expose the current organization object.
- * This component automatically retrieves the current organization from Organization context.
- *
- * @remarks This component is only supported in browser based React applications (CSR).
- *
- * @example
- * ```tsx
- * import { Organization } from '@thunderid/auth-react';
- *
- * const App = () => {
- *   return (
- *     <Organization fallback={<p>No organization selected</p>}>
- *       {(organization) => (
- *         <div>
- *           <h1>Current Organization: {organization.name}!</h1>
- *           <p>ID: {organization.id}</p>
- *           <p>Role: {organization.role}</p>
- *           {organization.memberCount && (
- *             <p>Members: {organization.memberCount}</p>
- *           )}
- *         </div>
- *       )}
- *     </Organization>
- *   );
- * }
- * ```
- */
-const Organization: FC<OrganizationProps> = ({children, fallback = null}: OrganizationProps): ReactElement => {
-  const {currentOrganization} = useOrganization();
-
-  return (
-    <BaseOrganization organization={currentOrganization} fallback={fallback}>
-      {children}
-    </BaseOrganization>
-  );
-};
-
-Organization.displayName = 'Organization';
-
-export default Organization;
diff --git a/packages/nextjs/src/client/components/presentation/OrganizationList/OrganizationList.tsx b/packages/nextjs/src/client/components/presentation/OrganizationList/OrganizationList.tsx
deleted file mode 100644
index f9f063d..0000000
--- a/packages/nextjs/src/client/components/presentation/OrganizationList/OrganizationList.tsx
+++ /dev/null
@@ -1,136 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use client';
-
-import {AllOrganizationsApiResponse} from '@thunderid/node';
-import {
-  BaseOrganizationListProps,
-  BaseOrganizationList,
-  useOrganization,
-  OrganizationWithSwitchAccess,
-} from '@thunderid/react';
-import {FC, ReactElement, useEffect, useState} from 'react';
-
-/**
- * Configuration options for the OrganizationList component.
- */
-export interface OrganizationListConfig {
-  /**
-   * Whether to automatically fetch organizations on mount
-   */
-  autoFetch?: boolean;
-  /**
-   * Filter string for organizations
-   */
-  filter?: string;
-  /**
-   * Number of organizations to fetch per page
-   */
-  limit?: number;
-  /**
-   * Whether to include recursive organizations
-   */
-  recursive?: boolean;
-}
-
-/**
- * Props interface for the OrganizationList component.
- * Uses the enhanced OrganizationContext instead of the useOrganizations hook.
- */
-export interface OrganizationListProps
-  extends Omit<
-      BaseOrganizationListProps,
-      'allOrganizations' | 'error' | 'fetchMore' | 'hasMore' | 'isLoading' | 'isLoadingMore' | 'myOrganizations'
-    >,
-    OrganizationListConfig {
-  /**
-   * Function called when an organization is selected/clicked
-   */
-  onOrganizationSelect?: (organization: OrganizationWithSwitchAccess) => void;
-}
-
-/**
- * OrganizationList component that provides organization listing functionality with pagination.
- * This component uses the enhanced OrganizationContext, eliminating the polling issue and
- * providing better integration with the existing context system.
- *
- * @example
- * ```tsx
- * import { OrganizationList } from '@thunderid/react';
- *
- * // Basic usage
- * <OrganizationList />
- *
- * // With custom limit and filter
- * <OrganizationList
- *   limit={20}
- *   filter="active"
- *   onOrganizationSelect={(org) => {
- *     console.log('Selected organization:', org.name);
- *   }}
- * />
- *
- * // As a popup dialog
- * <OrganizationList
- *   mode="popup"
- *   open={isOpen}
- *   onOpenChange={setIsOpen}
- *   title="Select Organization"
- * />
- *
- * // With custom organization renderer
- * <OrganizationList
- *   renderOrganization={(org) => (
- *     <div key={org.id}>
- *       <h3>{org.name}</h3>
- *       <p>Can switch: {org.canSwitch ? 'Yes' : 'No'}</p>
- *     </div>
- *   )}
- * />
- * ```
- */
-export const OrganizationList: FC<OrganizationListProps> = ({
-  onOrganizationSelect,
-  ...baseProps
-}: OrganizationListProps): ReactElement => {
-  const {getAllOrganizations, error, isLoading, myOrganizations} = useOrganization();
-
-  const [allOrganizations, setAllOrganizations] = useState<AllOrganizationsApiResponse>({
-    organizations: [],
-  });
-
-  useEffect(() => {
-    (async (): Promise<void> => {
-      setAllOrganizations(await getAllOrganizations());
-    })();
-  }, []);
-
-  return (
-    <BaseOrganizationList
-      allOrganizations={allOrganizations}
-      myOrganizations={myOrganizations}
-      error={error}
-      isLoading={isLoading}
-      onOrganizationSelect={onOrganizationSelect}
-      {...baseProps}
-    />
-  );
-};
-
-export default OrganizationList;
diff --git a/packages/nextjs/src/client/components/presentation/OrganizationProfile/OrganizationProfile.tsx b/packages/nextjs/src/client/components/presentation/OrganizationProfile/OrganizationProfile.tsx
deleted file mode 100644
index f8bfbc2..0000000
--- a/packages/nextjs/src/client/components/presentation/OrganizationProfile/OrganizationProfile.tsx
+++ /dev/null
@@ -1,221 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use client';
-
-import {OrganizationDetails, updateOrganization, createPatchOperations} from '@thunderid/node';
-import {BaseOrganizationProfile, BaseOrganizationProfileProps, useTranslation} from '@thunderid/react';
-import {FC, ReactElement, useEffect, useState} from 'react';
-import getOrganizationAction from '../../../../server/actions/getOrganizationAction';
-import getSessionId from '../../../../server/actions/getSessionId';
-import logger from '../../../../utils/logger';
-import useThunderID from '../../../contexts/ThunderID/useThunderID';
-
-/**
- * Props for the OrganizationProfile component.
- * Extends BaseOrganizationProfileProps but makes the organization prop optional
- * since it will be fetched using the organizationId
- */
-export type OrganizationProfileProps = Omit<BaseOrganizationProfileProps, 'organization' | 'mode'> & {
-  /**
-   * Component to show when there's an error loading organization data.
-   */
-  errorFallback?: ReactElement;
-
-  /**
-   * Component to show while loading organization data.
-   */
-  loadingFallback?: ReactElement;
-
-  /**
-   * Display mode for the component.
-   */
-  mode?: 'default' | 'popup';
-
-  /**
-   * Callback fired when the popup should be closed (only used in popup mode).
-   */
-  onOpenChange?: (open: boolean) => void;
-
-  /**
-   * Callback fired when the organization should be updated.
-   */
-  onUpdate?: (payload: any) => Promise<void>;
-
-  /**
-   * Whether the popup is open (only used in popup mode).
-   */
-  open?: boolean;
-
-  /**
-   * The ID of the organization to fetch and display.
-   */
-  organizationId: string;
-
-  /**
-   * Custom title for the popup dialog (only used in popup mode).
-   */
-  popupTitle?: string;
-};
-
-/**
- * OrganizationProfile component displays organization information in a
- * structured and styled format. It automatically fetches organization details
- * using the provided organization ID and displays them using BaseOrganizationProfile.
- *
- * The component supports editing functionality, allowing users to modify organization
- * fields inline. Updates are automatically synced with the backend via the SCIM2 API.
- *
- * This component is the React-specific implementation that automatically
- * retrieves the organization data from ThunderID API.
- *
- * @example
- * ```tsx
- * // Basic usage with editing enabled (default)
- * <OrganizationProfile organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1" />
- *
- * // Read-only mode
- * <OrganizationProfile
- *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
- *   editable={false}
- * />
- *
- * // With card layout and custom fallbacks
- * <OrganizationProfile
- *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
- *   cardLayout={true}
- *   loadingFallback={<div>Loading organization...</div>}
- *   errorFallback={<div>Failed to load organization</div>}
- *   fallback={<div>No organization data available</div>}
- * />
- *
- * // With custom fields configuration and update callback
- * <OrganizationProfile
- *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
- *   fields={[
- *     { key: 'id', label: 'Organization ID', editable: false },
- *     { key: 'name', label: 'Organization Name', editable: true },
- *     { key: 'description', label: 'Description', editable: true, render: (value) => value || 'No description' },
- *     { key: 'created', label: 'Created Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },
- *     { key: 'lastModified', label: 'Last Modified Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },
- *     { key: 'attributes', label: 'Custom Attributes', editable: true }
- *   ]}
- *   onUpdate={async (payload) => {
- *     console.log('Organization updated:', payload);
- *     // payload contains the updated field values
- *     // The component automatically converts these to patch operations
- *   }}
- * />
- *
- * // In popup mode
- * <OrganizationProfile
- *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
- *   mode="popup"
- *   open={isOpen}
- *   onOpenChange={setIsOpen}
- *   popupTitle="Edit Organization Profile"
- * />
- * ```
- */
-const OrganizationProfile: FC<OrganizationProfileProps> = ({
-  organizationId,
-  mode = 'default',
-  open = false,
-  onOpenChange,
-  onUpdate,
-  popupTitle,
-  ...rest
-}: OrganizationProfileProps): ReactElement => {
-  const {baseUrl} = useThunderID();
-  const {t} = useTranslation();
-  const [organization, setOrganization] = useState<OrganizationDetails | null>(null);
-  const [, setLoading] = useState<boolean>(true);
-  const [, setError] = useState<boolean>(false);
-
-  const fetchOrganization = async (): Promise<void> => {
-    if (!baseUrl || !organizationId) {
-      setLoading(false);
-      setError(true);
-      return;
-    }
-
-    try {
-      setLoading(true);
-      setError(false);
-      const result: {data?: {organization?: OrganizationDetails}; error: string | null; success: boolean} =
-        await getOrganizationAction(organizationId, (await getSessionId())!);
-
-      if (result.data?.organization) {
-        setOrganization(result.data.organization);
-
-        return;
-      }
-
-      setError(true);
-    } catch (err) {
-      logger.error('Failed to fetch organization:', err);
-      setError(true);
-      setOrganization(null);
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  useEffect(() => {
-    fetchOrganization();
-  }, [baseUrl, organizationId]);
-
-  const handleOrganizationUpdate = async (payload: any): Promise<void> => {
-    if (!baseUrl || !organizationId) return;
-
-    try {
-      // Convert payload to patch operations format
-      const operations: {operation: 'REPLACE' | 'REMOVE'; path: string; value?: any}[] = createPatchOperations(payload);
-
-      await updateOrganization({
-        baseUrl,
-        operations,
-        organizationId,
-      });
-      // Refetch organization data after update
-      await fetchOrganization();
-
-      // Call the optional onUpdate callback
-      if (onUpdate) {
-        await onUpdate(payload);
-      }
-    } catch (err) {
-      logger.error('Failed to update organization:', err);
-      throw err;
-    }
-  };
-
-  return (
-    <BaseOrganizationProfile
-      organization={organization}
-      onUpdate={handleOrganizationUpdate}
-      mode={mode === 'popup' ? 'popup' : 'inline'}
-      open={open}
-      onOpenChange={onOpenChange}
-      title={popupTitle || t('organization.profile.heading')}
-      {...rest}
-    />
-  );
-};
-
-export default OrganizationProfile;
diff --git a/packages/nextjs/src/client/components/presentation/OrganizationSwitcher/OrganizationSwitcher.tsx b/packages/nextjs/src/client/components/presentation/OrganizationSwitcher/OrganizationSwitcher.tsx
deleted file mode 100644
index 198d628..0000000
--- a/packages/nextjs/src/client/components/presentation/OrganizationSwitcher/OrganizationSwitcher.tsx
+++ /dev/null
@@ -1,199 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use client';
-
-import {Organization} from '@thunderid/node';
-import {
-  BaseOrganizationSwitcher,
-  BaseOrganizationSwitcherProps,
-  BuildingAlt,
-  useOrganization,
-  useTranslation,
-} from '@thunderid/react';
-import {FC, ReactElement, useState} from 'react';
-import useThunderID from '../../../contexts/ThunderID/useThunderID';
-import {CreateOrganization} from '../CreateOrganization/CreateOrganization.js';
-import OrganizationList from '../OrganizationList/OrganizationList.js';
-import OrganizationProfile from '../OrganizationProfile/OrganizationProfile.js';
-
-/**
- * Props interface for the OrganizationSwitcher component.
- * Makes organizations optional since they'll be retrieved from OrganizationContext.
- */
-export interface OrganizationSwitcherProps
-  extends Omit<BaseOrganizationSwitcherProps, 'organizations' | 'currentOrganization' | 'onOrganizationSwitch'> {
-  /**
-   * Optional override for current organization (will use context if not provided)
-   */
-  currentOrganization?: Organization;
-  /**
-   * Fallback element to render when the user is not signed in.
-   */
-  fallback?: ReactElement;
-  /**
-   * Optional callback for organization switch (will use context if not provided)
-   */
-  onOrganizationSwitch?: (organization: Organization) => Promise<void> | void;
-  /**
-   * Optional override for organizations list (will use context if not provided)
-   */
-  organizations?: Organization[];
-}
-
-/**
- * OrganizationSwitcher component that provides organization switching functionality.
- * This component automatically retrieves organizations from the OrganizationContext.
- * You can also override the organizations, currentOrganization, and onOrganizationSwitch
- * by passing them as props.
- *
- * @example
- * ```tsx
- * import { OrganizationSwitcher } from '@thunderid/react';
- *
- * // Basic usage - uses OrganizationContext
- * <OrganizationSwitcher />
- *
- * // With custom organization switch handler
- * <OrganizationSwitcher
- *   onOrganizationSwitch={(org) => {
- *     console.log('Switching to:', org.name);
- *     // Custom logic here
- *   }}
- * />
- *
- * // With fallback for unauthenticated users
- * <OrganizationSwitcher
- *   fallback={<div>Please sign in to view organizations</div>}
- * />
- * ```
- */
-export const OrganizationSwitcher: FC<OrganizationSwitcherProps> = ({
-  currentOrganization: propCurrentOrganization,
-  fallback = <></>,
-  onOrganizationSwitch: propOnOrganizationSwitch,
-  organizations: propOrganizations,
-  ...props
-}: OrganizationSwitcherProps): ReactElement => {
-  const {isSignedIn} = useThunderID();
-  const {
-    currentOrganization: contextCurrentOrganization,
-    myOrganizations: contextOrganizations,
-    switchOrganization,
-    isLoading,
-    error,
-  } = useOrganization();
-  const [isCreateOrgOpen, setIsCreateOrgOpen] = useState(false);
-  const [isProfileOpen, setIsProfileOpen] = useState(false);
-  const [isOrganizationListOpen, setIsOrganizationListOpen] = useState(false);
-  const {t} = useTranslation();
-
-  if (!isSignedIn && fallback) {
-    return fallback;
-  }
-
-  if (!isSignedIn) {
-    return <></>;
-  }
-
-  const organizations: Organization[] = propOrganizations || contextOrganizations || [];
-  const currentOrganization: Organization = propCurrentOrganization || contextCurrentOrganization!;
-  const onOrganizationSwitch: (organization: Organization) => void = propOnOrganizationSwitch || switchOrganization;
-
-  const handleManageOrganizations = (): void => {
-    setIsOrganizationListOpen(true);
-  };
-
-  const handleManageOrganization = (): void => {
-    setIsProfileOpen(true);
-  };
-
-  const defaultMenuItems: {icon?: ReactElement; label: string; onClick: () => void}[] = [];
-
-  if (currentOrganization) {
-    defaultMenuItems.push({
-      icon: <BuildingAlt />,
-      label: t('organization.switcher.manage.organizations'),
-      onClick: handleManageOrganizations,
-    });
-  }
-
-  defaultMenuItems.push({
-    icon: (
-      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
-        <path d="M12 5v14m-7-7h14" />
-      </svg>
-    ),
-    label: t('organization.switcher.create.organization'),
-    onClick: (): void => setIsCreateOrgOpen(true),
-  });
-
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const menuItems: any[] = props.menuItems ? [...defaultMenuItems, ...props.menuItems] : defaultMenuItems;
-
-  return (
-    <>
-      <BaseOrganizationSwitcher
-        organizations={organizations}
-        currentOrganization={currentOrganization}
-        onOrganizationSwitch={onOrganizationSwitch as any}
-        loading={isLoading}
-        error={error as any}
-        menuItems={menuItems}
-        onManageProfile={handleManageOrganization}
-        {...props}
-      />
-      <CreateOrganization
-        mode="popup"
-        open={isCreateOrgOpen}
-        onOpenChange={setIsCreateOrgOpen}
-        onSuccess={(org: Organization) => {
-          if (org && onOrganizationSwitch) {
-            onOrganizationSwitch(org);
-          }
-          setIsCreateOrgOpen(false);
-        }}
-      />
-      {currentOrganization && (
-        <OrganizationProfile
-          organizationId={currentOrganization.id}
-          mode="popup"
-          open={isProfileOpen}
-          onOpenChange={setIsProfileOpen}
-          cardLayout={true}
-          loadingFallback={<div>{t('organization.profile.loading')}</div>}
-          errorFallback={<div>{t('organization.profile.error')}</div>}
-        />
-      )}
-      <OrganizationList
-        mode="popup"
-        open={isOrganizationListOpen}
-        onOpenChange={setIsOrganizationListOpen}
-        title={t('organization.switcher.manage.organizations')}
-        onOrganizationSelect={(organization: Organization) => {
-          if (onOrganizationSwitch) {
-            onOrganizationSwitch(organization);
-          }
-          setIsOrganizationListOpen(false);
-        }}
-      />
-    </>
-  );
-};
-
-export default OrganizationSwitcher;
diff --git a/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx b/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx
index 0cd013c..0624ed9 100644
--- a/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx
+++ b/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx
@@ -19,15 +19,11 @@
 'use client';
 
 import {
-  AllOrganizationsApiResponse,
   EmbeddedFlowExecuteRequestConfig,
   generateFlattenedUserProfile,
-  Organization,
   UpdateMeProfileConfig,
   User,
   UserProfile,
-  TokenResponse,
-  CreateOrganizationPayload,
   ThunderIDRuntimeError,
 } from '@thunderid/node';
 import {
@@ -37,7 +33,6 @@ import {
   UserProvider,
   ThemeProvider,
   ThunderIDProviderProps,
-  OrganizationProvider,
   getActiveTheme,
 } from '@thunderid/react';
 import {ReadonlyURLSearchParams} from 'next/dist/client/components/navigation.react-server';
@@ -55,23 +50,17 @@ export type ThunderIDClientProviderProps = Partial<Omit<ThunderIDProviderProps,
   Pick<ThunderIDProviderProps, 'baseUrl' | 'clientId'> & {
     applicationId: ThunderIDContextProps['applicationId'];
     clearSession: () => Promise<void>;
-    createOrganization: (payload: CreateOrganizationPayload, sessionId: string) => Promise<Organization>;
-    currentOrganization: Organization;
-    getAllOrganizations: (options?: any, sessionId?: string) => Promise<AllOrganizationsApiResponse>;
     handleOAuthCallback: (
       code: string,
       state: string,
       sessionState?: string,
     ) => Promise<{error?: string; redirectUrl?: string; success: boolean}>;
     isSignedIn: boolean;
-    myOrganizations: Organization[];
     organizationHandle: ThunderIDContextProps['organizationHandle'];
     refreshToken: () => Promise<RefreshResult>;
-    revalidateMyOrganizations?: (sessionId?: string) => Promise<Organization[]>;
     signIn: ThunderIDContextProps['signIn'];
     signOut: ThunderIDContextProps['signOut'];
     signUp: ThunderIDContextProps['signUp'];
-    switchOrganization: (organization: Organization, sessionId?: string) => Promise<TokenResponse | Response>;
     updateProfile: (
       requestConfig: UpdateMeProfileConfig,
       sessionId?: string,
@@ -89,22 +78,16 @@ const ThunderIDClientProvider: FC<PropsWithChildren<ThunderIDClientProviderProps
   signOut,
   signUp,
   handleOAuthCallback,
-  createOrganization,
   preferences,
   isSignedIn,
   signInUrl,
   signUpUrl,
   user: _user,
   userProfile: _userProfile,
-  currentOrganization,
   updateProfile,
   applicationId,
   organizationHandle,
   scopes,
-  myOrganizations,
-  revalidateMyOrganizations,
-  getAllOrganizations,
-  switchOrganization,
 }: PropsWithChildren<ThunderIDClientProviderProps>) => {
   const reRenderCheckRef: RefObject<boolean> = useRef(false);
   const router: AppRouterInstance = useRouter();
@@ -325,16 +308,7 @@ const ThunderIDClientProvider: FC<PropsWithChildren<ThunderIDClientProviderProps
           >
             <FlowProvider>
               <UserProvider profile={userProfile} onUpdateProfile={handleProfileUpdate} updateProfile={updateProfile}>
-                <OrganizationProvider
-                  createOrganization={createOrganization}
-                  getAllOrganizations={getAllOrganizations}
-                  myOrganizations={myOrganizations}
-                  currentOrganization={currentOrganization}
-                  onOrganizationSwitch={switchOrganization as any}
-                  revalidateMyOrganizations={revalidateMyOrganizations as any}
-                >
-                  {children}
-                </OrganizationProvider>
+                {children}
               </UserProvider>
             </FlowProvider>
           </ThemeProvider>
diff --git a/packages/nextjs/src/client/index.ts b/packages/nextjs/src/client/index.ts
index fde41e4..39c3a01 100644
--- a/packages/nextjs/src/client/index.ts
+++ b/packages/nextjs/src/client/index.ts
@@ -18,23 +18,11 @@
 
 export {default as useThunderID} from './contexts/ThunderID/useThunderID';
 
-export {default as Organization} from './components/presentation/Organization/Organization';
-export {OrganizationProps} from './components/presentation/Organization/Organization';
-
-export {default as CreateOrganization} from './components/presentation/CreateOrganization/CreateOrganization';
-export {CreateOrganizationProps} from './components/presentation/CreateOrganization/CreateOrganization';
-
-export {default as OrganizationProfile} from './components/presentation/OrganizationProfile/OrganizationProfile';
-export {OrganizationProfileProps} from './components/presentation/OrganizationProfile/OrganizationProfile';
-
-export {default as OrganizationSwitcher} from './components/presentation/OrganizationSwitcher/OrganizationSwitcher';
-export {OrganizationSwitcherProps} from './components/presentation/OrganizationSwitcher/OrganizationSwitcher';
-
 export {default as SignedIn} from './components/control/SignedIn/SignedIn';
-export {SignedInProps} from './components/control/SignedIn/SignedIn';
+export type {SignedInProps} from './components/control/SignedIn/SignedIn';
 
 export {default as SignedOut} from './components/control/SignedOut/SignedOut';
-export {SignedOutProps} from './components/control/SignedOut/SignedOut';
+export type {SignedOutProps} from './components/control/SignedOut/SignedOut';
 
 export {default as SignInButton} from './components/actions/SignInButton/SignInButton';
 export type {SignInButtonProps} from './components/actions/SignInButton/SignInButton';
diff --git a/packages/nextjs/src/server/ThunderIDProvider.tsx b/packages/nextjs/src/server/ThunderIDProvider.tsx
index 7579289..e10c6eb 100644
--- a/packages/nextjs/src/server/ThunderIDProvider.tsx
+++ b/packages/nextjs/src/server/ThunderIDProvider.tsx
@@ -18,14 +18,10 @@
 
 'use server';
 
-import {ThunderIDRuntimeError, IdToken, Organization, User, UserProfile} from '@thunderid/node';
+import {ThunderIDRuntimeError, IdToken, User, UserProfile} from '@thunderid/node';
 import {ThunderIDProviderProps} from '@thunderid/react';
 import {FC, PropsWithChildren, ReactElement} from 'react';
 import clearSession from './actions/clearSession';
-import createOrganization from './actions/createOrganization';
-import getAllOrganizations from './actions/getAllOrganizations';
-import getCurrentOrganizationAction from './actions/getCurrentOrganizationAction';
-import getMyOrganizations from './actions/getMyOrganizations';
 import getSessionId from './actions/getSessionId';
 import getSessionPayload from './actions/getSessionPayload';
 import getUserAction from './actions/getUserAction';
@@ -36,7 +32,6 @@ import refreshToken from './actions/refreshToken';
 import signInAction from './actions/signInAction';
 import signOutAction from './actions/signOutAction';
 import signUpAction from './actions/signUpAction';
-import switchOrganization from './actions/switchOrganization';
 import updateUserProfileAction from './actions/updateUserProfileAction';
 import getClient from './getClient';
 import ThunderIDClientProvider from '../client/contexts/ThunderID/ThunderIDProvider.js';
@@ -122,13 +117,6 @@ const ThunderIDServerProvider: FC<PropsWithChildren<ThunderIDServerProviderProps
     profile: {},
     schemas: [],
   };
-  let currentOrganization: Organization = {
-    id: '',
-    name: '',
-    orgHandle: '',
-  };
-  let myOrganizations: Organization[] = [];
-
   if (signedIn) {
     let updatedBaseUrl: string | undefined = config?.baseUrl;
 
@@ -149,8 +137,6 @@ const ThunderIDServerProvider: FC<PropsWithChildren<ThunderIDServerProviderProps
 
     // Check if user profile fetching is enabled (default: true)
     const shouldFetchUserProfile: boolean = config?.preferences?.user?.fetchUserProfile !== false;
-    // Check if organization fetching is enabled (default: true)
-    const shouldFetchOrganizations: boolean = config?.preferences?.user?.fetchOrganizations !== false;
 
     if (shouldFetchUserProfile) {
       try {
@@ -171,26 +157,6 @@ const ThunderIDServerProvider: FC<PropsWithChildren<ThunderIDServerProviderProps
         logger.warn('[ThunderIDServerProvider] Failed to fetch user profile from SCIM2:', error?.toString());
       }
     }
-
-    if (shouldFetchOrganizations) {
-      try {
-        const currentOrganizationResponse: {
-          data: {organization?: Organization; user?: Record<string, unknown>};
-          error: string | null;
-          success: boolean;
-        } = await getCurrentOrganizationAction(sessionId);
-
-        if (sessionId) {
-          myOrganizations = await getMyOrganizations({}, sessionId);
-        } else {
-          logger.warn('[ThunderIDServerProvider] No session ID available, skipping organization fetch');
-        }
-
-        currentOrganization = currentOrganizationResponse?.data?.organization!;
-      } catch (error) {
-        logger.warn('[ThunderIDServerProvider] Failed to fetch organization info:', error?.toString());
-      }
-    }
   }
 
   return (
@@ -209,14 +175,9 @@ const ThunderIDServerProvider: FC<PropsWithChildren<ThunderIDServerProviderProps
       preferences={config?.preferences}
       clientId={config?.clientId}
       user={user}
-      currentOrganization={currentOrganization}
       userProfile={userProfile}
       updateProfile={updateUserProfileAction}
       isSignedIn={signedIn}
-      myOrganizations={myOrganizations}
-      getAllOrganizations={getAllOrganizations}
-      switchOrganization={switchOrganization}
-      createOrganization={createOrganization}
     >
       {children}
     </ThunderIDClientProvider>
diff --git a/packages/nextjs/src/server/actions/__tests__/createOrganization.test.ts b/packages/nextjs/src/server/actions/__tests__/createOrganization.test.ts
deleted file mode 100644
index 913a549..0000000
--- a/packages/nextjs/src/server/actions/__tests__/createOrganization.test.ts
+++ /dev/null
@@ -1,128 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {ThunderIDAPIError, Organization, CreateOrganizationPayload} from '@thunderid/node';
-import {describe, it, expect, vi, beforeEach, afterEach, Mock} from 'vitest';
-
-// Adjust these paths if your project structure is different
-import getClient from '../../getClient';
-import createOrganization from '../createOrganization';
-
-// Use the same class so we can assert instanceof and status code propagation
-
-// Pull the mocked modules so we can access their spies
-import getSessionId from '../getSessionId';
-
-// ---- Mocks ----
-vi.mock('../../getClient', () => ({
-  default: vi.fn(),
-}));
-
-vi.mock('../getSessionId', () => ({
-  default: vi.fn(),
-}));
-
-describe('createOrganization (Next.js server action)', () => {
-  const mockClient: {createOrganization: ReturnType<typeof vi.fn>} = {
-    createOrganization: vi.fn(),
-  };
-
-  const basePayload: CreateOrganizationPayload = {
-    description: 'Screen sharing organization',
-    name: 'Team Viewer',
-    orgHandle: 'team-viewer',
-    parentId: 'parent-123',
-    type: 'TENANT',
-  };
-
-  const mockOrg: Organization = {
-    id: 'org-001',
-    name: 'Team Viewer',
-    orgHandle: 'team-viewer',
-  };
-
-  beforeEach(() => {
-    vi.resetAllMocks();
-
-    // Default: getInstance returns our mock client
-    (getClient as unknown as Mock).mockReturnValue(mockClient);
-    // Default: getSessionId resolves to a session id
-    (getSessionId as unknown as Mock).mockResolvedValue('sess-abc');
-  });
-
-  afterEach(() => {
-    vi.restoreAllMocks();
-  });
-
-  it('should create an organization successfully when a sessionId is provided', async () => {
-    mockClient.createOrganization.mockResolvedValueOnce(mockOrg);
-
-    const result: Organization = await createOrganization(basePayload, 'sess-123');
-
-    expect(getClient).toHaveBeenCalledTimes(1);
-    expect(getSessionId).not.toHaveBeenCalled();
-    expect(mockClient.createOrganization).toHaveBeenCalledWith(basePayload, 'sess-123');
-    expect(result).toEqual(mockOrg);
-  });
-
-  it('should fall back to getSessionId when sessionId is undefined', async () => {
-    mockClient.createOrganization.mockResolvedValueOnce(mockOrg);
-
-    const result: Organization = await createOrganization(basePayload, undefined as unknown as string);
-
-    expect(getSessionId).toHaveBeenCalledTimes(1);
-    expect(mockClient.createOrganization).toHaveBeenCalledWith(basePayload, 'sess-abc');
-    expect(result).toEqual(mockOrg);
-  });
-
-  it('should fall back to getSessionId when sessionId is null', async () => {
-    mockClient.createOrganization.mockResolvedValueOnce(mockOrg);
-
-    const result: Organization = await createOrganization(basePayload, null as unknown as string);
-
-    expect(getSessionId).toHaveBeenCalledTimes(1);
-    expect(mockClient.createOrganization).toHaveBeenCalledWith(basePayload, 'sess-abc');
-    expect(result).toEqual(mockOrg);
-  });
-
-  it('should not call getSessionId when an empty string is passed (empty string is not nullish)', async () => {
-    mockClient.createOrganization.mockResolvedValueOnce(mockOrg);
-
-    const result: Organization = await createOrganization(basePayload, '');
-
-    expect(getSessionId).not.toHaveBeenCalled();
-    expect(mockClient.createOrganization).toHaveBeenCalledWith(basePayload, '');
-    expect(result).toEqual(mockOrg);
-  });
-
-  it('should wrap an ThunderIDAPIError thrown by client.createOrganization, preserving statusCode', async () => {
-    const original: ThunderIDAPIError = new ThunderIDAPIError(
-      'Upstream validation failed',
-      'ORG_CREATE_400',
-      'server',
-      400,
-    );
-    mockClient.createOrganization.mockRejectedValueOnce(original);
-
-    await expect(createOrganization(basePayload, 'sess-1')).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining('Failed to create the organization: Upstream validation failed'),
-      statusCode: 400,
-    });
-  });
-});
diff --git a/packages/nextjs/src/server/actions/__tests__/getAllOrganizations.test.ts b/packages/nextjs/src/server/actions/__tests__/getAllOrganizations.test.ts
deleted file mode 100644
index 9171fb8..0000000
--- a/packages/nextjs/src/server/actions/__tests__/getAllOrganizations.test.ts
+++ /dev/null
@@ -1,120 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-// src/server/actions/__tests__/getAllOrganizations.test.ts
-import {ThunderIDAPIError, AllOrganizationsApiResponse} from '@thunderid/node';
-import {describe, it, expect, vi, beforeEach, afterEach, Mock} from 'vitest';
-
-// --- Now import the SUT and mocked deps ---
-import getClient from '../../getClient';
-import getAllOrganizations from '../getAllOrganizations';
-import getSessionId from '../getSessionId';
-
-// --- Mocks MUST be defined before importing the SUT ---
-vi.mock('../../getClient', () => ({
-  default: vi.fn(),
-}));
-
-vi.mock('../getSessionId', () => ({
-  default: vi.fn(),
-}));
-
-describe('getAllOrganizations (Next.js server action)', () => {
-  const mockClient: {getAllOrganizations: ReturnType<typeof vi.fn>} = {
-    getAllOrganizations: vi.fn(),
-  };
-
-  const baseOptions: {cursor: string; filter: string; limit: number} = {
-    cursor: 'cur-1',
-    filter: 'type eq "TENANT"',
-    limit: 50,
-  };
-
-  const mockResponse: AllOrganizationsApiResponse = {
-    data: [
-      {id: 'org-001', name: 'Alpha', orgHandle: 'alpha'},
-      {id: 'org-002', name: 'Beta', orgHandle: 'beta'},
-    ],
-    meta: {itemsPerPage: 2, startIndex: 1, totalResults: 2},
-  } as unknown as AllOrganizationsApiResponse;
-
-  beforeEach(() => {
-    vi.resetAllMocks();
-
-    // Default: getInstance returns our mock client
-    (getClient as unknown as Mock).mockReturnValue(mockClient);
-    // Default: session id resolver returns a value
-    (getSessionId as unknown as Mock).mockResolvedValue('sess-abc');
-  });
-
-  afterEach(() => {
-    vi.restoreAllMocks();
-  });
-
-  it('returns organizations when a sessionId is provided (no getSessionId fallback)', async () => {
-    mockClient.getAllOrganizations.mockResolvedValueOnce(mockResponse);
-
-    const result: AllOrganizationsApiResponse = await getAllOrganizations(baseOptions, 'sess-123');
-
-    expect(getClient).toHaveBeenCalledTimes(1);
-    expect(getSessionId).not.toHaveBeenCalled();
-    expect(mockClient.getAllOrganizations).toHaveBeenCalledWith(baseOptions, 'sess-123');
-    expect(result).toBe(mockResponse);
-  });
-
-  it('falls back to getSessionId when sessionId is undefined', async () => {
-    mockClient.getAllOrganizations.mockResolvedValueOnce(mockResponse);
-
-    const result: AllOrganizationsApiResponse = await getAllOrganizations(baseOptions, undefined);
-
-    expect(getSessionId).toHaveBeenCalledTimes(1);
-    expect(mockClient.getAllOrganizations).toHaveBeenCalledWith(baseOptions, 'sess-abc');
-    expect(result).toBe(mockResponse);
-  });
-
-  it('falls back to getSessionId when sessionId is null', async () => {
-    mockClient.getAllOrganizations.mockResolvedValueOnce(mockResponse);
-
-    const result: AllOrganizationsApiResponse = await getAllOrganizations(baseOptions, null as unknown as string);
-
-    expect(getSessionId).toHaveBeenCalledTimes(1);
-    expect(mockClient.getAllOrganizations).toHaveBeenCalledWith(baseOptions, 'sess-abc');
-    expect(result).toBe(mockResponse);
-  });
-
-  it('does not call getSessionId for an empty string sessionId (empty string is not nullish)', async () => {
-    mockClient.getAllOrganizations.mockResolvedValueOnce(mockResponse);
-
-    const result: AllOrganizationsApiResponse = await getAllOrganizations(baseOptions, '');
-
-    expect(getSessionId).not.toHaveBeenCalled();
-    expect(mockClient.getAllOrganizations).toHaveBeenCalledWith(baseOptions, '');
-    expect(result).toBe(mockResponse);
-  });
-
-  it('wraps an ThunderIDAPIError thrown by client.getAllOrganizations, preserving statusCode', async () => {
-    const upstream: ThunderIDAPIError = new ThunderIDAPIError('Upstream failed', 'ORG_LIST_500', 'server', 503);
-    mockClient.getAllOrganizations.mockRejectedValueOnce(upstream);
-
-    await expect(getAllOrganizations(baseOptions, 'sess-x')).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining('Failed to get all the organizations for the user: Upstream failed'),
-      statusCode: 503,
-    });
-  });
-});
diff --git a/packages/nextjs/src/server/actions/__tests__/getCurrentOrganizationAction.test.ts b/packages/nextjs/src/server/actions/__tests__/getCurrentOrganizationAction.test.ts
deleted file mode 100644
index aa1bc92..0000000
--- a/packages/nextjs/src/server/actions/__tests__/getCurrentOrganizationAction.test.ts
+++ /dev/null
@@ -1,112 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-// src/server/actions/__tests__/getCurrentOrganizationAction.test.ts
-import {describe, it, expect, vi, beforeEach, afterEach, type Mock} from 'vitest';
-
-// --- Import SUT and mocked deps ---
-import getClient from '../../getClient';
-import getCurrentOrganizationAction from '../getCurrentOrganizationAction';
-
-// --- Mock client factory BEFORE importing SUT ---
-vi.mock('../../getClient', () => ({
-  default: vi.fn(),
-}));
-
-// A light org shape for testing (only fields we assert on)
-interface Org {
-  id: string;
-  name: string;
-  orgHandle?: string;
-}
-
-describe('getCurrentOrganizationAction', () => {
-  type ActionResult = Awaited<ReturnType<typeof getCurrentOrganizationAction>>;
-
-  const mockClient: {getCurrentOrganization: ReturnType<typeof vi.fn>} = {
-    getCurrentOrganization: vi.fn(),
-  };
-
-  const sessionId = 'sess-123';
-  const org: Org = {id: 'org-001', name: 'Alpha', orgHandle: 'alpha'};
-
-  beforeEach(() => {
-    vi.resetAllMocks();
-    (getClient as unknown as Mock).mockReturnValue(mockClient);
-  });
-
-  afterEach(() => {
-    vi.restoreAllMocks();
-  });
-
-  it('returns success with organization when upstream succeeds', async () => {
-    mockClient.getCurrentOrganization.mockResolvedValueOnce(org);
-
-    const result: ActionResult = await getCurrentOrganizationAction(sessionId);
-
-    expect(getClient).toHaveBeenCalledTimes(1);
-    expect(mockClient.getCurrentOrganization).toHaveBeenCalledWith(sessionId);
-
-    expect(result.success).toBe(true);
-    expect(result.error).toBeNull();
-    expect(result.data.organization).toEqual(org);
-  });
-
-  it('should pass through the provided sessionId even if it is an empty string', async () => {
-    mockClient.getCurrentOrganization.mockResolvedValueOnce(org);
-
-    const result: ActionResult = await getCurrentOrganizationAction('');
-
-    expect(mockClient.getCurrentOrganization).toHaveBeenCalledWith('');
-    expect(result.success).toBe(true);
-    expect(result.data.organization).toEqual(org);
-  });
-
-  it('should return failure shape when client.getCurrentOrganization rejects', async () => {
-    mockClient.getCurrentOrganization.mockRejectedValueOnce(new Error('upstream down'));
-
-    const result: ActionResult = await getCurrentOrganizationAction(sessionId);
-
-    expect(result.success).toBe(false);
-    expect(result.error).toBe('Failed to get the current organization');
-    // Matches the function’s failure payload shape
-    expect(result.data).toEqual({user: {}});
-  });
-
-  it('should return failure shape when ThunderIDNextClient.getInstance throws', async () => {
-    (getClient as unknown as Mock).mockImplementationOnce(() => {
-      throw new Error('factory failed');
-    });
-
-    const result: ActionResult = await getCurrentOrganizationAction(sessionId);
-
-    expect(result.success).toBe(false);
-    expect(result.error).toBe('Failed to get the current organization');
-    expect(result.data).toEqual({user: {}});
-  });
-
-  it('should not mutate the organization object returned by upstream', async () => {
-    const upstreamOrg: Org & {extra: {nested: boolean}} = {...org, extra: {nested: true}};
-    mockClient.getCurrentOrganization.mockResolvedValueOnce(upstreamOrg);
-
-    const result: ActionResult = await getCurrentOrganizationAction(sessionId);
-
-    // exact deep equality: whatever upstream returns is passed through
-    expect(result.data.organization).toEqual(upstreamOrg);
-  });
-});
diff --git a/packages/nextjs/src/server/actions/__tests__/getMyOrganizations.test.ts b/packages/nextjs/src/server/actions/__tests__/getMyOrganizations.test.ts
deleted file mode 100644
index 2a5f7c8..0000000
--- a/packages/nextjs/src/server/actions/__tests__/getMyOrganizations.test.ts
+++ /dev/null
@@ -1,211 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-// src/server/actions/__tests__/getMyOrganizations.test.ts
-import {ThunderIDAPIError, Organization} from '@thunderid/node';
-import {describe, it, expect, vi, beforeEach, afterEach, type Mock} from 'vitest';
-
-// --- Import SUT and mocked deps ---
-import getClient from '../../getClient';
-import getMyOrganizations from '../getMyOrganizations';
-import getSessionId from '../getSessionId';
-
-// --- Mocks (declare BEFORE importing the SUT) ---
-vi.mock('../../getClient', () => ({
-  default: vi.fn(),
-}));
-
-// Mock the dynamically-imported module that SUT calls as: import('./getSessionId')
-vi.mock('../getSessionId', () => ({
-  default: vi.fn(),
-}));
-
-describe('getMyOrganizations (Next.js server action)', () => {
-  const mockClient: {getAccessToken: ReturnType<typeof vi.fn>; getMyOrganizations: ReturnType<typeof vi.fn>} = {
-    getAccessToken: vi.fn(),
-    getMyOrganizations: vi.fn(),
-  };
-
-  const options: {filter: string; limit: number} = {filter: 'type eq "TENANT"', limit: 25};
-  const orgs: Organization[] = [
-    {id: 'org-1', name: 'Alpha', orgHandle: 'alpha'},
-    {id: 'org-2', name: 'Beta', orgHandle: 'beta'},
-  ];
-
-  beforeEach(() => {
-    vi.resetAllMocks();
-    (getClient as unknown as Mock).mockReturnValue(mockClient);
-    (getSessionId as unknown as Mock).mockResolvedValue('sess-abc');
-    mockClient.getAccessToken.mockResolvedValue('atk-123');
-    mockClient.getMyOrganizations.mockResolvedValue(orgs);
-    vi.spyOn(console, 'error').mockImplementation(() => {});
-  });
-
-  afterEach(() => {
-    vi.restoreAllMocks();
-  });
-
-  it('should return organizations when sessionId is provided (no getSessionId fallback)', async () => {
-    const result: Organization[] = await getMyOrganizations(options, 'sess-123');
-
-    expect(getClient).toHaveBeenCalledTimes(1);
-    expect(getSessionId).not.toHaveBeenCalled();
-    expect(mockClient.getAccessToken).toHaveBeenCalledWith('sess-123');
-    expect(mockClient.getMyOrganizations).toHaveBeenCalledWith(options, 'sess-123');
-    expect(result).toEqual(orgs);
-  });
-
-  it('should fall back to getSessionId when sessionId is undefined', async () => {
-    const result: Organization[] = await getMyOrganizations(options, undefined);
-
-    expect(getSessionId).toHaveBeenCalledTimes(1);
-    expect(mockClient.getAccessToken).toHaveBeenCalledWith('sess-abc');
-    expect(mockClient.getMyOrganizations).toHaveBeenCalledWith(options, 'sess-abc');
-    expect(result).toEqual(orgs);
-  });
-
-  it('should fall back to getSessionId when sessionId is null', async () => {
-    const result: Organization[] = await getMyOrganizations(options, null as unknown as string);
-
-    expect(getSessionId).toHaveBeenCalledTimes(1);
-    expect(mockClient.getAccessToken).toHaveBeenCalledWith('sess-abc');
-    expect(mockClient.getMyOrganizations).toHaveBeenCalledWith(options, 'sess-abc');
-    expect(result).toEqual(orgs);
-  });
-
-  it('should treat empty string sessionId as falsy and calls getSessionId', async () => {
-    const result: Organization[] = await getMyOrganizations(options, '');
-
-    expect(getSessionId).toHaveBeenCalledTimes(1);
-    expect(mockClient.getAccessToken).toHaveBeenCalledWith('sess-abc');
-    expect(mockClient.getMyOrganizations).toHaveBeenCalledWith(options, 'sess-abc');
-    expect(result).toEqual(orgs);
-  });
-
-  it('should pass through undefined options', async () => {
-    const result: Organization[] = await getMyOrganizations(undefined, 'sess-123');
-
-    expect(mockClient.getMyOrganizations).toHaveBeenCalledWith(undefined, 'sess-123');
-    expect(result).toEqual(orgs);
-  });
-
-  it('should throw ThunderIDAPIError(401) when no session can be resolved', async () => {
-    (getSessionId as unknown as Mock).mockResolvedValueOnce('');
-
-    await expect(getMyOrganizations(options, undefined)).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining('Failed to get the organizations for the user: No session ID available'),
-      statusCode: 401,
-    });
-
-    // Should fail before calling client methods
-    expect(mockClient.getAccessToken).not.toHaveBeenCalled();
-    expect(mockClient.getMyOrganizations).not.toHaveBeenCalled();
-  });
-
-  it('should throw ThunderIDAPIError(401) when access token resolves to undefined (not signed in)', async () => {
-    mockClient.getAccessToken.mockResolvedValueOnce(undefined);
-
-    await expect(getMyOrganizations(options, 'sess-123')).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining(
-        'Failed to get the organizations for the user: User is not signed in - access token retrieval failed',
-      ),
-      statusCode: 401,
-    });
-
-    expect(mockClient.getAccessToken).toHaveBeenCalledWith('sess-123');
-    // eslint-disable-next-line no-console
-    expect(console.error).toHaveBeenCalled(); // inner catch logs
-    expect(mockClient.getMyOrganizations).not.toHaveBeenCalled();
-  });
-
-  it('should treat empty-string access token as not signed in (401)', async () => {
-    mockClient.getAccessToken.mockResolvedValueOnce('');
-
-    await expect(getMyOrganizations(options, 'sess-123')).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining(
-        'Failed to get the organizations for the user: User is not signed in - access token retrieval failed',
-      ),
-      statusCode: 401,
-    });
-
-    // eslint-disable-next-line no-console
-    expect(console.error).toHaveBeenCalled();
-    expect(mockClient.getMyOrganizations).not.toHaveBeenCalled();
-  });
-
-  it('should throw ThunderIDAPIError(401) when getAccessToken throws (e.g., upstream failure)', async () => {
-    mockClient.getAccessToken.mockRejectedValueOnce(new Error('token endpoint down'));
-
-    await expect(getMyOrganizations(options, 'sess-123')).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining(
-        'Failed to get the organizations for the user: User is not signed in - access token retrieval failed',
-      ),
-      statusCode: 401,
-    });
-
-    // eslint-disable-next-line no-console
-    expect(console.error).toHaveBeenCalled();
-    expect(mockClient.getMyOrganizations).not.toHaveBeenCalled();
-  });
-
-  it('should wrap an ThunderIDAPIError from client.getMyOrganizations, preserving statusCode', async () => {
-    const upstream: ThunderIDAPIError = new ThunderIDAPIError('Upstream failed', 'ORG_LIST_503', 'server', 503);
-    mockClient.getMyOrganizations.mockRejectedValueOnce(upstream);
-
-    await expect(getMyOrganizations(options, 'sess-123')).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining('Failed to get the organizations for the user: Upstream failed'),
-      statusCode: 503,
-    });
-  });
-
-  it('should wrap a generic Error from client.getMyOrganizations with undefined statusCode', async () => {
-    mockClient.getMyOrganizations.mockRejectedValueOnce(new Error('network down'));
-
-    await expect(getMyOrganizations(options, 'sess-123')).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining('Failed to get the organizations for the user: network down'),
-      statusCode: undefined,
-    });
-  });
-
-  it('should wrap an error thrown by ThunderIDNextClient.getInstance()', async () => {
-    (getClient as unknown as Mock).mockImplementationOnce(() => {
-      throw new Error('factory failed');
-    });
-
-    await expect(getMyOrganizations(options, 'sess-123')).rejects.toMatchObject({
-      constructor: ThunderIDAPIError,
-      message: expect.stringContaining('Failed to get the organizations for the user: factory failed'),
-      statusCode: undefined,
-    });
-  });
-
-  it('should handle minimal call: no options, undefined sessionId -> resolves via getSessionId and succeeds', async () => {
-    const result: Organization[] = await getMyOrganizations();
-
-    expect(getSessionId).toHaveBeenCalledTimes(1);
-    expect(mockClient.getAccessToken).toHaveBeenCalledWith('sess-abc');
-    expect(mockClient.getMyOrganizations).toHaveBeenCalledWith(undefined, 'sess-abc');
-    expect(result).toEqual(orgs);
-  });
-});
diff --git a/packages/nextjs/src/server/actions/__tests__/getOrganizationAction.test.ts b/packages/nextjs/src/server/actions/__tests__/getOrganizationAction.test.ts
deleted file mode 100644
index 446bcad..0000000
--- a/packages/nextjs/src/server/actions/__tests__/getOrganizationAction.test.ts
+++ /dev/null
@@ -1,126 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {describe, it, expect, vi, beforeEach, afterEach, type Mock} from 'vitest';
-
-// Import SUT and mocked deps
-import getClient from '../../getClient';
-import getOrganizationAction from '../getOrganizationAction';
-
-// Mock client factory BEFORE importing the SUT
-vi.mock('../../getClient', () => ({
-  default: vi.fn(),
-}));
-
-// Minimal shape for testing; add fields only if you assert on them
-interface OrganizationDetails {
-  id: string;
-  name: string;
-  orgHandle?: string;
-}
-
-type ActionResult = Awaited<ReturnType<typeof getOrganizationAction>>;
-
-describe('getOrganizationAction', () => {
-  const mockClient: {getOrganization: ReturnType<typeof vi.fn>} = {
-    getOrganization: vi.fn(),
-  };
-
-  const orgId = 'org-001';
-  const sessionId = 'sess-123';
-  const org: OrganizationDetails = {id: orgId, name: 'Alpha', orgHandle: 'alpha'};
-
-  beforeEach(() => {
-    vi.resetAllMocks();
-    (getClient as unknown as Mock).mockReturnValue(mockClient);
-  });
-
-  afterEach(() => {
-    vi.restoreAllMocks();
-  });
-
-  it('should return success with organization when upstream succeeds', async () => {
-    mockClient.getOrganization.mockResolvedValueOnce(org);
-
-    const result: ActionResult = await getOrganizationAction(orgId, sessionId);
-
-    expect(getClient).toHaveBeenCalledTimes(1);
-    expect(mockClient.getOrganization).toHaveBeenCalledWith(orgId, sessionId);
-
-    expect(result).toEqual({
-      data: {organization: org},
-      error: null,
-      success: true,
-    });
-  });
-
-  it('should pass through empty-string organizationId and sessionId (documents current behavior)', async () => {
-    mockClient.getOrganization.mockResolvedValueOnce(org);
-
-    const result: ActionResult = await getOrganizationAction('', '');
-
-    expect(mockClient.getOrganization).toHaveBeenCalledWith('', '');
-    expect(result.success).toBe(true);
-    expect(result.data.organization).toEqual(org);
-  });
-
-  it('should return failure shape when client.getOrganization rejects', async () => {
-    mockClient.getOrganization.mockRejectedValueOnce(new Error('upstream down'));
-
-    const result: ActionResult = await getOrganizationAction(orgId, sessionId);
-
-    expect(result).toEqual({
-      data: {user: {}},
-      error: 'Failed to get organization',
-      success: false,
-    });
-  });
-
-  it('should return failure shape when ThunderIDNextClient.getInstance throws', async () => {
-    (getClient as unknown as Mock).mockImplementationOnce(() => {
-      throw new Error('factory failed');
-    });
-
-    const result: ActionResult = await getOrganizationAction(orgId, sessionId);
-
-    expect(result).toEqual({
-      data: {user: {}},
-      error: 'Failed to get organization',
-      success: false,
-    });
-  });
-
-  it('should return failure shape when client rejects with a non-Error value', async () => {
-    mockClient.getOrganization.mockRejectedValueOnce('bad');
-    const result: ActionResult = await getOrganizationAction(orgId, sessionId);
-    expect(result).toEqual({
-      data: {user: {}},
-      error: 'Failed to get organization',
-      success: false,
-    });
-  });
-
-  it('should not mutate the organization object returned by upstream', async () => {
-    const upstreamOrg: OrganizationDetails & {extra: {nested: boolean}} = {...org, extra: {nested: true}};
-    mockClient.getOrganization.mockResolvedValueOnce(upstreamOrg);
-
-    const result: ActionResult = await getOrganizationAction(orgId, sessionId);
-
-    expect(result.data.organization).toEqual(upstreamOrg);
-  });
-});
diff --git a/packages/nextjs/src/server/actions/createOrganization.ts b/packages/nextjs/src/server/actions/createOrganization.ts
deleted file mode 100644
index 1c9ab69..0000000
--- a/packages/nextjs/src/server/actions/createOrganization.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use server';
-
-import {CreateOrganizationPayload, Organization, ThunderIDAPIError} from '@thunderid/node';
-import getSessionId from './getSessionId';
-import getClient from '../getClient';
-
-/**
- * Server action to create an organization.
- */
-const createOrganization = async (payload: CreateOrganizationPayload, sessionId: string): Promise<Organization> => {
-  try {
-    const client = getClient();
-    return await client.createOrganization(payload, sessionId ?? (await getSessionId())!);
-  } catch (error) {
-    throw new ThunderIDAPIError(
-      `Failed to create the organization: ${error instanceof Error ? error.message : String(error)}`,
-      'createOrganization-ServerActionError-001',
-      'nextjs',
-      error instanceof ThunderIDAPIError ? error.statusCode : undefined,
-    );
-  }
-};
-
-export default createOrganization;
diff --git a/packages/nextjs/src/server/actions/getAllOrganizations.ts b/packages/nextjs/src/server/actions/getAllOrganizations.ts
deleted file mode 100644
index d520538..0000000
--- a/packages/nextjs/src/server/actions/getAllOrganizations.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use server';
-
-import {AllOrganizationsApiResponse, ThunderIDAPIError} from '@thunderid/node';
-import getSessionId from './getSessionId';
-import getClient from '../getClient';
-
-/**
- * Server action to get organizations.
- */
-const getAllOrganizations = async (options?: any, sessionId?: string): Promise<AllOrganizationsApiResponse> => {
-  try {
-    const client = getClient();
-    return await client.getAllOrganizations(options, sessionId ?? (await getSessionId())!);
-  } catch (error) {
-    throw new ThunderIDAPIError(
-      `Failed to get all the organizations for the user: ${error instanceof Error ? error.message : String(error)}`,
-      'getAllOrganizations-ServerActionError-001',
-      'nextjs',
-      error instanceof ThunderIDAPIError ? error.statusCode : undefined,
-    );
-  }
-};
-
-export default getAllOrganizations;
diff --git a/packages/nextjs/src/server/actions/getCurrentOrganizationAction.ts b/packages/nextjs/src/server/actions/getCurrentOrganizationAction.ts
deleted file mode 100644
index 58390cb..0000000
--- a/packages/nextjs/src/server/actions/getCurrentOrganizationAction.ts
+++ /dev/null
@@ -1,49 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use server';
-
-import {Organization} from '@thunderid/node';
-import getClient from '../getClient';
-
-/**
- * Server action to create an organization.
- */
-const getCurrentOrganizationAction = async (
-  sessionId: string,
-): Promise<{
-  data: {organization?: Organization; user?: Record<string, unknown>};
-  error: string | null;
-  success: boolean;
-}> => {
-  try {
-    const client = getClient();
-    const organization: Organization = (await client.getCurrentOrganization(sessionId))!;
-    return {data: {organization}, error: null, success: true};
-  } catch (error) {
-    return {
-      data: {
-        user: {},
-      },
-      error: 'Failed to get the current organization',
-      success: false,
-    };
-  }
-};
-
-export default getCurrentOrganizationAction;
diff --git a/packages/nextjs/src/server/actions/getMyOrganizations.ts b/packages/nextjs/src/server/actions/getMyOrganizations.ts
deleted file mode 100644
index 6300fcf..0000000
--- a/packages/nextjs/src/server/actions/getMyOrganizations.ts
+++ /dev/null
@@ -1,82 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use server';
-
-import {ThunderIDAPIError, Organization} from '@thunderid/node';
-import getClient from '../getClient';
-
-/**
- * Server action to get organizations.
- */
-const getMyOrganizations = async (options?: any, sessionId?: string): Promise<Organization[]> => {
-  try {
-    const client = getClient();
-
-    // Get session ID if not provided
-    let resolvedSessionId: string | undefined = sessionId;
-    if (!resolvedSessionId) {
-      // Import getSessionId locally to avoid circular dependencies
-      const {default: getSessionId} = await import('./getSessionId');
-      resolvedSessionId = await getSessionId();
-    }
-
-    if (!resolvedSessionId) {
-      throw new ThunderIDAPIError(
-        'No session ID available for fetching organizations',
-        'getMyOrganizations-SessionError-001',
-        'nextjs',
-        401,
-      );
-    }
-
-    // Check if user is signed in by trying to get access token
-    try {
-      const accessToken: string = await client.getAccessToken(resolvedSessionId);
-
-      if (!accessToken) {
-        throw new ThunderIDAPIError(
-          'No access token available - user is not signed in',
-          'getMyOrganizations-NoAccessToken-001',
-          'nextjs',
-          401,
-        );
-      }
-    } catch (error) {
-      // eslint-disable-next-line no-console
-      console.error('[getMyOrganizations] Failed to get access token:', error);
-      throw new ThunderIDAPIError(
-        'User is not signed in - access token retrieval failed',
-        'getMyOrganizations-NotSignedIn-001',
-        'nextjs',
-        401,
-      );
-    }
-
-    return await client.getMyOrganizations(options, resolvedSessionId);
-  } catch (error) {
-    throw new ThunderIDAPIError(
-      `Failed to get the organizations for the user: ${error instanceof Error ? error.message : String(error)}`,
-      'getMyOrganizations-ServerActionError-001',
-      'nextjs',
-      error instanceof ThunderIDAPIError ? error.statusCode : undefined,
-    );
-  }
-};
-
-export default getMyOrganizations;
diff --git a/packages/nextjs/src/server/actions/getOrganizationAction.ts b/packages/nextjs/src/server/actions/getOrganizationAction.ts
deleted file mode 100644
index a15e2cd..0000000
--- a/packages/nextjs/src/server/actions/getOrganizationAction.ts
+++ /dev/null
@@ -1,50 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use server';
-
-import {OrganizationDetails} from '@thunderid/node';
-import getClient from '../getClient';
-
-/**
- * Server action to create an organization.
- */
-const getOrganizationAction = async (
-  organizationId: string,
-  sessionId: string,
-): Promise<{
-  data: {organization?: OrganizationDetails; user?: Record<string, unknown>};
-  error: string | null;
-  success: boolean;
-}> => {
-  try {
-    const client = getClient();
-    const organization: OrganizationDetails = await client.getOrganization(organizationId, sessionId);
-    return {data: {organization}, error: null, success: true};
-  } catch (error) {
-    return {
-      data: {
-        user: {},
-      },
-      error: 'Failed to get organization',
-      success: false,
-    };
-  }
-};
-
-export default getOrganizationAction;
diff --git a/packages/nextjs/src/server/actions/switchOrganization.ts b/packages/nextjs/src/server/actions/switchOrganization.ts
deleted file mode 100644
index 1a043a3..0000000
--- a/packages/nextjs/src/server/actions/switchOrganization.ts
+++ /dev/null
@@ -1,90 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-'use server';
-
-import {Organization, ThunderIDAPIError, IdToken, TokenResponse} from '@thunderid/node';
-import {cookies} from 'next/headers';
-import getSessionId from './getSessionId';
-import {ThunderIDNextConfig} from '../../models/config';
-import logger from '../../utils/logger';
-import SessionManager from '../../utils/SessionManager';
-import getClient from '../getClient';
-
-type RequestCookies = Awaited<ReturnType<typeof cookies>>;
-
-/**
- * Server action to switch organization.
- */
-const switchOrganization = async (
-  organization: Organization,
-  sessionId: string | undefined,
-): Promise<TokenResponse | Response> => {
-  try {
-    const cookieStore: RequestCookies = await cookies();
-    const client = getClient();
-    const resolvedSessionId: string = sessionId ?? (await getSessionId())!;
-    const response: TokenResponse | Response = await client.switchOrganization(organization, resolvedSessionId);
-
-    const {revalidatePath} = await import('next/cache');
-    revalidatePath('/');
-
-    if (response && (response as TokenResponse).accessToken) {
-      const tokenResponse: TokenResponse = response as TokenResponse;
-      const idToken: IdToken = await client.getDecodedIdToken(resolvedSessionId, tokenResponse.idToken);
-      const userIdFromToken: string = idToken.sub;
-      const organizationId: string | undefined = (idToken['user_org'] || idToken['organization_id']) as
-        | string
-        | undefined;
-      const config: ThunderIDNextConfig = await client.getConfiguration();
-      const sessionCookieExpiryTime: number = SessionManager.resolveSessionCookieExpiry(
-        config.sessionCookie?.expiryTime,
-      );
-      const expiresIn: number = parseInt(tokenResponse.expiresIn, 10);
-
-      const sessionToken: string = await SessionManager.createSessionToken(
-        tokenResponse.accessToken,
-        userIdFromToken,
-        resolvedSessionId,
-        tokenResponse.scope,
-        expiresIn,
-        tokenResponse.refreshToken ?? '',
-        organizationId,
-      );
-
-      logger.debug('[switchOrganization] Session token created successfully.');
-
-      cookieStore.set(
-        SessionManager.getSessionCookieName(),
-        sessionToken,
-        SessionManager.getSessionCookieOptions(sessionCookieExpiryTime),
-      );
-    }
-
-    return response;
-  } catch (error) {
-    throw new ThunderIDAPIError(
-      `Failed to switch the organizations: ${error instanceof Error ? error.message : String(JSON.stringify(error))}`,
-      'switchOrganization-ServerActionError-001',
-      'nextjs',
-      error instanceof ThunderIDAPIError ? error.statusCode : undefined,
-    );
-  }
-};
-
-export default switchOrganization;
diff --git a/packages/nuxt/src/index.ts b/packages/nuxt/src/index.ts
index 88eb41d..d067673 100644
--- a/packages/nuxt/src/index.ts
+++ b/packages/nuxt/src/index.ts
@@ -26,7 +26,7 @@ export type {ThunderIDNuxtConfig, ThunderIDSessionPayload, ThunderIDAuthState} f
 // `useThunderID`. The rest are re-exports of `@thunderid/vue` composables —
 // their contexts are mounted by `<ThunderIDRoot>` (see runtime/components).
 export {useThunderID} from './runtime/composables/useThunderID';
-export {useUser, useOrganization, useFlow, useFlowMeta, useTheme} from '@thunderid/vue';
+export {useUser, useFlow, useFlowMeta, useTheme} from '@thunderid/vue';
 export {useI18n as useThunderIDI18n} from '@thunderid/vue';
 
 // ── Components ─────────────────────────────────────────────────────────────
diff --git a/packages/nuxt/src/module.ts b/packages/nuxt/src/module.ts
index e115e0d..1436365 100644
--- a/packages/nuxt/src/module.ts
+++ b/packages/nuxt/src/module.ts
@@ -174,33 +174,6 @@ export default defineNuxtModule<ThunderIDNuxtConfig>({
         method: 'patch' as const,
         route: '/api/auth/user/profile',
       },
-      // ── Organisations ─────────────────────────────────────────────────
-      {
-        handler: resolve('./runtime/server/routes/auth/organizations/index.get'),
-        route: '/api/auth/organizations',
-      },
-      {
-        handler: resolve('./runtime/server/routes/auth/organizations/index.post'),
-        method: 'post' as const,
-        route: '/api/auth/organizations',
-      },
-      {
-        handler: resolve('./runtime/server/routes/auth/organizations/me.get'),
-        route: '/api/auth/organizations/me',
-      },
-      {
-        handler: resolve('./runtime/server/routes/auth/organizations/current.get'),
-        route: '/api/auth/organizations/current',
-      },
-      {
-        handler: resolve('./runtime/server/routes/auth/organizations/id.get'),
-        route: '/api/auth/organizations/:id',
-      },
-      {
-        handler: resolve('./runtime/server/routes/auth/organizations/switch.post'),
-        method: 'post' as const,
-        route: '/api/auth/organizations/switch',
-      },
       // ── Branding ──────────────────────────────────────────────────────
       {handler: resolve('./runtime/server/routes/auth/branding/branding.get'), route: '/api/auth/branding'},
     ];
@@ -227,7 +200,6 @@ export default defineNuxtModule<ThunderIDNuxtConfig>({
       {from: resolve('./runtime/composables/useThunderID'), name: 'useThunderID'},
       // Composables from @thunderid/vue — auto-imported directly, no local wrappers
       {from: '@thunderid/vue', name: 'useUser'},
-      {from: '@thunderid/vue', name: 'useOrganization'},
       {from: '@thunderid/vue', name: 'useFlow'},
       {from: '@thunderid/vue', name: 'useFlowMeta'},
       {from: '@thunderid/vue', name: 'useTheme'},
@@ -256,9 +228,9 @@ export default defineNuxtModule<ThunderIDNuxtConfig>({
     // This mirrors the Next.js SDK pattern where Base components come from
     // @thunderid/react and host-specific containers live in the Next.js package.
     //
-    // NOTE: Composables (useUser, useOrganization, useTheme,
-    // useFlow, useI18n) remain direct re-exports from @thunderid/vue via
-    // addImports above — only the components need Nuxt wrappers.
+    // NOTE: Composables (useUser, useTheme, useFlow, useI18n) remain direct
+    // re-exports from @thunderid/vue via addImports above — only the components
+    // need Nuxt wrappers.
 
     // ── Control flow ────────────────────────────────────────────────────────
     addComponent({filePath: resolve('./runtime/components/control/SignedIn'), name: 'ThunderIDSignedIn'});
@@ -279,25 +251,6 @@ export default defineNuxtModule<ThunderIDNuxtConfig>({
     addComponent({filePath: resolve('./runtime/components/user/UserProfile'), name: 'ThunderIDUserProfile'});
     addComponent({filePath: resolve('./runtime/components/user/UserDropdown'), name: 'ThunderIDUserDropdown'});
 
-    // ── Organization ─────────────────────────────────────────────────────────
-    addComponent({filePath: resolve('./runtime/components/organization/Organization'), name: 'ThunderIDOrganization'});
-    addComponent({
-      filePath: resolve('./runtime/components/organization/OrganizationProfile'),
-      name: 'ThunderIDOrganizationProfile',
-    });
-    addComponent({
-      filePath: resolve('./runtime/components/organization/OrganizationSwitcher'),
-      name: 'ThunderIDOrganizationSwitcher',
-    });
-    addComponent({
-      filePath: resolve('./runtime/components/organization/OrganizationList'),
-      name: 'ThunderIDOrganizationList',
-    });
-    addComponent({
-      filePath: resolve('./runtime/components/organization/CreateOrganization'),
-      name: 'ThunderIDCreateOrganization',
-    });
-
     // ── Auth callback ────────────────────────────────────────────────────────
     addComponent({filePath: resolve('./runtime/components/auth/Callback'), name: 'ThunderIDCallback'});
 
diff --git a/packages/nuxt/src/runtime/components/ThunderIDRoot.ts b/packages/nuxt/src/runtime/components/ThunderIDRoot.ts
index 19acaf0..08d9304 100644
--- a/packages/nuxt/src/runtime/components/ThunderIDRoot.ts
+++ b/packages/nuxt/src/runtime/components/ThunderIDRoot.ts
@@ -18,9 +18,6 @@
 
 import {generateFlattenedUserProfile} from '@thunderid/browser';
 import type {
-  AllOrganizationsApiResponse,
-  CreateOrganizationPayload,
-  Organization,
   UpdateMeProfileConfig,
   User,
   UserProfile,
@@ -29,7 +26,6 @@ import {
   FlowMetaProvider,
   FlowProvider,
   I18nProvider,
-  OrganizationProvider,
   ThemeProvider,
   UserProvider,
 } from '@thunderid/vue';
@@ -49,14 +45,11 @@ import {useState, useRuntimeConfig} from '#imports';
  * - {@link FlowProvider}
  * - {@link UserProvider}      ← `profile`, `flattenedProfile`, `schemas`,
  *                               `updateProfile`, `revalidateProfile`, `onUpdateProfile`
- * - {@link OrganizationProvider} ← `currentOrganization`, `myOrganizations`,
- *                                  `onOrganizationSwitch`, `getAllOrganizations`,
- *                                  `revalidateMyOrganizations`
  *
  * The `THUNDERID_KEY` (config + auth state + actions) is still provided at the
  * app level by the Nuxt plugin; this component only supplies the auxiliary
- * provider contexts so downstream composables (`useUser`, `useOrganization`,
- * `useTheme`, `useThunderIDI18n`) receive real data.
+ * provider contexts so downstream composables (`useUser`, `useTheme`,
+ * `useThunderIDI18n`) receive real data.
  *
  * @example
  * ```vue
@@ -73,8 +66,6 @@ const ThunderIDRoot: Component = defineComponent({
   setup(_props: Record<string, unknown>, {slots}: SetupContext): () => VNode {
     // ── Read SSR-hydrated state keys (seeded by the Nuxt plugin) ────────────
     const userProfileState: Ref<UserProfile | null> = useState<UserProfile | null>('thunderid:user-profile');
-    const currentOrgState: Ref<Organization | null> = useState<Organization | null>('thunderid:current-org');
-    const myOrgsState: Ref<Organization[]> = useState<Organization[]>('thunderid:my-orgs');
     // Used by onUpdateProfile to keep the top-level auth user claim in sync.
     const authState: Ref<ThunderIDAuthState> = useState<ThunderIDAuthState>('thunderid:auth');
 
@@ -88,7 +79,6 @@ const ThunderIDRoot: Component = defineComponent({
     // Gate flags — mirror the same checks in thunderid-ssr.ts so client props
     // always agree with what the Nitro plugin decided to fetch server-side.
     const shouldFetchProfile: boolean = prefs?.user?.fetchUserProfile !== false;
-    const shouldFetchOrgs: boolean = prefs?.user?.fetchOrganizations !== false;
     // Defaults to 'light' — matches the Vue SDK's ThunderIDProvider, which
     // passes no mode and therefore uses ThemeProvider's `DEFAULT_THEME`.
     const themeMode: string = prefs?.theme?.mode ?? 'light';
@@ -160,52 +150,6 @@ const ThunderIDRoot: Component = defineComponent({
       }
     };
 
-    /**
-     * Token-exchange org switch via the `/api/auth/organizations/switch` Nitro route.
-     */
-    const onOrganizationSwitch = async (organization: Organization): Promise<any> =>
-      $fetch('/api/auth/organizations/switch', {body: {organization}, method: 'POST'});
-
-    /**
-     * Paginated org list via the `/api/auth/organizations` Nitro route.
-     */
-    const getAllOrganizations = async (): Promise<AllOrganizationsApiResponse> =>
-      $fetch<AllOrganizationsApiResponse>('/api/auth/organizations');
-
-    /**
-     * Refresh the user's org membership list and update local state so
-     * `useOrganization().myOrganizations` stays reactive.
-     */
-    const revalidateMyOrganizations = async (): Promise<Organization[]> => {
-      try {
-        const res: Organization[] = await $fetch<Organization[]>('/api/auth/organizations/me');
-        myOrgsState.value = res ?? [];
-        return myOrgsState.value;
-      } catch {
-        return myOrgsState.value;
-      }
-    };
-
-    /**
-     * Create a new sub-organisation via the `POST /api/auth/organizations` route.
-     */
-    const createOrganization = async (payload: CreateOrganizationPayload): Promise<Organization> =>
-      $fetch<Organization>('/api/auth/organizations', {body: payload, method: 'POST'});
-
-    /**
-     * Refresh the current organisation from the session's ID token claims
-     * and update local state so `useOrganization().currentOrganization` stays reactive.
-     */
-    const revalidateCurrentOrganization = async (): Promise<Organization | null> => {
-      try {
-        const res: Organization | null = await $fetch<Organization | null>('/api/auth/organizations/current');
-        currentOrgState.value = res ?? null;
-        return currentOrgState.value;
-      } catch {
-        return currentOrgState.value;
-      }
-    };
-
     // ── Render tree — mirrors ThunderIDClientProvider (Next.js) ─────────────
     //
     // FlowMetaProvider is mounted unconditionally with `enabled: false` (V1
@@ -251,32 +195,7 @@ const ThunderIDRoot: Component = defineComponent({
                                 updateProfile: shouldFetchProfile ? updateProfile : undefined,
                               },
                               {
-                                default: (): VNode | VNode[] | undefined =>
-                                  h(
-                                    OrganizationProvider,
-                                    {
-                                      // When fetchOrganizations is false pass empty
-                                      // values so the provider renders without org data.
-                                      createOrganization: shouldFetchOrgs
-                                        ? (createOrganization as any)
-                                        : undefined,
-                                      currentOrganization: shouldFetchOrgs ? currentOrgState.value : null,
-                                      getAllOrganizations: shouldFetchOrgs ? getAllOrganizations : undefined,
-                                      myOrganizations: shouldFetchOrgs ? myOrgsState.value : [],
-                                      onOrganizationSwitch: shouldFetchOrgs
-                                        ? (onOrganizationSwitch as any)
-                                        : undefined,
-                                      revalidateCurrentOrganization: shouldFetchOrgs
-                                        ? revalidateCurrentOrganization
-                                        : undefined,
-                                      revalidateMyOrganizations: shouldFetchOrgs
-                                        ? revalidateMyOrganizations
-                                        : undefined,
-                                    },
-                                    {
-                                      default: (): VNode | VNode[] | undefined => slots.default?.(),
-                                    },
-                                  ),
+                                default: (): VNode | VNode[] | undefined => slots.default?.(),
                               },
                             ),
                         }),
diff --git a/packages/nuxt/src/runtime/components/organization/CreateOrganization.ts b/packages/nuxt/src/runtime/components/organization/CreateOrganization.ts
deleted file mode 100644
index 5b539a3..0000000
--- a/packages/nuxt/src/runtime/components/organization/CreateOrganization.ts
+++ /dev/null
@@ -1,71 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {withVendorCSSClassPrefix} from '@thunderid/browser';
-import {BaseCreateOrganization} from '@thunderid/vue';
-import {type Component, type VNode, defineComponent, h} from 'vue';
-import {useOrganization} from '#imports';
-
-interface CreateOrganizationSetupProps {
-  className: string;
-  description: string;
-  title: string;
-}
-
-/**
- * Nuxt-specific CreateOrganization container.
- *
- * Reads `createOrganization` from `useOrganization()` (Nuxt auto-import,
- * re-exported from `@thunderid/vue`) and delegates rendering to
- * {@link BaseCreateOrganization} from `@thunderid/vue`.
- *
- * @example
- * ```vue
- * <ThunderIDCreateOrganization title="New Team" />
- * ```
- */
-const CreateOrganization: Component = defineComponent({
-  name: 'CreateOrganization',
-  props: {
-    className: {default: '', type: String},
-    description: {default: 'Create a new sub-organization.', type: String},
-    title: {default: 'Create Organization', type: String},
-  },
-  setup(props: CreateOrganizationSetupProps, {slots}: {slots: any}): () => VNode {
-    const {createOrganization} = useOrganization();
-
-    return (): VNode =>
-      h(
-        BaseCreateOrganization,
-        {
-          class: withVendorCSSClassPrefix('create-organization--styled'),
-          className: props.className,
-          description: props.description,
-          onCreate: createOrganization
-            ? async (name: string): Promise<void> => {
-                await createOrganization({description: '', name, parentId: '', type: 'TENANT'}, '');
-              }
-            : undefined,
-          title: props.title,
-        },
-        slots,
-      );
-  },
-});
-
-export default CreateOrganization;
diff --git a/packages/nuxt/src/runtime/components/organization/Organization.ts b/packages/nuxt/src/runtime/components/organization/Organization.ts
deleted file mode 100644
index 00f3da2..0000000
--- a/packages/nuxt/src/runtime/components/organization/Organization.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {type Component, type VNode, Fragment, defineComponent, h} from 'vue';
-import {useOrganization} from '#imports';
-
-/**
- * Nuxt-specific Organization control component.
- *
- * Exposes the current organization via a scoped slot. Renders the `fallback`
- * slot when no organization is selected.
- *
- * Uses `useOrganization()` from the Nuxt auto-import layer (re-exported from
- * `@thunderid/vue`) so it reads from the OrganizationProvider context.
- *
- * @example
- * ```vue
- * <ThunderIDOrganization>
- *   <template #default="{ organization }">
- *     <p>Current org: {{ organization.name }}</p>
- *   </template>
- *   <template #fallback><p>No organization selected.</p></template>
- * </ThunderIDOrganization>
- * ```
- */
-const Organization: Component = defineComponent({
-  name: 'Organization',
-  setup(_props: Record<string, unknown>, {slots}: {slots: any}): () => VNode | VNode[] | null {
-    const {currentOrganization} = useOrganization();
-
-    return (): VNode | VNode[] | null => {
-      if (!currentOrganization?.value) {
-        const fallback: VNode[] | undefined = slots.fallback?.();
-        return fallback ? h(Fragment, {}, fallback) : null;
-      }
-
-      const content: VNode[] | undefined = slots.default?.({organization: currentOrganization.value});
-      return content ? h(Fragment, {}, content) : null;
-    };
-  },
-});
-
-export default Organization;
diff --git a/packages/nuxt/src/runtime/components/organization/OrganizationList.ts b/packages/nuxt/src/runtime/components/organization/OrganizationList.ts
deleted file mode 100644
index 9e44d1a..0000000
--- a/packages/nuxt/src/runtime/components/organization/OrganizationList.ts
+++ /dev/null
@@ -1,67 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {type Organization as IOrganization, withVendorCSSClassPrefix} from '@thunderid/browser';
-import {BaseOrganizationList} from '@thunderid/vue';
-import {type Component, type VNode, defineComponent, h} from 'vue';
-import {useOrganization} from '#imports';
-
-/**
- * Nuxt-specific OrganizationList container.
- *
- * Reads organization list context from `useOrganization()` (Nuxt auto-import)
- * and delegates rendering to {@link BaseOrganizationList} from `@thunderid/vue`.
- *
- * Emits a `select` event with the chosen {@link IOrganization} before calling
- * `switchOrganization` so consumers can handle custom post-switch logic.
- *
- * @example
- * ```vue
- * <ThunderIDOrganizationList @select="handleOrgSelect" />
- * ```
- */
-const OrganizationList: Component = defineComponent({
-  emits: ['select'],
-  name: 'OrganizationList',
-  props: {
-    className: {default: '', type: String},
-  },
-  setup(props: {className: string}, {slots, emit}: {emit: any; slots: any}): () => VNode | VNode[] | null {
-    const {myOrganizations, isLoading, switchOrganization} = useOrganization();
-
-    const handleSelect = async (org: IOrganization): Promise<void> => {
-      emit('select', org);
-      await switchOrganization(org);
-    };
-
-    return (): VNode | VNode[] | null =>
-      h(
-        BaseOrganizationList,
-        {
-          class: withVendorCSSClassPrefix('organization-list--styled'),
-          className: props.className,
-          isLoading: isLoading?.value ?? false,
-          onSelect: handleSelect,
-          organizations: myOrganizations?.value ?? [],
-        },
-        slots,
-      );
-  },
-});
-
-export default OrganizationList;
diff --git a/packages/nuxt/src/runtime/components/organization/OrganizationProfile.ts b/packages/nuxt/src/runtime/components/organization/OrganizationProfile.ts
deleted file mode 100644
index 5d6bfd5..0000000
--- a/packages/nuxt/src/runtime/components/organization/OrganizationProfile.ts
+++ /dev/null
@@ -1,74 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {withVendorCSSClassPrefix} from '@thunderid/browser';
-import {BaseOrganizationProfile} from '@thunderid/vue';
-import {type Component, type PropType, type VNode, defineComponent, h} from 'vue';
-import {useOrganization} from '#imports';
-
-/**
- * Nuxt-specific OrganizationProfile container.
- *
- * Reads the current organization from `useOrganization()` (Nuxt auto-import,
- * re-exported from `@thunderid/vue`) and delegates rendering to
- * {@link BaseOrganizationProfile} from `@thunderid/vue`.
- *
- * @example
- * ```vue
- * <ThunderIDOrganizationProfile :editable="true" />
- * ```
- */
-const OrganizationProfile: Component = defineComponent({
-  name: 'OrganizationProfile',
-  props: {
-    className: {default: '', type: String},
-    editable: {default: false, type: Boolean},
-    onUpdate: {
-      default: undefined,
-      type: Function as PropType<(payload: Record<string, unknown>) => Promise<void>>,
-    },
-    title: {default: 'Organization Profile', type: String},
-  },
-  setup(
-    props: {
-      className: string;
-      editable: boolean;
-      onUpdate?: (payload: Record<string, unknown>) => Promise<void>;
-      title: string;
-    },
-    {slots}: {slots: any},
-  ): () => VNode | VNode[] | null {
-    const {currentOrganization} = useOrganization();
-
-    return (): VNode | VNode[] | null =>
-      h(
-        BaseOrganizationProfile,
-        {
-          class: withVendorCSSClassPrefix('organization-profile--styled'),
-          className: props.className,
-          editable: props.editable,
-          onUpdate: props.onUpdate,
-          organization: currentOrganization?.value ?? null,
-          title: props.title,
-        },
-        slots,
-      );
-  },
-});
-
-export default OrganizationProfile;
diff --git a/packages/nuxt/src/runtime/components/organization/OrganizationSwitcher.ts b/packages/nuxt/src/runtime/components/organization/OrganizationSwitcher.ts
deleted file mode 100644
index 2e1364c..0000000
--- a/packages/nuxt/src/runtime/components/organization/OrganizationSwitcher.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {withVendorCSSClassPrefix} from '@thunderid/browser';
-import {BaseOrganizationSwitcher} from '@thunderid/vue';
-import {type Component, type VNode, defineComponent, h} from 'vue';
-import {useOrganization} from '#imports';
-
-/**
- * Nuxt-specific OrganizationSwitcher container.
- *
- * Reads organization context from `useOrganization()` (Nuxt auto-import,
- * re-exported from `@thunderid/vue`) and delegates rendering to
- * {@link BaseOrganizationSwitcher} from `@thunderid/vue`.
- *
- * The `switchOrganization` action is provided by the OrganizationProvider
- * context set up by {@link ThunderIDRoot}, which ultimately calls the Nitro
- * `/api/auth/switch-org` route — no direct `window.location` usage.
- *
- * @example
- * ```vue
- * <ThunderIDOrganizationSwitcher />
- * ```
- */
-const OrganizationSwitcher: Component = defineComponent({
-  name: 'OrganizationSwitcher',
-  props: {
-    className: {default: '', type: String},
-  },
-  setup(props: {className: string}, {slots}: {slots: any}): () => VNode | VNode[] | null {
-    const {currentOrganization, myOrganizations, isLoading, switchOrganization} = useOrganization();
-
-    return (): VNode | VNode[] | null =>
-      h(
-        BaseOrganizationSwitcher,
-        {
-          class: withVendorCSSClassPrefix('organization-switcher--styled'),
-          className: props.className,
-          currentOrganization: currentOrganization?.value ?? null,
-          isLoading: isLoading?.value ?? false,
-          onSwitch: switchOrganization,
-          organizations: myOrganizations?.value ?? [],
-        },
-        slots,
-      );
-  },
-});
-
-export default OrganizationSwitcher;
diff --git a/packages/nuxt/src/runtime/errors/error-codes.ts b/packages/nuxt/src/runtime/errors/error-codes.ts
index 2f4b87d..8d3815e 100644
--- a/packages/nuxt/src/runtime/errors/error-codes.ts
+++ b/packages/nuxt/src/runtime/errors/error-codes.ts
@@ -33,9 +33,6 @@ export enum ErrorCode {
   // ── Security ───────────────────────────────────────────────────────
   OpenRedirectBlocked = 'security/open-redirect-blocked',
 
-  // ── Organization ───────────────────────────────────────────────────
-  OrganizationCreateFailed = 'organization/create-failed',
-  OrganizationSwitchFailed = 'organization/switch-failed',
   // ── Session ────────────────────────────────────────────────────────
   SessionExpired = 'session/expired',
   SessionInvalid = 'session/invalid',
diff --git a/packages/nuxt/src/runtime/plugins/thunderid.ts b/packages/nuxt/src/runtime/plugins/thunderid.ts
index fc8a043..c7c4d2a 100644
--- a/packages/nuxt/src/runtime/plugins/thunderid.ts
+++ b/packages/nuxt/src/runtime/plugins/thunderid.ts
@@ -17,7 +17,7 @@
  */
 
 import {getRedirectBasedSignUpUrl} from '@thunderid/browser';
-import type {Organization, UserProfile} from '@thunderid/node';
+import type {UserProfile} from '@thunderid/node';
 import {ThunderIDPlugin, THUNDERID_KEY} from '@thunderid/vue';
 import type {H3Event} from 'h3';
 import {computed} from 'vue';
@@ -42,8 +42,7 @@ import {defineNuxtPlugin, useState, useRequestEvent, useRuntimeConfig, navigateT
  *     `navigateTo` so redirects work on both server and client.
  *  3. **ThunderIDRoot** — register the wrapper component that mounts the rest
  *     of the provider tree (`I18nProvider`, `ThemeProvider`, `FlowProvider`,
- *     `UserProvider`, `OrganizationProvider`)
- *     so downstream composables receive real context values.
+ *     `UserProvider`) so downstream composables receive real context values.
  *  4. **ThunderIDPlugin (delegated)** — install the Vue SDK plugin in
  *     delegated mode so it skips browser-only initialisation (SSR-safe).
  */
@@ -95,8 +94,6 @@ export default defineNuxtPlugin((nuxtApp: NuxtApp) => {
     user: null,
   }));
   const userProfileState: Ref<UserProfile | null> = useState<UserProfile | null>('thunderid:user-profile', () => null);
-  const currentOrgState: Ref<Organization | null> = useState<Organization | null>('thunderid:current-org', () => null);
-  const myOrgsState: Ref<Organization[]> = useState<Organization[]>('thunderid:my-orgs', () => []);
 
   if (import.meta.server) {
     const event: H3Event | undefined = useRequestEvent();
@@ -110,8 +107,6 @@ export default defineNuxtPlugin((nuxtApp: NuxtApp) => {
         user: ssr.user,
       };
       userProfileState.value = ssr.userProfile;
-      currentOrgState.value = ssr.currentOrganization;
-      myOrgsState.value = ssr.myOrganizations;
     } else {
       // Backwards-compat: fall back to the legacy context shape (pre-Step-2 plugin).
       const ssrContext: {isSignedIn?: boolean; session?: {sub?: string}} | undefined = event?.context?.thunderid as
@@ -143,9 +138,6 @@ export default defineNuxtPlugin((nuxtApp: NuxtApp) => {
   // `user` is backed by the dedicated state key so ThunderIDRoot can read it
   // reactively without going through the THUNDERID_KEY indirection.
   const user: ComputedRef<ThunderIDAuthState['user'] | null> = computed(() => authState.value.user ?? null);
-  // `organization` reflects the SSR-resolved current org (hydrated from
-  // 'thunderid:current-org'). Kept readonly at the THUNDERID_KEY level.
-  const organizationRef: ComputedRef<Organization | null> = computed(() => currentOrgState.value);
 
   // ── 3. Action helpers (Nuxt-aware navigation) ───────────────────────────
   const signIn = async (options?: Record<string, unknown>): Promise<void> => {
@@ -213,7 +205,6 @@ export default defineNuxtPlugin((nuxtApp: NuxtApp) => {
     isInitialized,
     isLoading,
     isSignedIn,
-    organization: organizationRef,
     organizationHandle: publicConfig.organizationHandle,
     platform: undefined,
     reInitialize: async () => false,
@@ -226,7 +217,6 @@ export default defineNuxtPlugin((nuxtApp: NuxtApp) => {
     signUp,
     signUpUrl: publicConfig.signUpUrl,
     storage: undefined,
-    switchOrganization: noop,
     user,
   });
 
diff --git a/packages/nuxt/src/runtime/server/ThunderIDNuxtClient.ts b/packages/nuxt/src/runtime/server/ThunderIDNuxtClient.ts
index c7bd8f2..d341ca3 100644
--- a/packages/nuxt/src/runtime/server/ThunderIDNuxtClient.ts
+++ b/packages/nuxt/src/runtime/server/ThunderIDNuxtClient.ts
@@ -20,20 +20,12 @@ import {
   ThunderIDNodeClient,
   type AuthClientConfig,
   type IdToken,
-  type Organization,
-  type OrganizationDetails,
-  type CreateOrganizationPayload,
   type Storage,
   type TokenExchangeRequestConfig,
   type TokenResponse,
   type User,
   type UserProfile,
   type UpdateMeProfileConfig,
-  type AllOrganizationsApiResponse,
-  getMeOrganizations,
-  getAllOrganizations,
-  createOrganization,
-  getOrganization,
   type ExtendedAuthorizeRequestUrlParams,
   type SignUpOptions,
 } from '@thunderid/node';
@@ -172,96 +164,10 @@ class ThunderIDNuxtClient extends ThunderIDNodeClient<ThunderIDNuxtConfig> {
     return {flattenedProfile: user, profile: user, schemas: []};
   }
 
-  override async getCurrentOrganization(sessionId: string): Promise<Organization | null> {
-    try {
-      const idToken: IdToken = await this.getDecodedIdToken(sessionId);
-      if (!idToken?.org_id) {
-        return null;
-      }
-      return {
-        id: idToken.org_id,
-        name: idToken.org_name ?? '',
-        orgHandle: idToken.org_handle ?? '',
-      };
-    } catch {
-      return null;
-    }
-  }
-
-  override async getMyOrganizations(sessionId: string): Promise<Organization[]> {
-    const accessToken: string = await this.getAccessToken(sessionId);
-    const configData: any = this.getStorageManager().getConfigData();
-    const baseUrl: string = (configData?.baseUrl ?? '') as string;
-
-    return getMeOrganizations({
-      baseUrl,
-      headers: {Authorization: `Bearer ${accessToken}`},
-    });
-  }
-
   override async updateUserProfile(config: UpdateMeProfileConfig, sessionId: string): Promise<User> {
     throw new Error('Profile updates are not supported for the ThunderID platform.');
   }
 
-  override async getAllOrganizations(options?: any, sessionId?: string): Promise<AllOrganizationsApiResponse> {
-    const resolvedSessionId: string = sessionId ?? '';
-    const accessToken: string = await this.getAccessToken(resolvedSessionId);
-    const configData: any = this.getStorageManager().getConfigData();
-    const baseUrl: string = (configData?.baseUrl ?? '') as string;
-
-    return getAllOrganizations({
-      baseUrl,
-      headers: {Authorization: `Bearer ${accessToken}`},
-    });
-  }
-
-  async createOrganization(payload: CreateOrganizationPayload, sessionId: string): Promise<Organization> {
-    const accessToken: string = await this.getAccessToken(sessionId);
-    const configData: any = this.getStorageManager().getConfigData();
-    const baseUrl: string = (configData?.baseUrl ?? '') as string;
-
-    return createOrganization({
-      baseUrl,
-      headers: {Authorization: `Bearer ${accessToken}`},
-      payload,
-    });
-  }
-
-  async getOrganization(organizationId: string, sessionId: string): Promise<OrganizationDetails> {
-    const accessToken: string = await this.getAccessToken(sessionId);
-    const configData: any = this.getStorageManager().getConfigData();
-    const baseUrl: string = (configData?.baseUrl ?? '') as string;
-
-    return getOrganization({
-      baseUrl,
-      headers: {Authorization: `Bearer ${accessToken}`},
-      organizationId,
-    });
-  }
-
-  override async switchOrganization(organization: Organization, sessionId: string): Promise<TokenResponse | Response> {
-    if (!organization.id) {
-      throw new Error('Organization ID is required for switching organizations.');
-    }
-
-    const exchangeConfig: TokenExchangeRequestConfig = {
-      attachToken: false,
-      data: {
-        client_id: '{{clientId}}',
-        client_secret: '{{clientSecret}}',
-        grant_type: 'organization_switch',
-        scope: '{{scopes}}',
-        switching_organization: organization.id,
-        token: '{{accessToken}}',
-      },
-      id: 'organization-switch',
-      returnsSession: true,
-      signInRequired: true,
-    };
-
-    return this.exchangeToken(exchangeConfig, sessionId);
-  }
-
   public override getStorageManager(): any {
     return super.getStorageManager();
   }
diff --git a/packages/nuxt/src/runtime/server/plugins/thunderid-ssr.ts b/packages/nuxt/src/runtime/server/plugins/thunderid-ssr.ts
index b44ac98..ed4ecdc 100644
--- a/packages/nuxt/src/runtime/server/plugins/thunderid-ssr.ts
+++ b/packages/nuxt/src/runtime/server/plugins/thunderid-ssr.ts
@@ -49,7 +49,6 @@ function resolveCallbackUrl(event: H3Event): string {
  *    within an organisation.
  * 4. In parallel (gated by `preferences`):
  *    - Fetches user + SCIM2 user profile  (`preferences.user.fetchUserProfile !== false`)
- *    - Fetches current org + my orgs      (`preferences.user.fetchOrganizations !== false`)
  * 5. Writes the full {@link ThunderIDSSRData} to `event.context.thunderid.ssr`
  *    so the Nuxt plugin can seed `useState` keys for zero-cost hydration.
  *
@@ -154,20 +153,13 @@ export default defineNitroPlugin((nitro: {hooks: {hook: Function}}) => {
 
     // ── 4. Parallel SSR data fetches (gated by preferences) ───────────────
     const shouldFetchProfile: boolean = prefs?.user?.fetchUserProfile !== false;
-    const shouldFetchOrgs: boolean = prefs?.user?.fetchOrganizations !== false;
 
-    const [userResult, userProfileResult, orgsResult, currentOrgResult] = await Promise.allSettled([
+    const [userResult, userProfileResult] = await Promise.allSettled([
       // Always fetch the basic user object (needed for ThunderIDAuthState.user)
       client.getUser(session.sessionId),
 
       // SCIM2 user profile (flattened + schemas)
       shouldFetchProfile ? client.getUserProfile(session.sessionId) : Promise.resolve(null),
-
-      // User's organisations
-      shouldFetchOrgs ? client.getMyOrganizations(session.sessionId) : Promise.resolve([] as any[]),
-
-      // Current organisation (derived from the ID token)
-      shouldFetchOrgs ? client.getCurrentOrganization(session.sessionId) : Promise.resolve(null),
     ]);
 
     if (userResult.status === 'rejected') {
@@ -176,18 +168,10 @@ export default defineNitroPlugin((nitro: {hooks: {hook: Function}}) => {
     if (userProfileResult.status === 'rejected') {
       log.warn('Failed to fetch user profile (SCIM2):', userProfileResult.reason);
     }
-    if (orgsResult.status === 'rejected') {
-      log.warn('Failed to fetch my organisations:', orgsResult.reason);
-    }
-    if (currentOrgResult.status === 'rejected') {
-      log.warn('Failed to resolve current organisation:', currentOrgResult.reason);
-    }
 
     // ── 5. Write to event context ──────────────────────────────────────────
     const ssrData: ThunderIDSSRData = {
-      currentOrganization: currentOrgResult.status === 'fulfilled' ? currentOrgResult.value : null,
       isSignedIn: true,
-      myOrganizations: orgsResult.status === 'fulfilled' && Array.isArray(orgsResult.value) ? orgsResult.value : [],
       resolvedBaseUrl,
       session,
       user: userResult.status === 'fulfilled' ? userResult.value : null,
diff --git a/packages/nuxt/src/runtime/server/routes/auth/organizations/current.get.ts b/packages/nuxt/src/runtime/server/routes/auth/organizations/current.get.ts
deleted file mode 100644
index 3447d6d..0000000
--- a/packages/nuxt/src/runtime/server/routes/auth/organizations/current.get.ts
+++ /dev/null
@@ -1,56 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import type {Organization} from '@thunderid/node';
-import {defineEventHandler, createError} from 'h3';
-import type {H3Event} from 'h3';
-import ThunderIDNuxtClient from '../../../ThunderIDNuxtClient';
-import {verifyAndRehydrateSession} from '../../../utils/serverSession';
-import {useRuntimeConfig} from '#imports';
-
-/**
- * GET /api/auth/organizations/current
- *
- * Returns the organisation the authenticated user is currently acting within,
- * derived from the session's ID token (`org_id` / `org_name` claims).
- * Returns `null` when the user is not inside an organisation context.
- *
- * Used by `ThunderIDRoot.revalidateCurrentOrganization` callback.
- */
-export default defineEventHandler(async (event: H3Event): Promise<Organization | null> => {
-  const config: ReturnType<typeof useRuntimeConfig> = useRuntimeConfig();
-  const sessionSecret: string | undefined = config.thunderid?.sessionSecret;
-
-  const session: Awaited<ReturnType<typeof verifyAndRehydrateSession>> = await verifyAndRehydrateSession(
-    event,
-    sessionSecret,
-  );
-  if (!session) {
-    throw createError({statusCode: 401, statusMessage: 'Unauthorized: Invalid or expired session.'});
-  }
-
-  try {
-    const client: ThunderIDNuxtClient = ThunderIDNuxtClient.getInstance();
-    return await client.getCurrentOrganization(session.sessionId);
-  } catch (err) {
-    throw createError({
-      statusCode: 500,
-      statusMessage: `Failed to retrieve current organisation: ${err instanceof Error ? err.message : String(err)}`,
-    });
-  }
-});
diff --git a/packages/nuxt/src/runtime/server/routes/auth/organizations/id.get.ts b/packages/nuxt/src/runtime/server/routes/auth/organizations/id.get.ts
deleted file mode 100644
index f9fd79e..0000000
--- a/packages/nuxt/src/runtime/server/routes/auth/organizations/id.get.ts
+++ /dev/null
@@ -1,60 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import type {OrganizationDetails} from '@thunderid/node';
-import {defineEventHandler, getRouterParam, createError} from 'h3';
-import type {H3Event} from 'h3';
-import ThunderIDNuxtClient from '../../../ThunderIDNuxtClient';
-import {verifyAndRehydrateSession} from '../../../utils/serverSession';
-import {useRuntimeConfig} from '#imports';
-
-/**
- * GET /api/auth/organizations/:id
- *
- * Returns the details of a single organisation by its ID.
- * Requires an active session.
- *
- * Mirrors `getOrganizationAction` in the Next.js SDK.
- */
-export default defineEventHandler(async (event: H3Event): Promise<OrganizationDetails> => {
-  const config: ReturnType<typeof useRuntimeConfig> = useRuntimeConfig();
-  const sessionSecret: string | undefined = config.thunderid?.sessionSecret;
-
-  const session: Awaited<ReturnType<typeof verifyAndRehydrateSession>> = await verifyAndRehydrateSession(
-    event,
-    sessionSecret,
-  );
-  if (!session) {
-    throw createError({statusCode: 401, statusMessage: 'Unauthorized: Invalid or expired session.'});
-  }
-
-  const organizationId: string | undefined = getRouterParam(event, 'id');
-  if (!organizationId) {
-    throw createError({statusCode: 400, statusMessage: 'Organization ID is required.'});
-  }
-
-  try {
-    const client: ThunderIDNuxtClient = ThunderIDNuxtClient.getInstance();
-    return await client.getOrganization(organizationId, session.sessionId);
-  } catch (err) {
-    throw createError({
-      statusCode: 500,
-      statusMessage: `Failed to retrieve organisation: ${err instanceof Error ? err.message : String(err)}`,
-    });
-  }
-});
diff --git a/packages/nuxt/src/runtime/server/routes/auth/organizations/index.get.ts b/packages/nuxt/src/runtime/server/routes/auth/organizations/index.get.ts
deleted file mode 100644
index c03cf9c..0000000
--- a/packages/nuxt/src/runtime/server/routes/auth/organizations/index.get.ts
+++ /dev/null
@@ -1,55 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import type {AllOrganizationsApiResponse} from '@thunderid/node';
-import {defineEventHandler, createError} from 'h3';
-import type {H3Event} from 'h3';
-import ThunderIDNuxtClient from '../../../ThunderIDNuxtClient';
-import {verifyAndRehydrateSession} from '../../../utils/serverSession';
-import {useRuntimeConfig} from '#imports';
-
-/**
- * GET /api/auth/organizations
- *
- * Returns all organisations accessible to the authenticated user (paginated).
- * Used by `ThunderIDRoot.getAllOrganizations` callback.
- *
- * Mirrors `getAllOrganizations` server action in the Next.js SDK.
- */
-export default defineEventHandler(async (event: H3Event): Promise<AllOrganizationsApiResponse> => {
-  const config: ReturnType<typeof useRuntimeConfig> = useRuntimeConfig();
-  const sessionSecret: string | undefined = config.thunderid?.sessionSecret;
-
-  const session: Awaited<ReturnType<typeof verifyAndRehydrateSession>> = await verifyAndRehydrateSession(
-    event,
-    sessionSecret,
-  );
-  if (!session) {
-    throw createError({statusCode: 401, statusMessage: 'Unauthorized: Invalid or expired session.'});
-  }
-
-  try {
-    const client: ThunderIDNuxtClient = ThunderIDNuxtClient.getInstance();
-    return await client.getAllOrganizations(undefined, session.sessionId);
-  } catch (err) {
-    throw createError({
-      statusCode: 500,
-      statusMessage: `Failed to retrieve all organisations: ${err instanceof Error ? err.message : String(err)}`,
-    });
-  }
-});
diff --git a/packages/nuxt/src/runtime/server/routes/auth/organizations/index.post.ts b/packages/nuxt/src/runtime/server/routes/auth/organizations/index.post.ts
deleted file mode 100644
index 3ef3d1a..0000000
--- a/packages/nuxt/src/runtime/server/routes/auth/organizations/index.post.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import type {CreateOrganizationPayload, Organization} from '@thunderid/node';
-import {defineEventHandler, readBody, createError} from 'h3';
-import type {H3Event} from 'h3';
-import ThunderIDNuxtClient from '../../../ThunderIDNuxtClient';
-import {verifyAndRehydrateSession} from '../../../utils/serverSession';
-import {useRuntimeConfig} from '#imports';
-
-/**
- * POST /api/auth/organizations
- *
- * Creates a new sub-organisation under the authenticated user's root organisation.
- *
- * Request body: {@link CreateOrganizationPayload}
- * Response: {@link Organization}
- *
- * Mirrors `createOrganization` server action in the Next.js SDK.
- */
-export default defineEventHandler(async (event: H3Event): Promise<Organization> => {
-  const config: ReturnType<typeof useRuntimeConfig> = useRuntimeConfig();
-  const sessionSecret: string | undefined = config.thunderid?.sessionSecret;
-
-  const session: Awaited<ReturnType<typeof verifyAndRehydrateSession>> = await verifyAndRehydrateSession(
-    event,
-    sessionSecret,
-  );
-  if (!session) {
-    throw createError({statusCode: 401, statusMessage: 'Unauthorized: Invalid or expired session.'});
-  }
-
-  let payload: CreateOrganizationPayload;
-  try {
-    payload = await readBody<CreateOrganizationPayload>(event);
-  } catch {
-    throw createError({statusCode: 400, statusMessage: 'Invalid request body.'});
-  }
-
-  try {
-    const client: ThunderIDNuxtClient = ThunderIDNuxtClient.getInstance();
-    return await client.createOrganization(payload, session.sessionId);
-  } catch (err) {
-    throw createError({
-      statusCode: 500,
-      statusMessage: `Failed to create organisation: ${err instanceof Error ? err.message : String(err)}`,
-    });
-  }
-});
diff --git a/packages/nuxt/src/runtime/server/routes/auth/organizations/me.get.ts b/packages/nuxt/src/runtime/server/routes/auth/organizations/me.get.ts
deleted file mode 100644
index 5143ad5..0000000
--- a/packages/nuxt/src/runtime/server/routes/auth/organizations/me.get.ts
+++ /dev/null
@@ -1,55 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import type {Organization} from '@thunderid/node';
-import {defineEventHandler, createError} from 'h3';
-import type {H3Event} from 'h3';
-import ThunderIDNuxtClient from '../../../ThunderIDNuxtClient';
-import {verifyAndRehydrateSession} from '../../../utils/serverSession';
-import {useRuntimeConfig} from '#imports';
-
-/**
- * GET /api/auth/organizations/me
- *
- * Returns the list of organisations the authenticated user is a member of.
- * Used by `ThunderIDRoot.revalidateMyOrganizations` to refresh client-side state.
- *
- * Mirrors `getMyOrganizations` server action in the Next.js SDK.
- */
-export default defineEventHandler(async (event: H3Event): Promise<Organization[]> => {
-  const config: ReturnType<typeof useRuntimeConfig> = useRuntimeConfig();
-  const sessionSecret: string | undefined = config.thunderid?.sessionSecret;
-
-  const session: Awaited<ReturnType<typeof verifyAndRehydrateSession>> = await verifyAndRehydrateSession(
-    event,
-    sessionSecret,
-  );
-  if (!session) {
-    throw createError({statusCode: 401, statusMessage: 'Unauthorized: Invalid or expired session.'});
-  }
-
-  try {
-    const client: ThunderIDNuxtClient = ThunderIDNuxtClient.getInstance();
-    return await client.getMyOrganizations(session.sessionId);
-  } catch (err) {
-    throw createError({
-      statusCode: 500,
-      statusMessage: `Failed to retrieve organisations: ${err instanceof Error ? err.message : String(err)}`,
-    });
-  }
-});
diff --git a/packages/nuxt/src/runtime/server/routes/auth/organizations/switch.post.ts b/packages/nuxt/src/runtime/server/routes/auth/organizations/switch.post.ts
deleted file mode 100644
index 98326bc..0000000
--- a/packages/nuxt/src/runtime/server/routes/auth/organizations/switch.post.ts
+++ /dev/null
@@ -1,91 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import type {Organization, TokenResponse} from '@thunderid/node';
-import {defineEventHandler, readBody, createError} from 'h3';
-import type {H3Event} from 'h3';
-import ThunderIDNuxtClient from '../../../ThunderIDNuxtClient';
-import {verifyAndRehydrateSession} from '../../../utils/serverSession';
-import {issueSessionCookie} from '../../../utils/session';
-import {useRuntimeConfig} from '#imports';
-
-/**
- * POST /api/auth/organizations/switch
- *
- * Performs an `organization_switch` token exchange for the given organisation,
- * then re-issues the JWT session cookie so subsequent requests carry the new
- * organisation context.
- *
- * Request body: `{ organization: Organization }`
- *
- * Mirrors `switchOrganization` server action in the Next.js SDK.
- */
-export default defineEventHandler(async (event: H3Event): Promise<{success: boolean}> => {
-  const config: ReturnType<typeof useRuntimeConfig> = useRuntimeConfig();
-  const sessionSecret: string | undefined = config.thunderid?.sessionSecret;
-
-  const session: Awaited<ReturnType<typeof verifyAndRehydrateSession>> = await verifyAndRehydrateSession(
-    event,
-    sessionSecret,
-  );
-  if (!session) {
-    throw createError({statusCode: 401, statusMessage: 'Unauthorized: Invalid or expired session.'});
-  }
-  const {sessionId} = session;
-
-  let organization: Organization;
-  try {
-    const body: {organization: Organization} = await readBody<{organization: Organization}>(event);
-    organization = body.organization;
-  } catch {
-    throw createError({statusCode: 400, statusMessage: 'Invalid request body.'});
-  }
-
-  if (!organization?.id) {
-    throw createError({statusCode: 400, statusMessage: 'organization.id is required.'});
-  }
-
-  let tokenResponse: TokenResponse;
-  try {
-    const client: ThunderIDNuxtClient = ThunderIDNuxtClient.getInstance();
-    const response: TokenResponse | Response = await client.switchOrganization(organization, sessionId);
-    tokenResponse = response as TokenResponse;
-  } catch (err) {
-    throw createError({
-      statusCode: 500,
-      statusMessage: `Organisation switch failed: ${err instanceof Error ? err.message : String(err)}`,
-    });
-  }
-
-  // Re-issue the session cookie with the new token so subsequent SSR requests
-  // pick up the switched organisation context — mirrors callback.get.ts.
-  try {
-    const runtimeConfig: ReturnType<typeof useRuntimeConfig> = useRuntimeConfig();
-    const runtimeSessionSecret: string | undefined = runtimeConfig.thunderid?.sessionSecret;
-    await issueSessionCookie(event, sessionId, tokenResponse, runtimeSessionSecret);
-  } catch (err) {
-    throw createError({
-      statusCode: 500,
-      statusMessage: `Failed to establish new session after organisation switch: ${
-        err instanceof Error ? err.message : String(err)
-      }`,
-    });
-  }
-
-  return {success: true};
-});
diff --git a/packages/nuxt/src/runtime/types.ts b/packages/nuxt/src/runtime/types.ts
index 49465b6..72223f7 100644
--- a/packages/nuxt/src/runtime/types.ts
+++ b/packages/nuxt/src/runtime/types.ts
@@ -18,7 +18,6 @@
 
 import type {
   I18nPreferences,
-  Organization,
   TokenEndpointAuthMethod,
   User,
   UserProfile,
@@ -62,8 +61,6 @@ export interface ThunderIDNuxtConfig {
       mode?: 'light' | 'dark' | 'system' | 'class' | 'branding';
     };
     user?: {
-      /** Whether to fetch the user's organisations during SSR (default: true). */
-      fetchOrganizations?: boolean;
       /** Whether to fetch the SCIM2 user profile during SSR (default: true). */
       fetchUserProfile?: boolean;
     };
@@ -132,11 +129,7 @@ export interface ThunderIDTempSessionPayload extends JWTPayload {
  * hydrated `useState` keys so the client never re-fetches on first render.
  */
 export interface ThunderIDSSRData {
-  /** The organisation the user is currently acting within (null when not in an org). */
-  currentOrganization: Organization | null;
   isSignedIn: boolean;
-  /** All organisations the user is a member of (empty array when `preferences.user.fetchOrganizations` is false). */
-  myOrganizations: Organization[];
   /**
    * The base URL actually used for this request.
    * Equals `${baseUrl}/o` when the user is acting within an organisation
diff --git a/packages/react/src/ThunderIDReactClient.ts b/packages/react/src/ThunderIDReactClient.ts
index 179d274..86fd919 100644
--- a/packages/react/src/ThunderIDReactClient.ts
+++ b/packages/react/src/ThunderIDReactClient.ts
@@ -24,9 +24,7 @@ import {
   SignUpOptions,
   ThunderIDRuntimeError,
   executeEmbeddedSignInFlow,
-  Organization,
   IdToken,
-  AllOrganizationsApiResponse,
   extractUserClaimsFromIdToken,
   TokenResponse,
   HttpRequestConfig,
@@ -39,8 +37,6 @@ import {
   EmbeddedSignInFlowStatus,
   EmbeddedSignUpFlowStatus,
 } from '@thunderid/browser';
-import getAllOrganizations from './api/getAllOrganizations';
-import getMeOrganizations from './api/getMeOrganizations';
 import {ThunderIDReactConfig} from './models/config';
 
 class ThunderIDReactClient<T extends ThunderIDReactConfig = ThunderIDReactConfig> extends ThunderIDBrowserClient<T> {
@@ -125,109 +121,6 @@ class ThunderIDReactClient<T extends ThunderIDReactConfig = ThunderIDReactConfig
     });
   }
 
-  override async getMyOrganizations(options?: any): Promise<Organization[]> {
-    try {
-      let baseUrl: string = options?.baseUrl;
-
-      if (!baseUrl) {
-        const configData: any = await this.getStorageManager().getConfigData();
-        baseUrl = configData?.baseUrl;
-      }
-
-      return await getMeOrganizations({baseUrl, instanceId: this.getInstanceId()});
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to fetch the user's associated organizations: ${
-          error instanceof Error ? error.message : String(error)
-        }`,
-        'ThunderIDReactClient-getMyOrganizations-RuntimeError-001',
-        'react',
-        'An error occurred while fetching associated organizations of the signed-in user.',
-      );
-    }
-  }
-
-  override async getAllOrganizations(options?: any): Promise<AllOrganizationsApiResponse> {
-    try {
-      let baseUrl: string = options?.baseUrl;
-
-      if (!baseUrl) {
-        const configData: any = await this.getStorageManager().getConfigData();
-        baseUrl = configData?.baseUrl;
-      }
-
-      return await getAllOrganizations({baseUrl, instanceId: this.getInstanceId()});
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to fetch all organizations: ${error instanceof Error ? error.message : String(error)}`,
-        'ThunderIDReactClient-getAllOrganizations-RuntimeError-001',
-        'react',
-        'An error occurred while fetching all the organizations associated with the user.',
-      );
-    }
-  }
-
-  override async getCurrentOrganization(): Promise<Organization | null> {
-    try {
-      return await this.withLoading(async () => {
-        const idToken: IdToken = await this.getDecodedIdToken();
-        return {
-          id: idToken?.org_id ?? '',
-          name: idToken?.org_name ?? '',
-          orgHandle: idToken?.org_handle ?? '',
-        };
-      });
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to fetch the current organization: ${error instanceof Error ? error.message : String(error)}`,
-        'ThunderIDReactClient-getCurrentOrganization-RuntimeError-001',
-        'react',
-        'An error occurred while fetching the current organization of the signed-in user.',
-      );
-    }
-  }
-
-  override async switchOrganization(organization: Organization): Promise<TokenResponse | Response> {
-    return this.withLoading(async () => {
-      try {
-        const configData: any = await this.getStorageManager().getConfigData();
-        const sourceInstanceId: number | undefined = configData?.organizationChain?.sourceInstanceId;
-
-        if (!organization.id) {
-          throw new ThunderIDRuntimeError(
-            'Organization ID is required for switching organizations',
-            'react-ThunderIDReactClient-SwitchOrganizationError-001',
-            'react',
-            'The organization object must contain a valid ID to perform the organization switch.',
-          );
-        }
-
-        const exchangeConfig: TokenExchangeRequestConfig = {
-          attachToken: false,
-          data: {
-            client_id: '{{clientId}}',
-            grant_type: 'organization_switch',
-            scope: '{{scopes}}',
-            switching_organization: organization.id,
-            token: '{{accessToken}}',
-          },
-          id: 'organization-switch',
-          returnsSession: true,
-          signInRequired: sourceInstanceId === undefined,
-        };
-
-        return (await super.exchangeToken(exchangeConfig)) as TokenResponse | Response;
-      } catch (error) {
-        throw new ThunderIDRuntimeError(
-          `Failed to switch organization: ${error.message || error}`,
-          'react-ThunderIDReactClient-SwitchOrganizationError-003',
-          'react',
-          'An error occurred while switching to the specified organization. Please try again.',
-        );
-      }
-    });
-  }
-
   override isLoading(): boolean {
     return this.loadingState;
   }
diff --git a/packages/react/src/api/createOrganization.ts b/packages/react/src/api/createOrganization.ts
deleted file mode 100644
index ebb8e38..0000000
--- a/packages/react/src/api/createOrganization.ts
+++ /dev/null
@@ -1,123 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {
-  Organization,
-  HttpResponse,
-  FetchHttpClient,
-  HttpRequestConfig,
-  createOrganization as baseCreateOrganization,
-  CreateOrganizationConfig as BaseCreateOrganizationConfig,
-} from '@thunderid/browser';
-
-/**
- * Configuration for the createOrganization request (React-specific)
- */
-export interface CreateOrganizationConfig extends Omit<BaseCreateOrganizationConfig, 'fetcher'> {
-  /**
-   * Optional custom fetcher function. If not provided, the ThunderID SPA client's httpClient will be used
-   * which is a wrapper around axios http.request
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * Optional instance ID for multi-instance support. Defaults to 0.
-   */
-  instanceId?: number;
-}
-
-/**
- * Creates a new organization.
- * This function uses the ThunderID SPA client's httpClient by default, but allows for custom fetchers.
- *
- * @param config - Configuration object containing baseUrl, payload and optional request config.
- * @returns A promise that resolves with the created organization information.
- * @example
- * ```typescript
- * // Using default ThunderID SPA client httpClient
- * try {
- *   const organization = await createOrganization({
- *     baseUrl: "https://localhost:8090",
- *     payload: {
- *       description: "Share your screens",
- *       name: "Team Viewer",
- *       orgHandle: "team-viewer",
- *       parentId: "f4825104-4948-40d9-ab65-a960eee3e3d5",
- *       type: "TENANT"
- *     }
- *   });
- *   console.log(organization);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to create organization:', error.message);
- *   }
- * }
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher
- * try {
- *   const organization = await createOrganization({
- *     baseUrl: "https://localhost:8090",
- *     payload: {
- *       description: "Share your screens",
- *       name: "Team Viewer",
- *       orgHandle: "team-viewer",
- *       parentId: "f4825104-4948-40d9-ab65-a960eee3e3d5",
- *       type: "TENANT"
- *     },
- *     fetcher: customFetchFunction
- *   });
- *   console.log(organization);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to create organization:', error.message);
- *   }
- * }
- * ```
- */
-const createOrganization = async ({
-  fetcher,
-  instanceId = 0,
-  ...requestConfig
-}: CreateOrganizationConfig): Promise<Organization> => {
-  const defaultFetcher = async (url: string, config: RequestInit): Promise<Response> => {
-    const httpClient: FetchHttpClient = FetchHttpClient.getInstance(instanceId);
-    const response: HttpResponse<any> = await httpClient.request({
-      data: config.body ? JSON.parse(config.body as string) : undefined,
-      headers: config.headers as Record<string, string>,
-      method: config.method || 'POST',
-      url,
-    } as HttpRequestConfig);
-
-    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)),
-    } as Response;
-  };
-
-  return baseCreateOrganization({
-    ...requestConfig,
-    fetcher: fetcher || defaultFetcher,
-  });
-};
-
-export default createOrganization;
diff --git a/packages/react/src/api/getAllOrganizations.ts b/packages/react/src/api/getAllOrganizations.ts
deleted file mode 100644
index 44bb44e..0000000
--- a/packages/react/src/api/getAllOrganizations.ts
+++ /dev/null
@@ -1,114 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {
-  HttpResponse,
-  FetchHttpClient,
-  HttpRequestConfig,
-  getAllOrganizations as baseGetAllOrganizations,
-  GetAllOrganizationsConfig as BaseGetAllOrganizationsConfig,
-  AllOrganizationsApiResponse,
-} from '@thunderid/browser';
-
-/**
- * Configuration for the getAllOrganizations request (React-specific)
- */
-export interface GetAllOrganizationsConfig extends Omit<BaseGetAllOrganizationsConfig, 'fetcher'> {
-  /**
-   * Optional custom fetcher function. If not provided, the ThunderID SPA client's httpClient will be used
-   * which is a wrapper around axios http.request
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * Optional instance ID for multi-instance support. Defaults to 0.
-   */
-  instanceId?: number;
-}
-
-/**
- * Retrieves all organizations with pagination support.
- * This function uses the ThunderID SPA client's httpClient by default, but allows for custom fetchers.
- *
- * @param config - Configuration object containing baseUrl, optional query parameters, and request config.
- * @returns A promise that resolves with the paginated organizations information.
- * @example
- * ```typescript
- * // Using default ThunderID SPA client httpClient
- * try {
- *   const response = await getAllOrganizations({
- *     baseUrl: "https://localhost:8090",
- *     filter: "",
- *     limit: 10,
- *     recursive: false
- *   });
- *   console.log(response.organizations);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organizations:', error.message);
- *   }
- * }
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher
- * try {
- *   const response = await getAllOrganizations({
- *     baseUrl: "https://localhost:8090",
- *     filter: "",
- *     limit: 10,
- *     recursive: false,
- *     fetcher: customFetchFunction
- *   });
- *   console.log(response.organizations);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organizations:', error.message);
- *   }
- * }
- * ```
- */
-const getAllOrganizations = async ({
-  fetcher,
-  instanceId = 0,
-  ...requestConfig
-}: GetAllOrganizationsConfig): Promise<AllOrganizationsApiResponse> => {
-  const defaultFetcher = async (url: string, config: RequestInit): Promise<Response> => {
-    const httpClient: FetchHttpClient = FetchHttpClient.getInstance(instanceId);
-    const response: HttpResponse<any> = await httpClient.request({
-      headers: config.headers as Record<string, string>,
-      method: config.method || 'GET',
-      url,
-    } as HttpRequestConfig);
-
-    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)),
-    } as Response;
-  };
-
-  return baseGetAllOrganizations({
-    ...requestConfig,
-    fetcher: fetcher || defaultFetcher,
-  });
-};
-
-export default getAllOrganizations;
diff --git a/packages/react/src/api/getMeOrganizations.ts b/packages/react/src/api/getMeOrganizations.ts
deleted file mode 100644
index 96acfc6..0000000
--- a/packages/react/src/api/getMeOrganizations.ts
+++ /dev/null
@@ -1,118 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {
-  Organization,
-  HttpResponse,
-  FetchHttpClient,
-  HttpRequestConfig,
-  getMeOrganizations as baseGetMeOrganizations,
-  GetMeOrganizationsConfig as BaseGetMeOrganizationsConfig,
-} from '@thunderid/browser';
-
-/**
- * Configuration for the getMeOrganizations request (React-specific)
- */
-export interface GetMeOrganizationsConfig extends Omit<BaseGetMeOrganizationsConfig, 'fetcher'> {
-  /**
-   * Optional custom fetcher function. If not provided, the ThunderID SPA client's httpClient will be used
-   * which is a wrapper around axios http.request
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * Optional instance ID for multi-instance support. Defaults to 0.
-   */
-  instanceId?: number;
-}
-
-/**
- * Retrieves the organizations associated with the current user.
- * This function uses the ThunderID SPA client's httpClient by default, but allows for custom fetchers.
- *
- * @param config - Configuration object containing baseUrl, optional query parameters, and request config.
- * @returns A promise that resolves with the organizations information.
- * @example
- * ```typescript
- * // Using default ThunderID SPA client httpClient
- * try {
- *   const organizations = await getMeOrganizations({
- *     baseUrl: "https://localhost:8090",
- *     after: "",
- *     before: "",
- *     filter: "",
- *     limit: 10,
- *     recursive: false
- *   });
- *   console.log(organizations);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organizations:', error.message);
- *   }
- * }
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher
- * try {
- *   const organizations = await getMeOrganizations({
- *     baseUrl: "https://localhost:8090",
- *     after: "",
- *     before: "",
- *     filter: "",
- *     limit: 10,
- *     recursive: false,
- *     fetcher: customFetchFunction
- *   });
- *   console.log(organizations);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organizations:', error.message);
- *   }
- * }
- * ```
- */
-const getMeOrganizations = async ({
-  fetcher,
-  instanceId = 0,
-  ...requestConfig
-}: GetMeOrganizationsConfig): Promise<Organization[]> => {
-  const defaultFetcher = async (url: string, config: RequestInit): Promise<Response> => {
-    const httpClient: FetchHttpClient = FetchHttpClient.getInstance(instanceId);
-    const response: HttpResponse<any> = await httpClient.request({
-      headers: config.headers as Record<string, string>,
-      method: config.method || 'GET',
-      url,
-    } as HttpRequestConfig);
-
-    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)),
-    } as Response;
-  };
-
-  return baseGetMeOrganizations({
-    ...requestConfig,
-    fetcher: fetcher || defaultFetcher,
-  });
-};
-
-export default getMeOrganizations;
diff --git a/packages/react/src/api/getOrganization.ts b/packages/react/src/api/getOrganization.ts
deleted file mode 100644
index f3ca1ff..0000000
--- a/packages/react/src/api/getOrganization.ts
+++ /dev/null
@@ -1,110 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {
-  HttpResponse,
-  FetchHttpClient,
-  HttpRequestConfig,
-  getOrganization as baseGetOrganization,
-  GetOrganizationConfig as BaseGetOrganizationConfig,
-  OrganizationDetails,
-} from '@thunderid/browser';
-
-/**
- * Configuration for the getOrganization request (React-specific)
- */
-export interface GetOrganizationConfig extends Omit<BaseGetOrganizationConfig, 'fetcher'> {
-  /**
-   * Optional custom fetcher function. If not provided, the ThunderID SPA client's httpClient will be used
-   * which is a wrapper around axios http.request
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * Optional instance ID for multi-instance support. Defaults to 0.
-   */
-  instanceId?: number;
-}
-
-/**
- * Retrieves detailed information for a specific organization.
- * This function uses the ThunderID SPA client's httpClient by default, but allows for custom fetchers.
- *
- * @param config - Configuration object containing baseUrl, organizationId, and request config.
- * @returns A promise that resolves with the organization details.
- * @example
- * ```typescript
- * // Using default ThunderID SPA client httpClient
- * try {
- *   const organization = await getOrganization({
- *     baseUrl: "https://localhost:8090",
- *     organizationId: "0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
- *   });
- *   console.log(organization);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organization:', error.message);
- *   }
- * }
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher
- * try {
- *   const organization = await getOrganization({
- *     baseUrl: "https://localhost:8090",
- *     organizationId: "0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1",
- *     fetcher: customFetchFunction
- *   });
- *   console.log(organization);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get organization:', error.message);
- *   }
- * }
- * ```
- */
-const getOrganization = async ({
-  fetcher,
-  instanceId = 0,
-  ...requestConfig
-}: GetOrganizationConfig): Promise<OrganizationDetails> => {
-  const defaultFetcher = async (url: string, config: RequestInit): Promise<Response> => {
-    const httpClient: FetchHttpClient = FetchHttpClient.getInstance(instanceId);
-    const response: HttpResponse<any> = await httpClient.request({
-      headers: config.headers as Record<string, string>,
-      method: config.method || 'GET',
-      url,
-    } as HttpRequestConfig);
-
-    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)),
-    } as Response;
-  };
-
-  return baseGetOrganization({
-    ...requestConfig,
-    fetcher: fetcher || defaultFetcher,
-  });
-};
-
-export default getOrganization;
diff --git a/packages/react/src/api/getSchemas.ts b/packages/react/src/api/getSchemas.ts
deleted file mode 100644
index f4c400c..0000000
--- a/packages/react/src/api/getSchemas.ts
+++ /dev/null
@@ -1,104 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {
-  Schema,
-  HttpResponse,
-  FetchHttpClient,
-  HttpRequestConfig,
-  getSchemas as baseGetSchemas,
-  GetSchemasConfig as BaseGetSchemasConfig,
-} from '@thunderid/browser';
-
-/**
- * Configuration for the getSchemas request (React-specific)
- */
-export interface GetSchemasConfig extends Omit<BaseGetSchemasConfig, 'fetcher'> {
-  /**
-   * Optional custom fetcher function. If not provided, the ThunderID SPA client's httpClient will be used
-   * which is a wrapper around axios http.request
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * Optional instance ID for multi-instance support. Defaults to 0.
-   */
-  instanceId?: number;
-}
-
-/**
- * Retrieves the SCIM2 schemas from the specified endpoint.
- * This function uses the ThunderID SPA client's httpClient by default, but allows for custom fetchers.
- *
- * @param config - Request configuration object.
- * @returns A promise that resolves with the SCIM2 schemas information.
- * @example
- * ```typescript
- * // Using default ThunderID SPA client httpClient
- * try {
- *   const schemas = await getSchemas({
- *     url: "https://localhost:8090/scim2/Schemas",
- *   });
- *   console.log(schemas);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get schemas:', error.message);
- *   }
- * }
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher
- * try {
- *   const schemas = await getSchemas({
- *     url: "https://localhost:8090/scim2/Schemas",
- *     fetcher: customFetchFunction
- *   });
- *   console.log(schemas);
- * } catch (error) {
- *   if (error instanceof ThunderIDAPIError) {
- *     console.error('Failed to get schemas:', error.message);
- *   }
- * }
- * ```
- */
-const getSchemas = async ({fetcher, instanceId = 0, ...requestConfig}: GetSchemasConfig): Promise<Schema[]> => {
-  const defaultFetcher = async (url: string, config: RequestInit): Promise<Response> => {
-    const httpClient: FetchHttpClient = FetchHttpClient.getInstance(instanceId);
-    const response: HttpResponse<any> = await httpClient.request({
-      headers: config.headers as Record<string, string>,
-      method: config.method || 'GET',
-      url,
-    } as HttpRequestConfig);
-
-    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)),
-    } as Response;
-  };
-
-  return baseGetSchemas({
-    ...requestConfig,
-    fetcher: fetcher || defaultFetcher,
-  });
-};
-
-export default getSchemas;
diff --git a/packages/react/src/api/updateOrganization.ts b/packages/react/src/api/updateOrganization.ts
deleted file mode 100644
index d440cbf..0000000
--- a/packages/react/src/api/updateOrganization.ts
+++ /dev/null
@@ -1,121 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {
-  HttpResponse,
-  FetchHttpClient,
-  HttpRequestConfig,
-  updateOrganization as baseUpdateOrganization,
-  UpdateOrganizationConfig as BaseUpdateOrganizationConfig,
-  OrganizationDetails,
-  createPatchOperations,
-} from '@thunderid/browser';
-
-/**
- * Configuration for the updateOrganization request (React-specific)
- */
-export interface UpdateOrganizationConfig extends Omit<BaseUpdateOrganizationConfig, 'fetcher'> {
-  /**
-   * Optional custom fetcher function. If not provided, the ThunderID SPA client's httpClient will be used
-   * which is a wrapper around axios http.request
-   */
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  /**
-   * Optional instance ID for multi-instance support. Defaults to 0.
-   */
-  instanceId?: number;
-}
-
-/**
- * Updates the organization information using the Organizations Management API.
- * This function uses the ThunderID SPA client's httpClient by default, but allows for custom fetchers.
- *
- * @param config - Configuration object with baseUrl, organizationId, operations and optional request config.
- * @returns A promise that resolves with the updated organization information.
- * @example
- * ```typescript
- * // Using the helper function to create operations automatically
- * const operations = createPatchOperations({
- *   name: "Updated Organization Name",      // Will use REPLACE
- *   description: "",                        // Will use REMOVE (empty string)
- *   customField: "Some value"              // Will use REPLACE
- * });
- *
- * await updateOrganization({
- *   baseUrl: "https://localhost:8090",
- *   organizationId: "0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1",
- *   operations
- * });
- *
- * // Or manually specify operations
- * await updateOrganization({
- *   baseUrl: "https://localhost:8090",
- *   organizationId: "0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1",
- *   operations: [
- *     { operation: "REPLACE", path: "/name", value: "Updated Organization Name" },
- *     { operation: "REMOVE", path: "/description" }
- *   ]
- * });
- * ```
- *
- * @example
- * ```typescript
- * // Using custom fetcher
- * await updateOrganization({
- *   baseUrl: "https://localhost:8090",
- *   organizationId: "0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1",
- *   operations: [
- *     { operation: "REPLACE", path: "/name", value: "Updated Organization Name" }
- *   ],
- *   fetcher: customFetchFunction
- * });
- * ```
- */
-const updateOrganization = async ({
-  fetcher,
-  instanceId = 0,
-  ...requestConfig
-}: UpdateOrganizationConfig): Promise<OrganizationDetails> => {
-  const defaultFetcher = async (url: string, config: RequestInit): Promise<Response> => {
-    const httpClient: FetchHttpClient = FetchHttpClient.getInstance(instanceId);
-    const response: HttpResponse<any> = await httpClient.request({
-      data: config.body ? JSON.parse(config.body as string) : undefined,
-      headers: config.headers as Record<string, string>,
-      method: config.method || 'PATCH',
-      url,
-    } as HttpRequestConfig);
-
-    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)),
-    } as Response;
-  };
-
-  return baseUpdateOrganization({
-    ...requestConfig,
-    fetcher: fetcher || defaultFetcher,
-  });
-};
-
-// Re-export the helper function
-export {createPatchOperations};
-
-export default updateOrganization;
diff --git a/packages/react/src/components/control/OrganizationContext/OrganizationContext.tsx b/packages/react/src/components/control/OrganizationContext/OrganizationContext.tsx
deleted file mode 100644
index 77e747b..0000000
--- a/packages/react/src/components/control/OrganizationContext/OrganizationContext.tsx
+++ /dev/null
@@ -1,84 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {FC, PropsWithChildren} from 'react';
-import OrganizationContextController from './OrganizationContextController';
-import ThunderIDProvider, {ThunderIDProviderProps} from '../../../contexts/ThunderID/ThunderIDProvider';
-import useThunderID from '../../../contexts/ThunderID/useThunderID';
-
-export interface OrganizationContextProps extends Omit<ThunderIDProviderProps, 'organizationChain' | 'baseUrl'> {
-  /**
-   * Optional base URL for the organization context. If not provided, it will default to the source provider's base URL.
-   */
-  baseUrl?: string;
-  /**
-   * Instance ID for this organization context. Must be unique across the app if multiple contexts are used.
-   */
-  instanceId: number;
-  /**
-   * Optional source instance ID. If not provided, immediate parent provider is used as source.
-   */
-  sourceInstanceId?: number;
-  /**
-   * ID of the organization to authenticate with
-   */
-  targetOrganizationId: string;
-}
-
-const OrganizationContext: FC<PropsWithChildren<OrganizationContextProps>> = ({
-  instanceId,
-  baseUrl,
-  clientId,
-  afterSignInUrl,
-  afterSignOutUrl,
-  targetOrganizationId,
-  sourceInstanceId,
-  scopes,
-  children,
-  ...rest
-}: PropsWithChildren<OrganizationContextProps>) => {
-  // Get the source provider's signed-in status
-  const {
-    isSignedIn: isSourceSignedIn,
-    instanceId: sourceInstanceIdFromContext,
-    baseUrl: sourceBaseUrl,
-    clientId: sourceClientId,
-  } = useThunderID();
-
-  return (
-    <ThunderIDProvider
-      instanceId={instanceId}
-      baseUrl={baseUrl || sourceBaseUrl}
-      clientId={clientId || sourceClientId}
-      afterSignInUrl={afterSignInUrl}
-      afterSignOutUrl={afterSignOutUrl}
-      scopes={scopes}
-      organizationChain={{
-        sourceInstanceId: sourceInstanceId || sourceInstanceIdFromContext,
-        targetOrganizationId,
-      }}
-      {...rest}
-    >
-      <OrganizationContextController targetOrganizationId={targetOrganizationId} isSourceSignedIn={isSourceSignedIn}>
-        {children}
-      </OrganizationContextController>
-    </ThunderIDProvider>
-  );
-};
-
-export default OrganizationContext;
diff --git a/packages/react/src/components/control/OrganizationContext/OrganizationContextController.tsx b/packages/react/src/components/control/OrganizationContext/OrganizationContextController.tsx
deleted file mode 100644
index bbe5712..0000000
--- a/packages/react/src/components/control/OrganizationContext/OrganizationContextController.tsx
+++ /dev/null
@@ -1,106 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {Organization} from '@thunderid/browser';
-import {FC, useEffect, useRef} from 'react';
-import useThunderID from '../../../contexts/ThunderID/useThunderID';
-
-interface OrganizationContextControllerProps {
-  /**
-   * Children to render
-   */
-  children: React.ReactNode;
-  /**
-   * Whether the source provider is signed in
-   */
-  isSourceSignedIn: boolean;
-  /**
-   * ID of the organization to authenticate with
-   */
-  targetOrganizationId: string;
-}
-
-const OrganizationContextController: FC<OrganizationContextControllerProps> = ({
-  targetOrganizationId,
-  isSourceSignedIn,
-  children,
-}: OrganizationContextControllerProps) => {
-  const {isInitialized, isSignedIn, switchOrganization, isLoading} = useThunderID();
-  const hasAuthenticatedRef: React.MutableRefObject<boolean> = useRef(false);
-  const isAuthenticatingRef: React.MutableRefObject<boolean> = useRef(false);
-
-  /**
-   * Handle the organization switch when:
-   * - Current instance is initialized and NOT signed in
-   * - Source provider IS signed in
-   * Uses the `switchOrganization` function from the ThunderID context.
-   */
-  useEffect(() => {
-    const performOrganizationSwitch = async (): Promise<void> => {
-      // Prevent multiple authentication attempts
-      if (hasAuthenticatedRef.current || isAuthenticatingRef.current) {
-        return;
-      }
-
-      // Wait for initialization to complete
-      if (!isInitialized || isLoading) {
-        return;
-      }
-
-      // Only proceed if user is not already signed in to this instance
-      if (isSignedIn) {
-        hasAuthenticatedRef.current = true;
-        return;
-      }
-
-      // CRITICAL: Only proceed if source provider is signed in
-      if (!isSourceSignedIn) {
-        return;
-      }
-
-      try {
-        isAuthenticatingRef.current = true;
-        hasAuthenticatedRef.current = true;
-
-        // Build the organization object for authentication
-        const targetOrganization: Organization = {
-          id: targetOrganizationId,
-          name: '', // Name will be populated after authentication
-          orgHandle: '', // Will be populated after authentication
-        };
-
-        // Call the switchOrganization API from context (handles token exchange)
-        await switchOrganization(targetOrganization);
-      } catch (error) {
-        // eslint-disable-next-line no-console
-        console.error('Linked organization authentication failed:', error);
-
-        // Reset the flag to allow retry
-        hasAuthenticatedRef.current = false;
-      } finally {
-        isAuthenticatingRef.current = false;
-      }
-    };
-
-    performOrganizationSwitch();
-  }, [isInitialized, isSignedIn, isLoading, isSourceSignedIn, targetOrganizationId, switchOrganization]);
-
-  return <>{children}</>;
-};
-
-export default OrganizationContextController;
diff --git a/packages/react/src/components/presentation/CreateOrganization/BaseCreateOrganization.styles.ts b/packages/react/src/components/presentation/CreateOrganization/BaseCreateOrganization.styles.ts
deleted file mode 100644
index 05e2bc1..0000000
--- a/packages/react/src/components/presentation/CreateOrganization/BaseCreateOrganization.styles.ts
+++ /dev/null
@@ -1,180 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {css} from '@emotion/css';
-import {Theme} from '@thunderid/browser';
-import {useMemo} from 'react';
-
-/**
- * Creates styles for the BaseCreateOrganization component using BEM methodology
- * @param theme - The theme object containing design tokens
- * @param colorScheme - The current color scheme (used for memoization)
- * @returns Object containing CSS class names for component styling
- */
-const useStyles = (theme: Theme, colorScheme: string): Record<string, string> =>
-  useMemo(() => {
-    const root: string = css`
-      padding: calc(${theme.vars.spacing.unit} * 4);
-      min-width: 600px;
-      margin: 0 auto;
-      font-family: ${theme.vars.typography.fontFamily};
-    `;
-
-    const card: string = css`
-      background: ${theme.vars.colors.background.surface};
-      border-radius: ${theme.vars.borderRadius.large};
-      padding: calc(${theme.vars.spacing.unit} * 4);
-    `;
-
-    const content: string = css`
-      display: flex;
-      flex-direction: column;
-      gap: calc(${theme.vars.spacing.unit} * 2);
-    `;
-
-    const form: string = css`
-      display: flex;
-      flex-direction: column;
-      gap: calc(${theme.vars.spacing.unit} * 2);
-      width: 100%;
-    `;
-
-    const header: string = css`
-      display: flex;
-      align-items: center;
-      gap: calc(${theme.vars.spacing.unit} * 1.5);
-      margin-bottom: calc(${theme.vars.spacing.unit} * 1.5);
-    `;
-
-    const field: string = css`
-      display: flex;
-      align-items: center;
-      padding: ${theme.vars.spacing.unit} 0;
-      border-bottom: 1px solid ${theme.vars.colors.border};
-      min-height: 32px;
-    `;
-
-    const fieldGroup: string = css`
-      display: flex;
-      flex-direction: column;
-      gap: calc(${theme.vars.spacing.unit} * 0.5);
-    `;
-
-    const textarea: string = css`
-      width: 100%;
-      padding: ${theme.vars.spacing.unit} calc(${theme.vars.spacing.unit} * 1.5);
-      border: 1px solid ${theme.vars.colors.border};
-      border-radius: ${theme.vars.borderRadius.medium};
-      font-size: ${theme.vars.typography.fontSizes.md};
-      color: ${theme.vars.colors.text.primary};
-      background-color: ${theme.vars.colors.background.surface};
-      font-family: ${theme.vars.typography.fontFamily};
-      min-height: 80px;
-      resize: vertical;
-      outline: none;
-      &:focus {
-        border-color: ${theme.vars.colors.primary.main};
-        box-shadow: 0 0 0 2px ${theme.vars.colors.primary.main}20;
-      }
-      &:disabled {
-        background-color: ${theme.vars.colors.background.disabled};
-        color: ${theme.vars.colors.text.secondary};
-        cursor: not-allowed;
-      }
-    `;
-
-    const textareaError: string = css`
-      border-color: ${theme.vars.colors.error.main};
-    `;
-
-    const input: string = css``;
-
-    const avatarContainer: string = css`
-      align-items: flex-start;
-      display: flex;
-      gap: calc(${theme.vars.spacing.unit} * 2);
-      margin-bottom: ${theme.vars.spacing.unit};
-    `;
-
-    const actions: string = css`
-      display: flex;
-      gap: ${theme.vars.spacing.unit};
-      justify-content: flex-end;
-      padding-top: calc(${theme.vars.spacing.unit} * 2);
-    `;
-
-    const infoContainer: string = css`
-      display: flex;
-      flex-direction: column;
-      gap: ${theme.vars.spacing.unit};
-    `;
-
-    const value: string = css`
-      color: ${theme.vars.colors.text.primary};
-      flex: 1;
-      display: flex;
-      align-items: center;
-      gap: ${theme.vars.spacing.unit};
-      overflow: hidden;
-      min-height: 32px;
-      line-height: 32px;
-    `;
-
-    const popup: string = css`
-      padding: calc(${theme.vars.spacing.unit} * 2);
-    `;
-
-    const errorAlert: string = css`
-      margin-bottom: calc(${theme.vars.spacing.unit} * 2);
-    `;
-
-    return {
-      actions,
-      avatarContainer,
-      card,
-      content,
-      errorAlert,
-      field,
-      fieldGroup,
-      form,
-      header,
-      infoContainer,
-      input,
-      popup,
-      root,
-      textarea,
-      textareaError,
-      value,
-    };
-  }, [
-    theme.vars.spacing.unit,
-    theme.vars.colors.background.surface,
-    theme.vars.colors.border,
-    theme.vars.borderRadius.large,
-    theme.vars.borderRadius.medium,
-    theme.vars.typography.fontSizes.md,
-    theme.vars.colors.text.primary,
-    theme.vars.colors.primary.main,
-    theme.vars.colors.background.disabled,
-    theme.vars.colors.text.secondary,
-    theme.vars.colors.error.main,
-    theme.vars.typography.fontFamily,
-    colorScheme,
-  ]);
-
-export default useStyles;
diff --git a/packages/react/src/components/presentation/CreateOrganization/BaseCreateOrganization.tsx b/packages/react/src/components/presentation/CreateOrganization/BaseCreateOrganization.tsx
deleted file mode 100644
index 0701a10..0000000
--- a/packages/react/src/components/presentation/CreateOrganization/BaseCreateOrganization.tsx
+++ /dev/null
@@ -1,279 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {cx} from '@emotion/css';
-import {CreateOrganizationPayload, createPackageComponentLogger, Preferences} from '@thunderid/browser';
-import {ChangeEvent, CSSProperties, FC, FormEvent, ReactElement, ReactNode, useState} from 'react';
-import useStyles from './BaseCreateOrganization.styles';
-import useTheme from '../../../contexts/Theme/useTheme';
-import useTranslation from '../../../hooks/useTranslation';
-import AlertPrimitive from '../../primitives/Alert/Alert';
-import Button from '../../primitives/Button/Button';
-import DialogPrimitive from '../../primitives/Dialog/Dialog';
-import FormControl from '../../primitives/FormControl/FormControl';
-import InputLabel from '../../primitives/InputLabel/InputLabel';
-import TextField from '../../primitives/TextField/TextField';
-
-const logger: ReturnType<typeof createPackageComponentLogger> = createPackageComponentLogger(
-  '@thunderid/react',
-  'BaseCreateOrganization',
-);
-
-/**
- * Interface for organization form data.
- */
-export interface OrganizationFormData {
-  description: string;
-  handle: string;
-  name: string;
-}
-
-/**
- * Props interface for the BaseCreateOrganization component.
- */
-export interface BaseCreateOrganizationProps {
-  cardLayout?: boolean;
-  className?: string;
-  defaultParentId?: string;
-  error?: string | null;
-  initialValues?: Partial<OrganizationFormData>;
-  loading?: boolean;
-  mode?: 'inline' | 'popup';
-  onCancel?: () => void;
-  onOpenChange?: (open: boolean) => void;
-  onSubmit?: (payload: CreateOrganizationPayload) => void | Promise<void>;
-  onSuccess?: (organization: any) => void;
-  open?: boolean;
-  /**
-   * Component-level preferences to override global i18n and theme settings.
-   * Preferences are deep-merged with global ones, with component preferences
-   * taking precedence. Affects this component and all its descendants.
-   */
-  preferences?: Preferences;
-  renderAdditionalFields?: () => ReactNode;
-  style?: CSSProperties;
-
-  title?: string;
-}
-
-/**
- * Removes special characters except space and hyphen from the organization name
- * and generates a valid handle.
- * @param name
- * @returns
- */
-const generateHandleFromName = (name: string): string =>
-  name
-    .toLowerCase()
-    .replace(/[^a-z0-9\s-]/g, '')
-    .replace(/\s+/g, '-')
-    .replace(/-+/g, '-')
-    .replace(/^-|-$/g, '');
-
-/**
- * BaseCreateOrganization component provides the core functionality for creating organizations.
- * This component serves as the base for framework-specific implementations.
- */
-export const BaseCreateOrganization: FC<BaseCreateOrganizationProps> = ({
-  cardLayout = true,
-  className = '',
-  defaultParentId = '',
-  error,
-  initialValues = {},
-  loading = false,
-  mode = 'inline',
-  onCancel,
-  onOpenChange,
-  onSubmit,
-  onSuccess,
-  open = false,
-  preferences,
-  renderAdditionalFields,
-  style,
-  title = 'Create Organization',
-}: BaseCreateOrganizationProps): ReactElement => {
-  const {theme, colorScheme} = useTheme();
-  const styles: ReturnType<typeof useStyles> = useStyles(theme, colorScheme);
-  const {t} = useTranslation(preferences?.i18n);
-  const [formData, setFormData] = useState<OrganizationFormData>({
-    description: '',
-    handle: '',
-    name: '',
-    ...initialValues,
-  });
-  const [formErrors, setFormErrors] = useState<Partial<OrganizationFormData> & {avatar?: string}>({});
-
-  const validateForm = (): boolean => {
-    const errors: Partial<OrganizationFormData> = {};
-
-    if (!formData.name.trim()) {
-      errors.name = 'Organization name is required';
-    }
-
-    if (!formData.handle.trim()) {
-      errors.handle = 'Organization handle is required';
-    } else if (!/^[a-z0-9-]+$/.test(formData.handle)) {
-      errors.handle = 'Handle can only contain lowercase letters, numbers, and hyphens';
-    }
-
-    if (!formData.description.trim()) {
-      errors.description = 'Organization description is required';
-    }
-
-    setFormErrors(errors);
-    return Object.keys(errors).length === 0;
-  };
-
-  const handleInputChange = (field: keyof OrganizationFormData, value: string): void => {
-    setFormData((prev: OrganizationFormData) => ({
-      ...prev,
-      [field]: value,
-    }));
-
-    if (formErrors[field]) {
-      setFormErrors((prev: Partial<OrganizationFormData> & {avatar?: string}) => ({
-        ...prev,
-        [field]: undefined,
-      }));
-    }
-  };
-
-  /**
-   * Handles changes to the organization name input.
-   * Automatically generates the organization handle based on the name if the handle is not set or matches
-   *
-   * @param value - The new value for the organization name.
-   */
-  const handleNameChange = (value: string): void => {
-    handleInputChange('name', value);
-
-    if (!formData.handle || formData.handle === generateHandleFromName(formData.name)) {
-      const newHandle: string = generateHandleFromName(value);
-      handleInputChange('handle', newHandle);
-    }
-  };
-
-  const handleSubmit = async (e: FormEvent): Promise<void> => {
-    e.preventDefault();
-
-    if (!validateForm() || loading) {
-      return;
-    }
-
-    const payload: CreateOrganizationPayload = {
-      description: formData.description.trim(),
-      name: formData.name.trim(),
-      orgHandle: formData.handle.trim(),
-      parentId: defaultParentId,
-      type: 'TENANT',
-    };
-
-    try {
-      await onSubmit?.(payload);
-      if (onSuccess) {
-        onSuccess(payload);
-      }
-    } catch (submitError) {
-      // Error handling is done by parent component
-      logger.error('Form submission error:');
-    }
-  };
-
-  const createOrganizationContent: ReactElement = (
-    <div className={cx(styles['root'], cardLayout && styles['card'], className)} style={style}>
-      <div className={cx(styles['content'])}>
-        <form id="create-organization-form" className={cx(styles['form'])} onSubmit={handleSubmit}>
-          {error && (
-            <AlertPrimitive variant="error" className={styles['errorAlert']}>
-              <AlertPrimitive.Title>Error</AlertPrimitive.Title>
-              <AlertPrimitive.Description>{error}</AlertPrimitive.Description>
-            </AlertPrimitive>
-          )}
-          <div className={cx(styles['fieldGroup'])}>
-            <TextField
-              label={`${t('elements.fields.organization.name.label')}`}
-              placeholder={t('elements.fields.organization.name.placeholder')}
-              value={formData.name}
-              onChange={(e: ChangeEvent<HTMLInputElement>): void => handleNameChange(e.target.value)}
-              disabled={loading}
-              required
-              error={formErrors.name}
-              className={cx(styles['input'])}
-            />
-          </div>
-          <div className={cx(styles['fieldGroup'])}>
-            <TextField
-              label={`${t('elements.fields.organization.handle.label') || 'Organization Handle'}`}
-              placeholder={t('elements.fields.organization.handle.placeholder') || 'my-organization'}
-              value={formData.handle}
-              onChange={(e: ChangeEvent<HTMLInputElement>): void => handleInputChange('handle', e.target.value)}
-              disabled={loading}
-              required
-              error={formErrors.handle}
-              helperText="This will be your organization's unique identifier. Only lowercase letters, numbers, and hyphens are allowed."
-              className={cx(styles['input'])}
-            />
-          </div>
-          <div className={cx(styles['fieldGroup'])}>
-            <FormControl error={formErrors.description}>
-              <InputLabel required>{t('elements.fields.organization.description.label')}</InputLabel>
-              <textarea
-                className={cx(styles['textarea'], formErrors.description && styles['textareaError'])}
-                placeholder={t('organization.create.description.placeholder')}
-                value={formData.description}
-                onChange={(e: ChangeEvent<HTMLTextAreaElement>): void =>
-                  handleInputChange('description', e.target.value)
-                }
-                disabled={loading}
-                required
-              />
-            </FormControl>
-          </div>
-          {renderAdditionalFields?.()}
-        </form>
-        <div className={cx(styles['actions'])}>
-          {onCancel && (
-            <Button type="button" variant="outline" onClick={onCancel} disabled={loading}>
-              {t('organization.create.buttons.cancel.text')}
-            </Button>
-          )}
-          <Button type="submit" variant="solid" color="primary" disabled={loading} form="create-organization-form">
-            {loading
-              ? t('organization.create.buttons.create_organization.loading.text')
-              : t('organization.create.buttons.create_organization.text')}
-          </Button>
-        </div>
-      </div>
-    </div>
-  );
-
-  if (mode === 'popup') {
-    return (
-      <DialogPrimitive open={open} onOpenChange={onOpenChange}>
-        <DialogPrimitive.Content>
-          <DialogPrimitive.Heading>{title}</DialogPrimitive.Heading>
-          <div className={styles['popup']}>{createOrganizationContent}</div>
-        </DialogPrimitive.Content>
-      </DialogPrimitive>
-    );
-  }
-
-  return createOrganizationContent;
-};
-
-export default BaseCreateOrganization;
diff --git a/packages/react/src/components/presentation/CreateOrganization/CreateOrganization.tsx b/packages/react/src/components/presentation/CreateOrganization/CreateOrganization.tsx
deleted file mode 100644
index ebb38de..0000000
--- a/packages/react/src/components/presentation/CreateOrganization/CreateOrganization.tsx
+++ /dev/null
@@ -1,147 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {CreateOrganizationPayload} from '@thunderid/browser';
-import {FC, ReactElement, useState} from 'react';
-import {BaseCreateOrganization, BaseCreateOrganizationProps} from './BaseCreateOrganization';
-import createOrganization from '../../../api/createOrganization';
-import useOrganization from '../../../contexts/Organization/useOrganization';
-import useThunderID from '../../../contexts/ThunderID/useThunderID';
-
-/**
- * Props interface for the CreateOrganization component.
- */
-export interface CreateOrganizationProps extends Omit<BaseCreateOrganizationProps, 'onSubmit' | 'loading' | 'error'> {
-  /**
-   * Fallback element to render when the user is not signed in.
-   */
-  fallback?: ReactElement | null;
-  /**
-   * Custom organization creation handler (will use default API if not provided).
-   */
-  onCreateOrganization?: (payload: CreateOrganizationPayload) => Promise<any>;
-}
-
-/**
- * CreateOrganization component that provides organization creation functionality.
- * This component automatically integrates with the ThunderID and Organization contexts.
- *
- * @example
- * ```tsx
- * import { CreateOrganization } from '@thunderid/react';
- *
- * // Basic usage - uses default API and contexts
- * <CreateOrganization
- *   onSuccess={(org) => console.log('Created:', org)}
- *   onCancel={() => navigate('/organizations')}
- * />
- *
- * // With custom organization creation handler
- * <CreateOrganization
- *   onCreateOrganization={async (payload) => {
- *     const result = await myCustomAPI.createOrganization(payload);
- *     return result;
- *   }}
- *   onSuccess={(org) => {
- *     console.log('Organization created:', org.name);
- *     // Custom success logic here
- *   }}
- * />
- *
- * // With fallback for unauthenticated users
- * <CreateOrganization
- *   fallback={<div>Please sign in to create an organization</div>}
- * />
- * ```
- */
-export const CreateOrganization: FC<CreateOrganizationProps> = ({
-  onCreateOrganization,
-  fallback = null,
-  onSuccess,
-  defaultParentId,
-  ...props
-}: CreateOrganizationProps): ReactElement | null => {
-  const {isSignedIn, baseUrl, instanceId} = useThunderID();
-  const {currentOrganization, revalidateMyOrganizations} = useOrganization();
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  if (!isSignedIn && fallback) {
-    return fallback;
-  }
-
-  if (!isSignedIn) {
-    return <></>;
-  }
-
-  // Use current organization as parent if no defaultParentId provided
-  const parentId: string = defaultParentId || currentOrganization?.id || '';
-
-  const handleSubmit = async (payload: CreateOrganizationPayload): Promise<void> => {
-    setLoading(true);
-    setError(null);
-
-    try {
-      let result: any;
-
-      if (onCreateOrganization) {
-        result = await onCreateOrganization(payload);
-      } else {
-        if (!baseUrl) {
-          throw new Error('Base URL is required for organization creation');
-        }
-
-        result = await createOrganization({
-          baseUrl,
-          instanceId,
-          payload: {
-            ...payload,
-            parentId,
-          },
-        });
-      }
-
-      await revalidateMyOrganizations();
-
-      if (onSuccess) {
-        onSuccess(result);
-      }
-    } catch (createError) {
-      const errorMessage: string = createError instanceof Error ? createError.message : 'Failed to create organization';
-
-      setError(errorMessage);
-
-      throw createError;
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  return (
-    <BaseCreateOrganization
-      onSubmit={handleSubmit}
-      loading={loading}
-      error={error}
-      defaultParentId={parentId}
-      onSuccess={onSuccess}
-      {...props}
-    />
-  );
-};
-
-export default CreateOrganization;
diff --git a/packages/react/src/components/presentation/Organization/BaseOrganization.tsx b/packages/react/src/components/presentation/Organization/BaseOrganization.tsx
deleted file mode 100644
index a74885b..0000000
--- a/packages/react/src/components/presentation/Organization/BaseOrganization.tsx
+++ /dev/null
@@ -1,84 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {Organization as IOrganization} from '@thunderid/browser';
-import {FC, ReactElement, ReactNode} from 'react';
-
-/**
- * Props for the BaseOrganization component.
- */
-export interface BaseOrganizationProps {
-  /**
-   * Render prop that takes the organization object and returns a ReactNode.
-   * @param organization - The organization object from ThunderID.
-   * @returns A ReactNode to render.
-   */
-  children: (organization: IOrganization | null) => ReactNode;
-
-  /**
-   * Optional element to render when no organization is provided.
-   */
-  fallback?: ReactNode;
-
-  /**
-   * The organization object to display. If not provided, the component will render the fallback.
-   */
-  organization: IOrganization | null;
-}
-
-/**
- * Base Organization component that provides the core functionality for displaying organization information.
- * This component takes an organization object as a prop and uses render props to expose it.
- *
- * @remarks This is the base component that can be used in any context where you have
- * an organization object available. For React applications, use the Organization component which
- * automatically retrieves the current organization from Organization context.
- *
- * @example
- * ```tsx
- * import { BaseOrganization } from '@thunderid/auth-react';
- *
- * const MyComponent = ({ organization }) => {
- *   return (
- *     <BaseOrganization organization={organization} fallback={<p>No organization data</p>}>
- *       {(org) => (
- *         <div>
- *           <h1>Organization: {org.name}</h1>
- *           <p>ID: {org.id}</p>
- *         </div>
- *       )}
- *     </BaseOrganization>
- *   );
- * }
- * ```
- */
-const BaseOrganization: FC<BaseOrganizationProps> = ({
-  children,
-  fallback = null,
-  organization,
-}: BaseOrganizationProps): ReactElement => {
-  if (!organization) {
-    return <>{fallback}</>;
-  }
-
-  return <>{children(organization)}</>;
-};
-
-BaseOrganization.displayName = 'BaseOrganization';
-
-export default BaseOrganization;
diff --git a/packages/react/src/components/presentation/Organization/Organization.tsx b/packages/react/src/components/presentation/Organization/Organization.tsx
deleted file mode 100644
index a63b23c..0000000
--- a/packages/react/src/components/presentation/Organization/Organization.tsx
+++ /dev/null
@@ -1,82 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {Organization as IOrganization} from '@thunderid/browser';
-import {FC, ReactElement, ReactNode} from 'react';
-import BaseOrganization, {BaseOrganizationProps} from './BaseOrganization';
-import useOrganization from '../../../contexts/Organization/useOrganization';
-
-/**
- * Props for the Organization component.
- * Extends BaseOrganizationProps but makes the organization prop optional since it will be obtained from useOrganization
- */
-export interface OrganizationProps extends Omit<BaseOrganizationProps, 'organization'> {
-  /**
-   * Render prop that takes the organization object and returns a ReactNode.
-   * @param organization - The current organization object from Organization context.
-   * @returns A ReactNode to render.
-   */
-  children: (organization: IOrganization | null) => ReactNode;
-
-  /**
-   * Optional element to render when no organization is selected.
-   */
-  fallback?: ReactNode;
-}
-
-/**
- * A component that uses render props to expose the current organization object.
- * This component automatically retrieves the current organization from Organization context.
- *
- * @remarks This component is only supported in browser based React applications (CSR).
- *
- * @example
- * ```tsx
- * import { Organization } from '@thunderid/auth-react';
- *
- * const App = () => {
- *   return (
- *     <Organization fallback={<p>No organization selected</p>}>
- *       {(organization) => (
- *         <div>
- *           <h1>Current Organization: {organization.name}!</h1>
- *           <p>ID: {organization.id}</p>
- *           <p>Role: {organization.role}</p>
- *           {organization.memberCount && (
- *             <p>Members: {organization.memberCount}</p>
- *           )}
- *         </div>
- *       )}
- *     </Organization>
- *   );
- * }
- * ```
- */
-const Organization: FC<OrganizationProps> = ({children, fallback = null}: OrganizationProps): ReactElement => {
-  const {currentOrganization} = useOrganization();
-
-  return (
-    <BaseOrganization organization={currentOrganization} fallback={fallback}>
-      {children}
-    </BaseOrganization>
-  );
-};
-
-Organization.displayName = 'Organization';
-
-export default Organization;
diff --git a/packages/react/src/components/presentation/OrganizationList/BaseOrganizationList.styles.ts b/packages/react/src/components/presentation/OrganizationList/BaseOrganizationList.styles.ts
deleted file mode 100644
index 8f5c99b..0000000
--- a/packages/react/src/components/presentation/OrganizationList/BaseOrganizationList.styles.ts
+++ /dev/null
@@ -1,281 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {css} from '@emotion/css';
-import {Theme} from '@thunderid/browser';
-import {useMemo} from 'react';
-
-/**
- * Creates styles for the BaseOrganizationList component using BEM methodology
- * @param theme - The theme object containing design tokens
- * @param colorScheme - The current color scheme (used for memoization)
- * @returns Object containing CSS class names for component styling
- */
-const useStyles = (theme: Theme, colorScheme: string): Record<string, string> =>
-  useMemo(() => {
-    const root: string = css`
-      padding: calc(${theme.vars.spacing.unit} * 4);
-      min-width: 600px;
-      margin: 0 auto;
-      font-family: ${theme.vars.typography.fontFamily};
-      background: ${theme.vars.colors.background.surface};
-      border-radius: ${theme.vars.borderRadius.large};
-    `;
-
-    const header: string = css`
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      margin-bottom: calc(${theme.vars.spacing.unit} * 3);
-      padding-bottom: calc(${theme.vars.spacing.unit} * 2);
-      border-bottom: 1px solid ${theme.vars.colors.border};
-    `;
-
-    const headerInfo: string = css`
-      flex: 1;
-    `;
-
-    const title: string = css`
-      font-size: 1.5rem;
-      font-weight: 600;
-      margin: 0 0 8px 0;
-      color: ${theme.vars.colors.text.primary};
-    `;
-
-    const subtitle: string = css`
-      color: ${theme.vars.colors.text.secondary};
-      font-size: 0.875rem;
-      margin: 0;
-    `;
-
-    const refreshButton: string = css`
-      background-color: ${theme.vars.colors.background.surface};
-      border: 1px solid ${theme.vars.colors.border};
-      border-radius: ${theme.vars.borderRadius.small};
-      color: ${theme.vars.colors.text.primary};
-      cursor: pointer;
-      font-size: 0.875rem;
-      padding: ${theme.vars.spacing.unit} calc(${theme.vars.spacing.unit} * 2);
-      transition: all 0.2s;
-      &:hover {
-        background-color: ${theme.vars.colors.background.surface};
-        border-color: ${theme.vars.colors.primary.main};
-      }
-    `;
-
-    const listContainer: string = css`
-      display: flex;
-      flex-direction: column;
-      gap: calc(${theme.vars.spacing.unit} * 1.5);
-    `;
-
-    const organizationItem: string = css`
-      border: 1px solid ${theme.vars.colors.border};
-      border-radius: ${theme.vars.borderRadius.medium};
-      display: flex;
-      justify-content: space-between;
-      padding: calc(${theme.vars.spacing.unit} * 2);
-      transition: all 0.2s;
-      background-color: ${theme.vars.colors.background.surface};
-      &:hover {
-        border-color: ${theme.vars.colors.primary.main};
-        box-shadow: 0 2px 8px ${theme.vars.colors.primary.main}20;
-      }
-    `;
-
-    const organizationContent: string = css`
-      display: flex;
-      align-items: center;
-      gap: calc(${theme.vars.spacing.unit} * 2);
-      flex: 1;
-    `;
-
-    const organizationInfo: string = css`
-      flex: 1;
-    `;
-
-    const organizationName: string = css`
-      font-size: 1.125rem;
-      font-weight: 600;
-      margin: 0 0 4px 0;
-      color: ${theme.vars.colors.text.primary};
-    `;
-
-    const organizationHandle: string = css`
-      color: ${theme.vars.colors.text.secondary};
-      font-size: 0.875rem;
-      margin: 0 0 4px 0;
-      font-family: monospace;
-    `;
-
-    const organizationStatus: string = css`
-      color: ${theme.vars.colors.text.secondary};
-      font-size: 0.875rem;
-      margin: 0;
-    `;
-
-    const statusText: string = css`
-      font-weight: 500;
-    `;
-
-    const statusTextActive: string = css`
-      color: ${theme.vars.colors.success.main};
-    `;
-
-    const statusTextInactive: string = css`
-      color: ${theme.vars.colors.error.main};
-    `;
-
-    const organizationActions: string = css`
-      display: flex;
-      align-items: center;
-    `;
-
-    const badge: string = css`
-      border-radius: ${theme.vars.borderRadius.large};
-      font-size: 0.75rem;
-      font-weight: 500;
-      padding: calc(${theme.vars.spacing.unit} / 2) calc(${theme.vars.spacing.unit} * 1.5);
-      text-transform: uppercase;
-      letter-spacing: 0.5px;
-    `;
-
-    const badgeSuccess: string = css`
-      background-color: color-mix(in srgb, ${theme.vars.colors.success.main} 20%, transparent);
-      color: ${theme.vars.colors.success.main};
-    `;
-
-    const badgeError: string = css`
-      background-color: color-mix(in srgb, ${theme.vars.colors.error.main} 20%, transparent);
-      color: ${theme.vars.colors.error.main};
-    `;
-
-    const loadingContainer: string = css`
-      padding: calc(${theme.vars.spacing.unit} * 4);
-      text-align: center;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      gap: calc(${theme.vars.spacing.unit} * 2);
-    `;
-
-    const loadingText: string = css`
-      margin-top: ${theme.vars.spacing.unit};
-    `;
-
-    const errorContainer: string = css`
-      background-color: color-mix(in srgb, ${theme.vars.colors.error.main} 20%, transparent);
-      border: 1px solid ${theme.vars.colors.error.main};
-      border-radius: ${theme.vars.borderRadius.medium};
-      color: ${theme.vars.colors.error.main};
-      padding: calc(${theme.vars.spacing.unit} * 2);
-    `;
-
-    const emptyContainer: string = css`
-      padding: calc(${theme.vars.spacing.unit} * 4);
-      text-align: center;
-    `;
-
-    const emptyText: string = css`
-      color: ${theme.vars.colors.text.secondary};
-      font-size: 1rem;
-    `;
-
-    const loadMoreButton: string = css`
-      background-color: ${theme.vars.colors.primary.main};
-      border: none;
-      border-radius: ${theme.vars.borderRadius.medium};
-      color: ${theme.vars.colors.primary.contrastText};
-      cursor: pointer;
-      font-size: 0.875rem;
-      font-weight: 500;
-      padding: calc(${theme.vars.spacing.unit} * 1.5) calc(${theme.vars.spacing.unit} * 3);
-      width: 100%;
-      transition: all 0.2s;
-      &:hover:not(:disabled) {
-        background-color: ${theme.vars.colors.primary.main};
-        opacity: 0.9;
-      }
-      &:disabled {
-        background-color: ${theme.vars.colors.text.secondary};
-        cursor: not-allowed;
-        opacity: 0.6;
-      }
-    `;
-
-    const errorMargin: string = css`
-      margin-top: calc(${theme.vars.spacing.unit} * 2);
-    `;
-
-    const loadMoreMargin: string = css`
-      margin-top: calc(${theme.vars.spacing.unit} * 3);
-    `;
-
-    const popupContent: string = css`
-      padding: ${theme.vars.spacing.unit};
-    `;
-
-    return {
-      badge,
-      badgeError,
-      badgeSuccess,
-      emptyContainer,
-      emptyText,
-      errorContainer,
-      errorMargin,
-      header,
-      headerInfo,
-      listContainer,
-      loadMoreButton,
-      loadMoreMargin,
-      loadingContainer,
-      loadingText,
-      organizationActions,
-      organizationContent,
-      organizationHandle,
-      organizationInfo,
-      organizationItem,
-      organizationName,
-      organizationStatus,
-      popupContent,
-      refreshButton,
-      root,
-      statusText,
-      statusTextActive,
-      statusTextInactive,
-      subtitle,
-      title,
-    };
-  }, [
-    theme.vars.spacing.unit,
-    theme.vars.colors.background.surface,
-    theme.vars.colors.border,
-    theme.vars.borderRadius.large,
-    theme.vars.borderRadius.medium,
-    theme.vars.borderRadius.small,
-    theme.vars.colors.text.primary,
-    theme.vars.colors.text.secondary,
-    theme.vars.colors.primary.main,
-    theme.vars.colors.success.main,
-    theme.vars.colors.error.main,
-    theme.vars.colors.primary.contrastText,
-    theme.vars.typography.fontFamily,
-    colorScheme,
-  ]);
-
-export default useStyles;
diff --git a/packages/react/src/components/presentation/OrganizationList/BaseOrganizationList.tsx b/packages/react/src/components/presentation/OrganizationList/BaseOrganizationList.tsx
deleted file mode 100644
index 2c35534..0000000
--- a/packages/react/src/components/presentation/OrganizationList/BaseOrganizationList.tsx
+++ /dev/null
@@ -1,432 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {cx} from '@emotion/css';
-import {AllOrganizationsApiResponse, Organization, Preferences} from '@thunderid/browser';
-import {CSSProperties, FC, MouseEvent, ReactElement, ReactNode, useMemo} from 'react';
-import useStyles from './BaseOrganizationList.styles';
-import useTheme from '../../../contexts/Theme/useTheme';
-import useTranslation from '../../../hooks/useTranslation';
-import {Avatar as AvatarPrimitive} from '../../primitives/Avatar/Avatar';
-import Button from '../../primitives/Button/Button';
-import DialogPrimitive from '../../primitives/Dialog/Dialog';
-import Spinner from '../../primitives/Spinner/Spinner';
-import Typography from '../../primitives/Typography/Typography';
-
-export interface OrganizationWithSwitchAccess extends Organization {
-  canSwitch: boolean;
-}
-
-/**
- * Props interface for the BaseOrganizationList component.
- */
-export interface BaseOrganizationListProps {
-  /**
-   * List of organizations discoverable to the signed-in user.
-   */
-  allOrganizations: AllOrganizationsApiResponse;
-  /**
-   * Additional CSS class names to apply to the container
-   */
-  className?: string;
-  /**
-   * Error message to display
-   */
-  error?: string | null;
-  /**
-   * Function called when "Load More" is clicked
-   */
-  fetchMore?: () => Promise<void>;
-  /**
-   * Whether there are more organizations to load
-   */
-  hasMore?: boolean;
-  /**
-   * Whether the initial data is loading
-   */
-  isLoading?: boolean;
-  /**
-   * Whether more data is being loaded
-   */
-  isLoadingMore?: boolean;
-  /**
-   * Display mode: 'inline' for normal display, 'popup' for modal dialog
-   */
-  mode?: 'inline' | 'popup';
-  /**
-   * List of organizations associated to the signed-in user.
-   */
-  myOrganizations: Organization[];
-  /**
-   * Function called when popup open state changes (only used in popup mode)
-   */
-  onOpenChange?: (open: boolean) => void;
-  /**
-   * Function called when an organization is selected/clicked
-   */
-  onOrganizationSelect?: (organization: OrganizationWithSwitchAccess) => void;
-  /**
-   * Function called when refresh is requested
-   */
-  onRefresh?: () => Promise<void>;
-  /**
-   * Whether the popup is open (only used in popup mode)
-   */
-  open?: boolean;
-  /**
-   * Component-level preferences to override global i18n and theme settings.
-   * Preferences are deep-merged with global ones, with component preferences
-   * taking precedence. Affects this component and all its descendants.
-   */
-  preferences?: Preferences;
-  /**
-   * Custom renderer for when no organizations are found
-   */
-  renderEmpty?: () => ReactNode;
-  /**
-   * Custom renderer for the error state
-   */
-  renderError?: (error: string) => ReactNode;
-  /**
-   * Custom renderer for the load more button
-   */
-  renderLoadMore?: (onLoadMore: () => Promise<void>, isLoading: boolean) => ReactNode;
-  /**
-   * Custom renderer for the loading state
-   */
-  renderLoading?: () => ReactNode;
-  /**
-   * Custom renderer for each organization item
-   */
-  renderOrganization?: (organization: OrganizationWithSwitchAccess, index: number) => ReactNode;
-  /**
-   * Whether to show the organization status in the list
-   */
-  showStatus?: boolean;
-  /**
-   * Inline styles to apply to the container
-   */
-  style?: CSSProperties;
-
-  /**
-   * Title for the popup dialog (only used in popup mode)
-   */
-  title?: string;
-}
-
-/**
- * Default organization item renderer
- */
-const defaultRenderOrganization = (
-  organization: OrganizationWithSwitchAccess,
-  styles: any,
-  t: (key: string, params?: Record<string, string | number>) => string,
-  onOrganizationSelect?: (organization: OrganizationWithSwitchAccess) => void,
-  showStatus?: boolean,
-): ReactNode => (
-  <div key={organization.id} className={cx(styles.organizationItem)}>
-    <div className={cx(styles.organizationContent)}>
-      <AvatarPrimitive variant="square" name={organization.name} size={48} alt={`${organization.name} logo`} />
-      <div className={cx(styles.organizationInfo)}>
-        <Typography variant="h6" className={cx(styles.organizationName)}>
-          {organization.name}
-        </Typography>
-        <Typography variant="body2" color="textSecondary" className={cx(styles.organizationHandle)}>
-          @{organization.orgHandle}
-        </Typography>
-        {showStatus && (
-          <Typography variant="body2" color="textSecondary" className={cx(styles.organizationStatus)}>
-            {t('organization.switcher.status.label')}{' '}
-            <span
-              className={cx(
-                styles.statusText,
-                organization.status === 'ACTIVE' ? styles.statusTextActive : styles.statusTextInactive,
-              )}
-            >
-              {organization.status}
-            </span>
-          </Typography>
-        )}
-      </div>
-    </div>
-    {organization.canSwitch && (
-      <div className={cx(styles.organizationActions)}>
-        <Button
-          onClick={(e: MouseEvent<HTMLButtonElement>): void => {
-            e.stopPropagation();
-            onOrganizationSelect?.(organization);
-          }}
-          type="button"
-          size="small"
-        >
-          {t('organization.switcher.buttons.switch.text')}
-        </Button>
-      </div>
-    )}
-  </div>
-);
-
-/**
- * Default loading renderer
- */
-const defaultRenderLoading = (
-  t: (key: string, params?: Record<string, string | number>) => string,
-  styles: any,
-): ReactNode => (
-  <div className={cx(styles.loadingContainer)}>
-    <Spinner size="medium" />
-    <Typography variant="body1" color="textSecondary" className={cx(styles.loadingText)}>
-      {t('organization.switcher.loading.placeholder.organizations')}
-    </Typography>
-  </div>
-);
-
-/**
- * Default error renderer
- */
-const defaultRenderError = (
-  errorMessage: string,
-  t: (key: string, params?: Record<string, string | number>) => string,
-  styles: any,
-): ReactNode => (
-  <div className={cx(styles.errorContainer)}>
-    <Typography variant="body1" color="error">
-      <strong>{t('organization.switcher.error.prefix')}</strong> {errorMessage}
-    </Typography>
-  </div>
-);
-
-/**
- * Default load more button renderer
- */
-const defaultRenderLoadMore = (
-  onLoadMore: () => Promise<void>,
-  isLoadingMore: boolean,
-  t: (key: string, params?: Record<string, string | number>) => string,
-  styles: any,
-): ReactNode => (
-  <Button onClick={onLoadMore} disabled={isLoadingMore} className={cx(styles.loadMoreButton)} type="button" fullWidth>
-    {isLoadingMore ? t('organization.switcher.loading.more') : t('organization.switcher.buttons.load_more.text')}
-  </Button>
-);
-
-/**
- * Default empty state renderer
- */
-const defaultRenderEmpty = (
-  t: (key: string, params?: Record<string, string | number>) => string,
-  styles: any,
-): ReactNode => (
-  <div className={cx(styles.emptyContainer)}>
-    <Typography variant="body1" color="textSecondary" className={cx(styles.emptyText)}>
-      {t('organization.switcher.no.organizations')}
-    </Typography>
-  </div>
-);
-
-/**
- * BaseOrganizationList component displays a list of organizations with pagination support.
- * This component serves as the base for framework-specific implementations.
- *
- * @example
- * ```tsx
- * <BaseOrganizationList
- *   data={organizations}
- *   isLoading={isLoading}
- *   hasMore={hasMore}
- *   fetchMore={fetchMore}
- *   error={error}
- * />
- * ```
- */
-export const BaseOrganizationList: FC<BaseOrganizationListProps> = ({
-  className = '',
-  allOrganizations,
-  myOrganizations,
-  error,
-  fetchMore,
-  hasMore = false,
-  isLoading = false,
-  isLoadingMore = false,
-  mode = 'inline',
-  onOpenChange,
-  onOrganizationSelect,
-  onRefresh,
-  open = false,
-  renderEmpty,
-  renderError,
-  renderLoading,
-  renderLoadMore,
-  renderOrganization,
-  style,
-  title = 'Organizations',
-  showStatus,
-  preferences,
-}: BaseOrganizationListProps): ReactElement => {
-  const {theme, colorScheme} = useTheme();
-  const styles: ReturnType<typeof useStyles> = useStyles(theme, colorScheme);
-  const {t} = useTranslation(preferences?.i18n);
-
-  const organizationsWithSwitchAccess: OrganizationWithSwitchAccess[] = useMemo(() => {
-    if (!allOrganizations?.organizations) {
-      return [];
-    }
-
-    const myOrgIds = new Set<string>(myOrganizations?.map((org: Organization) => org.id) || []);
-
-    return allOrganizations.organizations.map((org: Organization) => ({
-      ...org,
-      canSwitch: myOrgIds.has(org.id),
-    }));
-  }, [allOrganizations?.organizations, myOrganizations]);
-
-  const renderLoadingWithStyles: () => ReactNode = renderLoading || ((): ReactNode => defaultRenderLoading(t, styles));
-  const renderErrorWithStyles: (errorMsg: string) => ReactNode =
-    renderError || ((errorMsg: string): ReactNode => defaultRenderError(errorMsg, t, styles));
-  const renderEmptyWithStyles: () => ReactNode = renderEmpty || ((): ReactNode => defaultRenderEmpty(t, styles));
-  const renderLoadMoreWithStyles: (onLoadMore: () => Promise<void>, loadingMore: boolean) => ReactNode =
-    renderLoadMore ||
-    ((onLoadMore: () => Promise<void>, loadingMore: boolean): ReactNode =>
-      defaultRenderLoadMore(onLoadMore, loadingMore, t, styles));
-  const renderOrganizationWithStyles: (org: OrganizationWithSwitchAccess, index: number) => ReactNode =
-    renderOrganization ||
-    ((org: OrganizationWithSwitchAccess): ReactNode =>
-      defaultRenderOrganization(org, styles, t, onOrganizationSelect, showStatus));
-
-  if (isLoading && organizationsWithSwitchAccess?.length === 0) {
-    const loadingContent: ReactElement = (
-      <div className={cx(styles['root'], className)} style={style}>
-        {renderLoadingWithStyles()}
-      </div>
-    );
-
-    if (mode === 'popup') {
-      return (
-        <DialogPrimitive open={open} onOpenChange={onOpenChange}>
-          <DialogPrimitive.Content>
-            <DialogPrimitive.Heading>{title}</DialogPrimitive.Heading>
-            <div className={cx(styles['popupContent'])}>{loadingContent}</div>
-          </DialogPrimitive.Content>
-        </DialogPrimitive>
-      );
-    }
-
-    return loadingContent;
-  }
-
-  if (error && organizationsWithSwitchAccess?.length === 0) {
-    const errorContent: ReactElement = (
-      <div className={cx(styles['root'], className)} style={style}>
-        {renderErrorWithStyles(error)}
-      </div>
-    );
-
-    if (mode === 'popup') {
-      return (
-        <DialogPrimitive open={open} onOpenChange={onOpenChange}>
-          <DialogPrimitive.Content>
-            <DialogPrimitive.Heading>{title}</DialogPrimitive.Heading>
-            <div className={cx(styles['popupContent'])}>{errorContent}</div>
-          </DialogPrimitive.Content>
-        </DialogPrimitive>
-      );
-    }
-
-    return errorContent;
-  }
-
-  if (!isLoading && organizationsWithSwitchAccess?.length === 0) {
-    const emptyContent: ReactElement = (
-      <div className={cx(styles['root'], className)} style={style}>
-        {renderEmptyWithStyles()}
-      </div>
-    );
-
-    if (mode === 'popup') {
-      return (
-        <DialogPrimitive open={open} onOpenChange={onOpenChange}>
-          <DialogPrimitive.Content>
-            <DialogPrimitive.Heading>{title}</DialogPrimitive.Heading>
-            <div className={cx(styles['popupContent'])}>{emptyContent}</div>
-          </DialogPrimitive.Content>
-        </DialogPrimitive>
-      );
-    }
-
-    return emptyContent;
-  }
-
-  const organizationListContent: ReactElement = (
-    <div className={cx(styles['root'], className)} style={style}>
-      {/* Header with total count and refresh button */}
-      <div className={cx(styles['header'])}>
-        <div className={cx(styles['headerInfo'])}>
-          <Typography variant="body2" color="textSecondary" className={cx(styles['subtitle'])}>
-            {t('organization.switcher.showing.count', {
-              showing: organizationsWithSwitchAccess?.length,
-              total: allOrganizations?.organizations?.length || 0,
-            })}
-          </Typography>
-        </div>
-        {onRefresh && (
-          <Button
-            onClick={onRefresh}
-            className={cx(styles['refreshButton'])}
-            type="button"
-            variant="outline"
-            size="small"
-          >
-            {t('organization.switcher.buttons.refresh.text')}
-          </Button>
-        )}
-      </div>
-
-      {/* Organizations list */}
-      <div className={cx(styles['listContainer'])}>
-        {organizationsWithSwitchAccess?.map((organization: OrganizationWithSwitchAccess, index: number) =>
-          renderOrganizationWithStyles(organization, index),
-        )}
-      </div>
-
-      {/* Error message for additional data */}
-      {error && organizationsWithSwitchAccess?.length > 0 && (
-        <div className={cx(styles['errorMargin'])}>{renderErrorWithStyles(error)}</div>
-      )}
-
-      {/* Load more button */}
-      {hasMore && fetchMore && (
-        <div className={cx(styles['loadMoreMargin'])}>{renderLoadMoreWithStyles(fetchMore, isLoadingMore)}</div>
-      )}
-    </div>
-  );
-
-  if (mode === 'popup') {
-    return (
-      <DialogPrimitive open={open} onOpenChange={onOpenChange}>
-        <DialogPrimitive.Content>
-          <DialogPrimitive.Heading>{title}</DialogPrimitive.Heading>
-          <div className={cx(styles['popupContent'])}>{organizationListContent}</div>
-        </DialogPrimitive.Content>
-      </DialogPrimitive>
-    );
-  }
-
-  return organizationListContent;
-};
-
-export default BaseOrganizationList;
diff --git a/packages/react/src/components/presentation/OrganizationList/OrganizationList.styles.ts b/packages/react/src/components/presentation/OrganizationList/OrganizationList.styles.ts
deleted file mode 100644
index 7ececef..0000000
--- a/packages/react/src/components/presentation/OrganizationList/OrganizationList.styles.ts
+++ /dev/null
@@ -1,89 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {css} from '@emotion/css';
-import {Theme} from '@thunderid/browser';
-import {useMemo} from 'react';
-
-/**
- * Creates styles for the OrganizationList component using BEM methodology
- * @param theme - The theme object containing design tokens
- * @param colorScheme - The current color scheme (used for memoization)
- * @returns Object containing CSS class names for component styling
- */
-const useStyles = (theme: Theme, colorScheme: string): Record<string, string> =>
-  useMemo(() => {
-    const cssOrganizationListWrapper: string = css`
-      /* Container wrapper styles for OrganizationList component */
-      width: 100%;
-      font-family: ${theme.vars.typography.fontFamily};
-
-      &__container {
-        position: relative;
-        width: 100%;
-      }
-
-      &__error-state {
-        padding: calc(${theme.vars.spacing.unit} * 2);
-        background-color: color-mix(in srgb, ${theme.vars.colors.error.main} 10%, transparent);
-        border: 1px solid ${theme.vars.colors.error.main};
-        border-radius: ${theme.vars.borderRadius.medium};
-        color: ${theme.vars.colors.error.main};
-        text-align: center;
-      }
-
-      &__loading-overlay {
-        position: absolute;
-        inset: 0;
-        background-color: color-mix(in srgb, ${theme.vars.colors.background.surface} 80%, transparent);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        border-radius: ${theme.vars.borderRadius.large};
-        backdrop-filter: blur(2px);
-      }
-    `;
-
-    return {
-      container: css`
-        position: relative;
-        width: 100%;
-      `,
-      errorState: css`
-        padding: calc(${theme.vars.spacing.unit} * 2);
-        background-color: color-mix(in srgb, ${theme.vars.colors.error.main} 10%, transparent);
-        border: 1px solid ${theme.vars.colors.error.main};
-        border-radius: ${theme.vars.borderRadius.medium};
-        color: ${theme.vars.colors.error.main};
-        text-align: center;
-      `,
-      loadingOverlay: css`
-        position: absolute;
-        inset: 0;
-        background-color: color-mix(in srgb, ${theme.vars.colors.background.surface} 80%, transparent);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        border-radius: ${theme.vars.borderRadius.large};
-        backdrop-filter: blur(2px);
-      `,
-      root: cssOrganizationListWrapper,
-    };
-  }, [theme, colorScheme]);
-
-export default useStyles;
diff --git a/packages/react/src/components/presentation/OrganizationList/OrganizationList.tsx b/packages/react/src/components/presentation/OrganizationList/OrganizationList.tsx
deleted file mode 100644
index 012c2d9..0000000
--- a/packages/react/src/components/presentation/OrganizationList/OrganizationList.tsx
+++ /dev/null
@@ -1,143 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {cx} from '@emotion/css';
-import {AllOrganizationsApiResponse} from '@thunderid/browser';
-import {FC, ReactElement, useEffect, useState} from 'react';
-import {
-  BaseOrganizationList as BaseOrganizationListComponent,
-  BaseOrganizationListProps,
-  OrganizationWithSwitchAccess,
-} from './BaseOrganizationList';
-import useStyles from './OrganizationList.styles';
-import useOrganization from '../../../contexts/Organization/useOrganization';
-import useTheme from '../../../contexts/Theme/useTheme';
-
-/**
- * Configuration options for the OrganizationList component.
- */
-export interface OrganizationListConfig {
-  /**
-   * Whether to automatically fetch organizations on mount
-   */
-  autoFetch?: boolean;
-  /**
-   * Filter string for organizations
-   */
-  filter?: string;
-  /**
-   * Number of organizations to fetch per page
-   */
-  limit?: number;
-  /**
-   * Whether to include recursive organizations
-   */
-  recursive?: boolean;
-}
-
-/**
- * Props interface for the OrganizationList component.
- * Uses the enhanced OrganizationContext instead of the useOrganizations hook.
- */
-export interface OrganizationListProps
-  extends Omit<
-      BaseOrganizationListProps,
-      'myOrganizations' | 'allOrganizations' | 'error' | 'fetchMore' | 'hasMore' | 'isLoading' | 'isLoadingMore'
-    >,
-    OrganizationListConfig {
-  /**
-   * Function called when an organization is selected/clicked
-   */
-  onOrganizationSelect?: (organization: OrganizationWithSwitchAccess) => void;
-}
-
-/**
- * OrganizationList component that provides organization listing functionality with pagination.
- * This component uses the enhanced OrganizationContext, eliminating the polling issue and
- * providing better integration with the existing context system.
- *
- * @example
- * ```tsx
- * import { OrganizationList } from '@thunderid/react';
- *
- * // Basic usage
- * <OrganizationList />
- *
- * // With custom limit and filter
- * <OrganizationList
- *   limit={20}
- *   filter="active"
- *   onOrganizationSelect={(org) => {
- *     console.log('Selected organization:', org.name);
- *   }}
- * />
- *
- * // As a popup dialog
- * <OrganizationList
- *   mode="popup"
- *   open={isOpen}
- *   onOpenChange={setIsOpen}
- *   title="Select Organization"
- * />
- *
- * // With custom organization renderer
- * <OrganizationList
- *   renderOrganization={(org) => (
- *     <div key={org.id}>
- *       <h3>{org.name}</h3>
- *       <p>Can switch: {org.canSwitch ? 'Yes' : 'No'}</p>
- *     </div>
- *   )}
- * />
- * ```
- */
-export const OrganizationList: FC<OrganizationListProps> = (props: OrganizationListProps): ReactElement => {
-  const {onOrganizationSelect, className = '', style, ...baseProps} = props;
-  const {autoFetch, filter, limit, recursive, ...filteredBaseProps} = baseProps;
-
-  const {theme, colorScheme} = useTheme();
-  const styles: ReturnType<typeof useStyles> = useStyles(theme, colorScheme);
-  const {getAllOrganizations, error, isLoading, myOrganizations} = useOrganization();
-
-  const [allOrganizations, setAllOrganizations] = useState<AllOrganizationsApiResponse>({
-    organizations: [],
-  });
-
-  useEffect(() => {
-    (async (): Promise<void> => {
-      setAllOrganizations(await getAllOrganizations());
-    })();
-  }, []);
-
-  return (
-    <div className={cx(styles['root'], className)} style={style}>
-      <div className={cx(styles['container'])}>
-        <BaseOrganizationListComponent
-          allOrganizations={allOrganizations}
-          myOrganizations={myOrganizations}
-          error={error}
-          isLoading={isLoading}
-          onOrganizationSelect={onOrganizationSelect}
-          {...filteredBaseProps}
-        />
-      </div>
-    </div>
-  );
-};
-
-export default OrganizationList;
diff --git a/packages/react/src/components/presentation/OrganizationProfile/BaseOrganizationProfile.styles.ts b/packages/react/src/components/presentation/OrganizationProfile/BaseOrganizationProfile.styles.ts
deleted file mode 100644
index f238389..0000000
--- a/packages/react/src/components/presentation/OrganizationProfile/BaseOrganizationProfile.styles.ts
+++ /dev/null
@@ -1,182 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {css} from '@emotion/css';
-import {Theme} from '@thunderid/browser';
-import {useMemo} from 'react';
-
-/**
- * Creates styles for the BaseOrganizationProfile component using BEM methodology
- * @param theme - The theme object containing design tokens
- * @param colorScheme - The current color scheme (used for memoization)
- * @returns Object containing CSS class names for component styling
- */
-const useStyles = (theme: Theme, colorScheme: string): Record<string, string> =>
-  useMemo(
-    () => ({
-      attributeItem: css`
-        display: flex;
-        gap: ${theme.vars.spacing.unit};
-        padding: calc(${theme.vars.spacing.unit} / 4) 0;
-        align-items: center;
-      `,
-      attributeKey: css`
-        font-size: 0.75rem;
-        font-weight: 500;
-        color: ${theme.vars.colors.text.secondary};
-        min-width: 80px;
-        flex-shrink: 0;
-      `,
-      attributeValue: css`
-        font-size: 0.75rem;
-        color: ${theme.vars.colors.text.primary};
-        word-break: break-word;
-        flex: 1;
-      `,
-      attributesList: css`
-        display: flex;
-        flex-direction: column;
-        gap: calc(${theme.vars.spacing.unit} / 4);
-      `,
-      card: css`
-        background: ${theme.vars.colors.background.surface};
-        border-radius: ${theme.vars.borderRadius.large};
-      `,
-      editButton: css`
-        min-width: auto;
-        padding: calc(${theme.vars.spacing.unit} / 2);
-        min-height: auto;
-      `,
-      field: css`
-        display: flex;
-        align-items: flex-start;
-        padding: calc(${theme.vars.spacing.unit} / 2) 0;
-        border-bottom: 1px solid ${theme.vars.colors.border};
-        min-height: 28px;
-        gap: ${theme.vars.spacing.unit};
-      `,
-      fieldActions: css`
-        display: flex;
-        align-items: center;
-        gap: calc(${theme.vars.spacing.unit} / 2);
-      `,
-      fieldContent: css`
-        flex: 1;
-        display: flex;
-        align-items: center;
-        gap: ${theme.vars.spacing.unit};
-      `,
-      fieldInput: css`
-        margin-bottom: 0;
-      `,
-      fieldLast: css`
-        border-bottom: none;
-      `,
-      handle: css`
-        font-size: 1rem;
-        color: ${theme.vars.colors.text.secondary};
-        margin: 0;
-        font-family: monospace;
-      `,
-      header: css`
-        display: flex;
-        align-items: center;
-        gap: calc(${theme.vars.spacing.unit} * 2);
-        margin-bottom: calc(${theme.vars.spacing.unit} * 3);
-        padding-bottom: calc(${theme.vars.spacing.unit} * 2);
-      `,
-      infoContainer: css`
-        display: flex;
-        flex-direction: column;
-        gap: ${theme.vars.spacing.unit};
-      `,
-      label: css`
-        font-size: 0.875rem;
-        font-weight: 500;
-        color: ${theme.vars.colors.text.secondary};
-        width: 120px;
-        flex-shrink: 0;
-        line-height: 28px;
-      `,
-      name: css`
-        font-size: 1.5rem;
-        font-weight: 600;
-        margin: 0 0 8px 0;
-        color: ${theme.vars.colors.text.primary};
-      `,
-      orgInfo: css`
-        flex: 1;
-      `,
-      permissionBadge: css`
-        padding: calc(${theme.vars.spacing.unit} / 4) ${theme.vars.spacing.unit};
-        border-radius: ${theme.vars.borderRadius.small};
-        font-size: 0.75rem;
-        background-color: ${theme.vars.colors.primary.main};
-        color: ${theme.vars.colors.primary.contrastText};
-        border: 1px solid ${theme.vars.colors.border};
-      `,
-      permissionsList: css`
-        display: flex;
-        flex-wrap: wrap;
-        gap: calc(${theme.vars.spacing.unit} / 2);
-      `,
-      placeholderButton: css`
-        font-style: italic;
-        text-decoration: underline;
-        opacity: 0.7;
-        padding: 0;
-        min-height: auto;
-      `,
-      popup: css`
-        padding: calc(${theme.vars.spacing.unit} * 2);
-      `,
-      root: css`
-        padding: calc(${theme.vars.spacing.unit} * 4);
-        min-width: 600px;
-        margin: 0 auto;
-        font-family: ${theme.vars.typography.fontFamily};
-      `,
-      statusBadge: css`
-        padding: calc(${theme.vars.spacing.unit} / 2) ${theme.vars.spacing.unit};
-        border-radius: ${theme.vars.borderRadius.small};
-        font-size: 0.75rem;
-        font-weight: 500;
-        color: white;
-        text-transform: uppercase;
-        letter-spacing: 0.5px;
-      `,
-      value: css`
-        color: ${theme.vars.colors.text.primary};
-        flex: 1;
-        display: flex;
-        align-items: center;
-        gap: ${theme.vars.spacing.unit};
-        overflow: hidden;
-        min-height: 28px;
-        line-height: 28px;
-        word-break: break-word;
-      `,
-      valueEmpty: css`
-        font-style: italic;
-        opacity: 0.7;
-      `,
-    }),
-    [theme, colorScheme],
-  );
-
-export default useStyles;
diff --git a/packages/react/src/components/presentation/OrganizationProfile/BaseOrganizationProfile.tsx b/packages/react/src/components/presentation/OrganizationProfile/BaseOrganizationProfile.tsx
deleted file mode 100644
index b5c11c8..0000000
--- a/packages/react/src/components/presentation/OrganizationProfile/BaseOrganizationProfile.tsx
+++ /dev/null
@@ -1,541 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {cx} from '@emotion/css';
-import {OrganizationDetails, formatDate, Preferences} from '@thunderid/browser';
-import {FC, ReactElement, ReactNode, useState, useCallback} from 'react';
-import useStyles from './BaseOrganizationProfile.styles';
-import useTheme from '../../../contexts/Theme/useTheme';
-import {Avatar} from '../../primitives/Avatar/Avatar';
-import Button from '../../primitives/Button/Button';
-import CardPrimitive from '../../primitives/Card/Card';
-import DialogPrimitive from '../../primitives/Dialog/Dialog';
-import KeyValueInput from '../../primitives/KeyValueInput/KeyValueInput';
-import TextField from '../../primitives/TextField/TextField';
-
-export interface BaseOrganizationProfileProps {
-  /**
-   * Callback fired when the cancel button is clicked (only used in editable mode).
-   */
-  cancelButtonText?: string;
-
-  /**
-   * Whether to display the profile in a card layout.
-   */
-  cardLayout?: boolean;
-
-  /**
-   * CSS class name for styling the component.
-   */
-  className?: string;
-
-  /**
-   * Whether the organization profile is editable.
-   */
-  editable?: boolean;
-
-  /**
-   * Component to render when no organization data is available.
-   */
-  fallback?: ReactElement | null;
-
-  /**
-   * Array of field configurations to display. Each field specifies what organization data to show.
-   */
-  fields?: {
-    editable?: boolean;
-    key: keyof OrganizationDetails | 'attributes';
-    label: string;
-    render?: (value: any, organization: OrganizationDetails) => ReactNode;
-  }[];
-
-  /**
-   * Display mode for the component.
-   */
-  mode?: 'inline' | 'popup';
-
-  /**
-   * Callback fired when a field value changes.
-   */
-  onChange?: (field: string, value: any) => void;
-
-  /**
-   * Callback fired when the popup should be closed (only used in popup mode).
-   */
-  onOpenChange?: (open: boolean) => void;
-
-  /**
-   * Callback fired when the form is submitted (only used in editable mode).
-   */
-  onSubmit?: (data: any) => void;
-
-  /**
-   * Callback fired when the organization should be updated.
-   */
-  onUpdate?: (payload: any) => Promise<void>;
-
-  /**
-   * Whether the popup is open (only used in popup mode).
-   */
-  open?: boolean;
-
-  /**
-   * The organization details to display.
-   */
-  organization?: OrganizationDetails | null;
-
-  /**
-   * Component-level preferences to override global i18n and theme settings.
-   * Preferences are deep-merged with global ones, with component preferences
-   * taking precedence. Affects this component and all its descendants.
-   */
-  preferences?: Preferences;
-
-  /**
-   * Text for the save button (only used in editable mode).
-   */
-  saveButtonText?: string;
-
-  /**
-   * Custom title for the profile.
-   */
-  title?: string;
-}
-
-/**
- * BaseOrganizationProfile component displays organization information in a
- * structured and styled format. It shows organization details such as name,
- * description, status, and other available information with support for inline editing.
- *
- * This is the base component that can be used in any context where you have
- * an organization object available. It provides editing capabilities similar to
- * the UserProfile component, allowing users to modify organization fields directly.
- *
- * @example
- * ```tsx
- * // Basic usage
- * <BaseOrganizationProfile organization={organizationData} />
- *
- * // With editing enabled and update handler
- * <BaseOrganizationProfile
- *   organization={organizationData}
- *   editable={true}
- *   onUpdate={async (payload) => {
- *     await updateOrganizationAPI(orgId, payload);
- *   }}
- * />
- *
- * // With card layout and custom title
- * <BaseOrganizationProfile
- *   organization={organizationData}
- *   cardLayout={true}
- *   title="Organization Details"
- *   fallback={<div>No organization data available</div>}
- * />
- *
- * // With custom fields configuration
- * <BaseOrganizationProfile
- *   organization={organizationData}
- *   fields={[
- *     { key: 'id', label: 'Organization ID', editable: false },
- *     { key: 'name', label: 'Organization Name', editable: true },
- *     { key: 'description', label: 'Description', editable: true, render: (value) => value || 'No description' },
- *     { key: 'created', label: 'Created Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },
- *     { key: 'attributes', label: 'Custom Attributes', editable: true }
- *   ]}
- *   onUpdate={handleUpdate}
- * />
- *
- * // In popup mode
- * <BaseOrganizationProfile
- *   organization={organizationData}
- *   mode="popup"
- *   open={isOpen}
- *   onOpenChange={setIsOpen}
- *   title="Edit Organization"
- * />
- * ```
- * <BaseOrganizationProfile
- *   organization={organizationData}
- *   fields={[
- *     { key: 'id', label: 'Organization ID' },
- *     { key: 'name', label: 'Organization Name' },
- *     { key: 'description', label: 'Description', render: (value) => value || 'No description' },
- *     { key: 'created', label: 'Created Date', render: (value) => new Date(value).toLocaleDateString() },
- *     { key: 'attributes', label: 'Custom Attributes' }
- *   ]}
- * />
- * ```
- */
-const BaseOrganizationProfile: FC<BaseOrganizationProfileProps> = ({
-  fallback = null,
-  className = '',
-  cardLayout = true,
-  organization,
-  title = 'Organization Profile',
-  mode = 'inline',
-  editable = true,
-  onOpenChange,
-  onUpdate,
-  open = false,
-  saveButtonText = 'Save Changes',
-  cancelButtonText = 'Cancel',
-  fields = [
-    {
-      editable: false,
-      key: 'id',
-      label: 'Organization ID',
-    },
-    {
-      editable: true,
-      key: 'name',
-      label: 'Organization Name',
-    },
-    {
-      editable: true,
-      key: 'description',
-      label: 'Organization Description',
-      render: (value: any): any => value || '-',
-    },
-    {
-      editable: false,
-      key: 'created',
-      label: 'Created Date',
-      render: (value: any): any => formatDate(value),
-    },
-    {
-      editable: false,
-      key: 'lastModified',
-      label: 'Last Modified Date',
-      render: (value: any): any => formatDate(value),
-    },
-  ],
-}: BaseOrganizationProfileProps): ReactElement | null => {
-  const {theme, colorScheme} = useTheme();
-  const styles: Record<string, string> = useStyles(theme, colorScheme);
-  const [editedOrganization, setEditedOrganization] = useState(organization);
-  const [editingFields, setEditingFields] = useState<Record<string, boolean>>({});
-
-  const PencilIcon = (): ReactElement => (
-    <svg
-      width="16"
-      height="16"
-      viewBox="0 0 24 24"
-      fill="none"
-      stroke="currentColor"
-      strokeWidth="2"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    >
-      <path d="M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z" />
-    </svg>
-  );
-
-  const toggleFieldEdit: (fieldName: string) => void = useCallback((fieldName: string) => {
-    setEditingFields((prev: Record<string, boolean>) => ({
-      ...prev,
-      [fieldName]: !prev[fieldName],
-    }));
-  }, []);
-
-  const getFieldPlaceholder: (fieldKey: string) => string = useCallback((fieldKey: string): string => {
-    const fieldLabels: Record<string, string> = {
-      description: 'organization description',
-      name: 'organization name',
-      orgHandle: 'organization handle',
-      status: 'organization status',
-      type: 'organization type',
-    };
-
-    const fieldLabel: string = fieldLabels[fieldKey] || fieldKey.toLowerCase();
-    return `Enter ${fieldLabel}`;
-  }, []);
-
-  const handleFieldSave: (fieldKey: string) => void = useCallback(
-    (fieldKey: string): void => {
-      if (!onUpdate || !fieldKey) return;
-
-      let fieldValue: any;
-      if (editedOrganization && fieldKey && editedOrganization[fieldKey as keyof OrganizationDetails] !== undefined) {
-        fieldValue = editedOrganization[fieldKey as keyof OrganizationDetails];
-      } else if (organization?.[fieldKey as keyof OrganizationDetails] !== undefined) {
-        fieldValue = organization[fieldKey as keyof OrganizationDetails];
-      } else {
-        fieldValue = '';
-      }
-
-      const payload: Record<string, any> = {
-        [fieldKey]: fieldValue,
-      };
-
-      onUpdate(payload);
-      toggleFieldEdit(fieldKey);
-    },
-    [editedOrganization, organization, onUpdate, toggleFieldEdit],
-  );
-
-  const handleFieldCancel: (fieldKey: string) => void = useCallback(
-    (fieldKey: string) => {
-      setEditedOrganization((prev: any) => ({
-        ...prev,
-        [fieldKey]: organization?.[fieldKey as keyof OrganizationDetails],
-      }));
-      toggleFieldEdit(fieldKey);
-    },
-    [organization, toggleFieldEdit],
-  );
-
-  const getOrgInitials = (name?: string): string => {
-    if (!name) return 'ORG';
-    return name
-      .split(' ')
-      .map((word: string) => word.charAt(0))
-      .join('')
-      .toUpperCase()
-      .slice(0, 2);
-  };
-
-  const renderField = (
-    field: any,
-    isEditing: boolean,
-    onEditValue?: (value: any) => void,
-    onStartEdit?: () => void,
-  ): ReactElement | null => {
-    if (!field) return null;
-
-    const {key, label, editable: fieldEditable = true} = field;
-    const value: any =
-      key === 'attributes' ? organization?.attributes || {} : organization?.[key as keyof OrganizationDetails];
-
-    const renderedValue: any = field.render ? field.render(value, organization) : value;
-
-    if (isEditing && onEditValue && fieldEditable && editable) {
-      const fieldValue: any =
-        editedOrganization && key && editedOrganization[key as keyof OrganizationDetails] !== undefined
-          ? editedOrganization[key as keyof OrganizationDetails]
-          : value || '';
-
-      const commonProps: any = {
-        className: cx(styles['fieldInput']),
-        label: undefined,
-        onChange: (e: any): void => onEditValue(e.target ? e.target.value : e),
-        placeholder: getFieldPlaceholder(key),
-        value: typeof fieldValue === 'object' ? JSON.stringify(fieldValue) : String(fieldValue || ''),
-      };
-
-      let fieldInput: ReactElement;
-
-      if (key === 'attributes') {
-        const attributesValue: any = typeof fieldValue === 'object' && fieldValue !== null ? fieldValue : {};
-        fieldInput = (
-          <KeyValueInput
-            value={attributesValue}
-            onChange={(pairs: any): void => {
-              const attributesObject: Record<string, any> = pairs.reduce(
-                (acc: any, pair: any) => {
-                  acc[pair.key] = pair.value;
-                  return acc;
-                },
-                {} as Record<string, any>,
-              );
-              onEditValue(attributesObject);
-            }}
-            onAdd={(pair: any): void => {
-              if (onUpdate) {
-                const operation: any = {
-                  operation: 'ADD',
-                  path: `/attributes/${pair.key}`,
-                  value: pair.value,
-                };
-                onUpdate([operation]);
-              }
-            }}
-            onRemove={(pair: any): void => {
-              if (onUpdate) {
-                const operation: any = {
-                  operation: 'REMOVE',
-                  path: `/attributes/${pair.key}`,
-                  value: '',
-                };
-                onUpdate([operation]);
-              }
-            }}
-            label=""
-            keyPlaceholder="Attribute name"
-            valuePlaceholder="Attribute value"
-            helperText="Add custom attributes as key-value pairs"
-          />
-        );
-      } else {
-        fieldInput = <TextField {...commonProps} />;
-      }
-
-      return (
-        <>
-          <span className={cx(styles['label'])}>{label}</span>
-          <div className={cx(styles['value'])}>{fieldInput}</div>
-        </>
-      );
-    }
-
-    const hasValue: boolean = value !== undefined && value !== null && value !== '';
-    const isFieldEditable: boolean = editable && fieldEditable;
-
-    let displayValue: string | ReactElement;
-    if (hasValue) {
-      displayValue =
-        key === 'attributes' && typeof value === 'object' && value !== null ? (
-          <KeyValueInput value={value} readOnly={true} label="" />
-        ) : (
-          String(renderedValue)
-        );
-    } else if (isFieldEditable) {
-      displayValue = getFieldPlaceholder(key);
-    } else {
-      displayValue = '-';
-    }
-
-    return (
-      <>
-        <span className={cx(styles['label'])}>{label}</span>
-        <div className={cx(styles['value'], !hasValue && styles['valueEmpty'])}>
-          {!hasValue && isFieldEditable && onStartEdit ? (
-            <Button
-              onClick={onStartEdit}
-              variant="text"
-              color="secondary"
-              size="small"
-              title="Click to edit"
-              className={cx(styles['placeholderButton'])}
-            >
-              {displayValue}
-            </Button>
-          ) : (
-            displayValue
-          )}
-        </div>
-      </>
-    );
-  };
-
-  const renderOrganizationField = (field: any): ReactElement | null => {
-    if (!field?.key) return null;
-
-    const hasValue: boolean =
-      organization?.[field.key as keyof OrganizationDetails] !== undefined &&
-      organization?.[field.key as keyof OrganizationDetails] !== '' &&
-      organization?.[field.key as keyof OrganizationDetails] !== null;
-    const isFieldEditing: boolean = editingFields[field.key];
-    const isFieldEditable: boolean = editable && field.editable !== false;
-
-    const shouldShow: boolean = hasValue || isFieldEditing || isFieldEditable;
-
-    if (!shouldShow) {
-      return null;
-    }
-
-    return (
-      <div className={cx(styles['field'])} key={field.key}>
-        <div className={cx(styles['fieldContent'])}>
-          {renderField(
-            field,
-            isFieldEditing,
-            (value: any): void => {
-              const tempEditedOrganization: any = {...editedOrganization};
-              tempEditedOrganization[field.key as keyof OrganizationDetails] = value;
-              setEditedOrganization(tempEditedOrganization);
-            },
-            (): void => toggleFieldEdit(field.key),
-          )}
-        </div>
-        {isFieldEditable && (
-          <div className={cx(styles['fieldActions'])}>
-            {isFieldEditing ? (
-              <>
-                <Button
-                  onClick={(): void => handleFieldSave(field.key)}
-                  color="primary"
-                  variant="solid"
-                  size="small"
-                  title="Save changes"
-                >
-                  {saveButtonText}
-                </Button>
-                <Button
-                  onClick={(): void => handleFieldCancel(field.key)}
-                  color="secondary"
-                  variant="solid"
-                  size="small"
-                  title="Cancel editing"
-                >
-                  {cancelButtonText}
-                </Button>
-              </>
-            ) : (
-              hasValue && (
-                <Button
-                  onClick={(): void => toggleFieldEdit(field.key)}
-                  variant="text"
-                  color="secondary"
-                  size="small"
-                  title="Edit field"
-                  className={cx(styles['editButton'])}
-                >
-                  <PencilIcon />
-                </Button>
-              )
-            )}
-          </div>
-        )}
-      </div>
-    );
-  };
-
-  if (!organization) {
-    return fallback;
-  }
-
-  const profileContent: ReactElement = (
-    <CardPrimitive className={cx(styles['root'], cardLayout && styles['card'], className)}>
-      <div className={cx(styles['header'])}>
-        <Avatar name={getOrgInitials(organization.name)} size={80} alt={`${organization.name} logo`} />
-        <div className={cx(styles['orgInfo'])}>
-          <h2 className={cx(styles['name'])}>{organization.name}</h2>
-          {organization.orgHandle && <p className={cx(styles['handle'])}>@{organization.orgHandle}</p>}
-        </div>
-      </div>
-
-      <div className={cx(styles['infoContainer'])}>{fields.map((field: any) => renderOrganizationField(field))}</div>
-    </CardPrimitive>
-  );
-
-  if (mode === 'popup') {
-    return (
-      <DialogPrimitive open={open} onOpenChange={onOpenChange}>
-        <DialogPrimitive.Content>
-          <DialogPrimitive.Heading>{title}</DialogPrimitive.Heading>
-          <div className={cx(styles['popup'])}>{profileContent}</div>
-        </DialogPrimitive.Content>
-      </DialogPrimitive>
-    );
-  }
-
-  return profileContent;
-};
-
-export default BaseOrganizationProfile;
diff --git a/packages/react/src/components/presentation/OrganizationProfile/OrganizationProfile.tsx b/packages/react/src/components/presentation/OrganizationProfile/OrganizationProfile.tsx
deleted file mode 100644
index 4590d3f..0000000
--- a/packages/react/src/components/presentation/OrganizationProfile/OrganizationProfile.tsx
+++ /dev/null
@@ -1,216 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {OrganizationDetails, createPackageComponentLogger} from '@thunderid/browser';
-import {FC, ReactElement, useEffect, useState} from 'react';
-import BaseOrganizationProfile, {BaseOrganizationProfileProps} from './BaseOrganizationProfile';
-import getOrganization from '../../../api/getOrganization';
-import updateOrganization, {createPatchOperations} from '../../../api/updateOrganization';
-import useThunderID from '../../../contexts/ThunderID/useThunderID';
-import useTranslation from '../../../hooks/useTranslation';
-
-const logger: ReturnType<typeof createPackageComponentLogger> = createPackageComponentLogger(
-  '@thunderid/react',
-  'OrganizationProfile',
-);
-
-/**
- * Props for the OrganizationProfile component.
- * Extends BaseOrganizationProfileProps but makes the organization prop optional
- * since it will be fetched using the organizationId
- */
-export type OrganizationProfileProps = Omit<BaseOrganizationProfileProps, 'organization' | 'mode'> & {
-  /**
-   * Component to show when there's an error loading organization data.
-   */
-  errorFallback?: ReactElement;
-
-  /**
-   * Component to show while loading organization data.
-   */
-  loadingFallback?: ReactElement;
-
-  /**
-   * Display mode for the component.
-   */
-  mode?: 'default' | 'popup';
-
-  /**
-   * Callback fired when the popup should be closed (only used in popup mode).
-   */
-  onOpenChange?: (open: boolean) => void;
-
-  /**
-   * Callback fired when the organization should be updated.
-   */
-  onUpdate?: (payload: any) => Promise<void>;
-
-  /**
-   * Whether the popup is open (only used in popup mode).
-   */
-  open?: boolean;
-
-  /**
-   * The ID of the organization to fetch and display.
-   */
-  organizationId: string;
-
-  /**
-   * Custom title for the popup dialog (only used in popup mode).
-   */
-  popupTitle?: string;
-};
-
-/**
- * OrganizationProfile component displays organization information in a
- * structured and styled format. It automatically fetches organization details
- * using the provided organization ID and displays them using BaseOrganizationProfile.
- *
- * The component supports editing functionality, allowing users to modify organization
- * fields inline. Updates are automatically synced with the backend via the SCIM2 API.
- *
- * This component is the React-specific implementation that automatically
- * retrieves the organization data from ThunderID API.
- *
- * @example
- * ```tsx
- * // Basic usage with editing enabled (default)
- * <OrganizationProfile organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1" />
- *
- * // Read-only mode
- * <OrganizationProfile
- *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
- *   editable={false}
- * />
- *
- * // With card layout and custom fallbacks
- * <OrganizationProfile
- *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
- *   cardLayout={true}
- *   loadingFallback={<div>Loading organization...</div>}
- *   errorFallback={<div>Failed to load organization</div>}
- *   fallback={<div>No organization data available</div>}
- * />
- *
- * // With custom fields configuration and update callback
- * <OrganizationProfile
- *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
- *   fields={[
- *     { key: 'id', label: 'Organization ID', editable: false },
- *     { key: 'name', label: 'Organization Name', editable: true },
- *     { key: 'description', label: 'Description', editable: true, render: (value) => value || 'No description' },
- *     { key: 'created', label: 'Created Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },
- *     { key: 'lastModified', label: 'Last Modified Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },
- *     { key: 'attributes', label: 'Custom Attributes', editable: true }
- *   ]}
- *   onUpdate={async (payload) => {
- *     console.log('Organization updated:', payload);
- *     // payload contains the updated field values
- *     // The component automatically converts these to patch operations
- *   }}
- * />
- *
- * // In popup mode
- * <OrganizationProfile
- *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
- *   mode="popup"
- *   open={isOpen}
- *   onOpenChange={setIsOpen}
- *   popupTitle="Edit Organization Profile"
- * />
- * ```
- */
-const OrganizationProfile: FC<OrganizationProfileProps> = ({
-  organizationId,
-  mode = 'default',
-  open = false,
-  onOpenChange,
-  onUpdate,
-  popupTitle,
-  loadingFallback,
-  errorFallback,
-  preferences,
-  ...rest
-}: OrganizationProfileProps): ReactElement => {
-  const {baseUrl, instanceId} = useThunderID();
-  const {t} = useTranslation(preferences?.i18n);
-  const [organization, setOrganization] = useState<OrganizationDetails | null>(null);
-
-  const fetchOrganization = async (): Promise<void> => {
-    if (!baseUrl || !organizationId) {
-      return;
-    }
-
-    try {
-      const orgData: any = await getOrganization({
-        baseUrl,
-        instanceId,
-        organizationId,
-      });
-      setOrganization(orgData);
-    } catch (err) {
-      logger.error('Failed to fetch organization:');
-      setOrganization(null);
-    }
-  };
-
-  useEffect(() => {
-    fetchOrganization();
-  }, [baseUrl, organizationId]);
-
-  const handleOrganizationUpdate = async (payload: any): Promise<void> => {
-    if (!baseUrl || !organizationId) return;
-
-    try {
-      // Convert payload to patch operations format
-      const operations: any = createPatchOperations(payload);
-
-      await updateOrganization({
-        baseUrl,
-        instanceId,
-        operations,
-        organizationId,
-      });
-      // Refetch organization data after update
-      await fetchOrganization();
-
-      // Call the optional onUpdate callback
-      if (onUpdate) {
-        await onUpdate(payload);
-      }
-    } catch (err) {
-      logger.error('Failed to update organization:');
-      throw err;
-    }
-  };
-
-  return (
-    <BaseOrganizationProfile
-      organization={organization}
-      onUpdate={handleOrganizationUpdate}
-      mode={mode === 'popup' ? 'popup' : 'inline'}
-      open={open}
-      onOpenChange={onOpenChange}
-      title={popupTitle || t('organization.profile.heading')}
-      preferences={preferences}
-      {...rest}
-    />
-  );
-};
-
-export default OrganizationProfile;
diff --git a/packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.styles.ts b/packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.styles.ts
deleted file mode 100644
index e26e80c..0000000
--- a/packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.styles.ts
+++ /dev/null
@@ -1,275 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {css} from '@emotion/css';
-import {Theme} from '@thunderid/browser';
-import {useMemo} from 'react';
-
-/**
- * Creates styles for the BaseOrganizationSwitcher component using BEM methodology
- * @param theme - The theme object containing design tokens
- * @param colorScheme - The current color scheme (used for memoization)
- * @returns Object containing CSS class names for component styling
- */
-
-const useStyles = (theme: Theme, colorScheme: string): Record<string, string> =>
-  useMemo(() => {
-    const root: string = css`
-      display: inline-block;
-      position: relative;
-      font-family: ${theme.vars.typography.fontFamily};
-    `;
-
-    const trigger: string = css`
-      display: inline-flex;
-      align-items: center;
-      gap: ${theme.vars.spacing.unit};
-      padding: calc(${theme.vars.spacing.unit} * 0.75) ${theme.vars.spacing.unit};
-      border: 1px solid ${theme.vars.colors.border};
-      background: ${theme.vars.colors.background.surface};
-      cursor: pointer;
-      border-radius: ${theme.vars.borderRadius.medium};
-      min-width: 160px;
-
-      > span {
-        width: 100%;
-        gap: ${theme.vars.spacing.unit};
-      }
-
-      &:hover {
-        background-color: ${theme.vars.colors.background.surface};
-      }
-    `;
-
-    const triggerLabel: string = css`
-      color: ${theme.vars.colors.text.primary};
-      font-weight: 500;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      flex: 1;
-    `;
-
-    const content: string = css`
-      min-width: 280px;
-      max-width: 400px;
-      background-color: ${theme.vars.colors.background.surface};
-      border-radius: ${theme.vars.borderRadius.medium};
-      box-shadow: ${theme.vars.shadows.medium};
-      border: 1px solid ${theme.vars.colors.border};
-      outline: none;
-      z-index: 1000;
-    `;
-
-    const header: string = css`
-      display: flex;
-      align-items: center;
-      gap: ${theme.vars.spacing.unit};
-      padding: ${theme.vars.spacing.unit} calc(${theme.vars.spacing.unit} * 2);
-    `;
-
-    const headerInfo: string = css`
-      display: flex;
-      flex-direction: column;
-      gap: calc(${theme.vars.spacing.unit} / 4);
-      flex: 1;
-      min-width: 0;
-      overflow: hidden;
-    `;
-
-    const headerName: string = css`
-      color: ${theme.vars.colors.text.primary};
-      font-size: 0.875rem;
-      font-weight: 500;
-      margin: 0;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    `;
-
-    const headerMeta: string = css`
-      color: ${theme.vars.colors.text.secondary};
-      font-size: 0.75rem;
-      margin: 0;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    `;
-
-    const headerRole: string = css`
-      color: ${theme.vars.colors.text.secondary};
-      font-size: 0.75rem;
-      margin: 0;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      text-transform: capitalize;
-    `;
-
-    const manageButton: string = css`
-      min-width: auto;
-      margin-inline-start: auto;
-    `;
-
-    const menu: string = css`
-      display: flex;
-      flex-direction: column;
-      width: 100%;
-    `;
-
-    const menuItem: string = css`
-      display: flex;
-      align-items: center;
-      justify-content: flex-start;
-      gap: ${theme.vars.spacing.unit};
-      padding: calc(${theme.vars.spacing.unit} * 1.5) calc(${theme.vars.spacing.unit} * 2);
-      width: 100%;
-      color: ${theme.vars.colors.text.primary};
-      text-decoration: none;
-      border: none;
-      background-color: transparent;
-      cursor: pointer;
-      font-size: 0.875rem;
-      text-align: start;
-      border-radius: ${theme.vars.borderRadius.medium};
-      transition: background-color 0.15s ease-in-out;
-
-      > span {
-        gap: ${theme.vars.spacing.unit};
-      }
-
-      &:hover {
-        background-color: ${theme.vars.colors.action?.hover || 'rgba(0, 0, 0, 0.04)'};
-      }
-    `;
-
-    const menuDivider: string = css`
-      margin: calc(${theme.vars.spacing.unit} * 0.5) 0;
-      border-bottom: 1px solid ${theme.vars.colors.border};
-    `;
-
-    const organizationInfo: string = css`
-      display: flex;
-      flex-direction: column;
-      gap: calc(${theme.vars.spacing.unit} / 4);
-      flex: 1;
-      min-width: 0;
-      overflow: hidden;
-    `;
-
-    const organizationName: string = css`
-      color: ${theme.vars.colors.text.primary};
-      font-size: 0.875rem;
-      font-weight: 500;
-      margin: 0;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    `;
-
-    const organizationMeta: string = css`
-      color: ${theme.vars.colors.text.secondary};
-      font-size: 0.75rem;
-      margin: 0;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    `;
-
-    const loadingContainer: string = css`
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      min-height: 80px;
-      gap: ${theme.vars.spacing.unit};
-    `;
-
-    const loadingText: string = css`
-      color: ${theme.vars.colors.text.secondary};
-      font-size: 0.875rem;
-    `;
-
-    const errorContainer: string = css`
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      min-height: 80px;
-      padding: calc(${theme.vars.spacing.unit} * 2);
-    `;
-
-    const errorText: string = css`
-      color: ${theme.vars.colors.text.secondary};
-      font-size: 0.875rem;
-      text-align: center;
-    `;
-
-    const sectionHeader: string = css`
-      text-transform: uppercase;
-      letter-spacing: 0.05em;
-      color: ${theme.vars.colors.text.secondary};
-    `;
-
-    const sectionHeaderContainer: string = css`
-      border-top: none;
-      border-bottom: none;
-      padding-bottom: calc(${theme.vars.spacing.unit} / 2);
-    `;
-
-    const roleCapitalized: string = css`
-      text-transform: capitalize;
-    `;
-
-    return {
-      content,
-      errorContainer,
-      errorText,
-      header,
-      headerInfo,
-      headerMeta,
-      headerName,
-      headerRole,
-      loadingContainer,
-      loadingText,
-      manageButton,
-      menu,
-      menuDivider,
-      menuItem,
-      organizationInfo,
-      organizationMeta,
-      organizationName,
-      roleCapitalized,
-      root,
-      sectionHeader,
-      sectionHeaderContainer,
-      trigger,
-      triggerLabel,
-    };
-  }, [
-    theme.vars.colors.background.surface,
-    theme.vars.colors.text.primary,
-    theme.vars.colors.text.secondary,
-    theme.vars.colors.border,
-    theme.vars.borderRadius.medium,
-    theme.vars.shadows.medium,
-    theme.vars.spacing.unit,
-    theme.vars.colors.action?.hover,
-    theme.vars.typography.fontFamily,
-    colorScheme,
-  ]);
-
-export default useStyles;
diff --git a/packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.test.tsx b/packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.test.tsx
deleted file mode 100644
index 5c7907b..0000000
--- a/packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.test.tsx
+++ /dev/null
@@ -1,279 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/* eslint-disable testing-library/no-container, testing-library/no-node-access */
-
-import {cleanup, render, screen, waitFor} from '@testing-library/react';
-import {describe, it, expect, vi, beforeEach, afterEach} from 'vitest';
-import {BaseOrganizationSwitcher, Organization} from './BaseOrganizationSwitcher';
-
-// Mock theme data
-const mockColors = {
-  text: {primary: '#000', secondary: '#666'},
-  background: {surface: '#fff', disabled: '#eee', body: {main: '#fff'}},
-  border: '#ccc',
-  action: {
-    hover: '#f0f0f0',
-    active: '#e0e0e0',
-    selected: '#d0d0d0',
-    disabled: '#bbb',
-    disabledBackground: '#f5f5f5',
-    focus: '#0066cc',
-    hoverOpacity: 0.08,
-    selectedOpacity: 0.12,
-    disabledOpacity: 0.38,
-    focusOpacity: 0.12,
-    activatedOpacity: 0.12,
-  },
-  primary: {main: '#0066cc', contrastText: '#fff'},
-  secondary: {main: '#666', contrastText: '#fff'},
-  error: {main: '#d32f2f', contrastText: '#fff'},
-  success: {main: '#2e7d32', contrastText: '#fff'},
-  warning: {main: '#ed6c02', contrastText: '#fff'},
-  info: {main: '#0288d1', contrastText: '#fff'},
-};
-
-const mockTypography = {
-  fontFamily: 'Arial, sans-serif',
-  fontSizes: {
-    xs: '0.75rem',
-    sm: '0.875rem',
-    md: '1rem',
-    lg: '1.125rem',
-    xl: '1.25rem',
-    '2xl': '1.5rem',
-    '3xl': '1.875rem',
-  },
-  fontWeights: {normal: 400, medium: 500, semibold: 600, bold: 700},
-  lineHeights: {tight: 1.25, normal: 1.5, relaxed: 1.75},
-};
-
-const mockTypographyVars = {
-  fontFamily: 'Arial, sans-serif',
-  fontSizes: {
-    xs: '0.75rem',
-    sm: '0.875rem',
-    md: '1rem',
-    lg: '1.125rem',
-    xl: '1.25rem',
-    '2xl': '1.5rem',
-    '3xl': '1.875rem',
-  },
-  fontWeights: {normal: '400', medium: '500', semibold: '600', bold: '700'},
-  lineHeights: {tight: '1.25', normal: '1.5', relaxed: '1.75'},
-};
-
-const mockColorsVars = {
-  ...mockColors,
-  action: {
-    hover: '#f0f0f0',
-    active: '#e0e0e0',
-    selected: '#d0d0d0',
-    disabled: '#bbb',
-    disabledBackground: '#f5f5f5',
-    focus: '#0066cc',
-    hoverOpacity: '0.08',
-    selectedOpacity: '0.12',
-    disabledOpacity: '0.38',
-    focusOpacity: '0.12',
-    activatedOpacity: '0.12',
-  },
-};
-
-// Mock the dependencies
-vi.mock('../../../contexts/Theme/useTheme', () => ({
-  default: () => ({
-    theme: {
-      // ThemeConfig properties (direct access)
-      colors: mockColors,
-      typography: mockTypography,
-      spacing: {unit: 8},
-      borderRadius: {small: '2px', medium: '4px', large: '8px'},
-      shadows: {
-        small: '0 1px 2px rgba(0,0,0,0.1)',
-        medium: '0 2px 4px rgba(0,0,0,0.1)',
-        large: '0 4px 8px rgba(0,0,0,0.1)',
-      },
-      cssVariables: {},
-      // ThemeVars (CSS variable references)
-      vars: {
-        colors: mockColorsVars,
-        spacing: {unit: '8px'},
-        borderRadius: {small: '2px', medium: '4px', large: '8px'},
-        shadows: {
-          small: '0 1px 2px rgba(0,0,0,0.1)',
-          medium: '0 2px 4px rgba(0,0,0,0.1)',
-          large: '0 4px 8px rgba(0,0,0,0.1)',
-        },
-        typography: mockTypographyVars,
-      },
-    },
-    colorScheme: 'light',
-    direction: (document.documentElement.getAttribute('dir') as 'ltr' | 'rtl') || 'ltr',
-  }),
-}));
-
-vi.mock('../../../hooks/useTranslation', () => ({
-  default: () => ({
-    t: (key: string) => key,
-    currentLanguage: 'en',
-    setLanguage: vi.fn(),
-    availableLanguages: ['en'],
-  }),
-}));
-
-const mockOrganizations: Organization[] = [
-  {
-    id: '1',
-    name: 'Organization 1',
-    avatar: 'https://example.com/avatar1.jpg',
-    memberCount: 10,
-    role: 'admin',
-  },
-  {
-    id: '2',
-    name: 'Organization 2',
-    avatar: 'https://example.com/avatar2.jpg',
-    memberCount: 5,
-    role: 'member',
-  },
-];
-
-describe('BaseOrganizationSwitcher RTL Support', () => {
-  beforeEach(() => {
-    document.documentElement.removeAttribute('dir');
-  });
-
-  afterEach(() => {
-    cleanup();
-    document.documentElement.removeAttribute('dir');
-  });
-
-  it('should render correctly in LTR mode', () => {
-    document.documentElement.setAttribute('dir', 'ltr');
-    const handleSwitch = vi.fn();
-
-    render(
-      <BaseOrganizationSwitcher
-        organizations={mockOrganizations}
-        currentOrganization={mockOrganizations[0]}
-        onOrganizationSwitch={handleSwitch}
-      />,
-    );
-
-    expect(screen.getByText('Organization 1')).toBeDefined();
-  });
-
-  it('should render correctly in RTL mode', () => {
-    document.documentElement.setAttribute('dir', 'rtl');
-    const handleSwitch = vi.fn();
-
-    render(
-      <BaseOrganizationSwitcher
-        organizations={mockOrganizations}
-        currentOrganization={mockOrganizations[0]}
-        onOrganizationSwitch={handleSwitch}
-      />,
-    );
-
-    expect(screen.getByText('Organization 1')).toBeDefined();
-  });
-
-  it('should flip chevron icon in RTL mode', async () => {
-    document.documentElement.setAttribute('dir', 'rtl');
-    const handleSwitch = vi.fn();
-
-    const {container} = render(
-      <BaseOrganizationSwitcher
-        organizations={mockOrganizations}
-        currentOrganization={mockOrganizations[0]}
-        onOrganizationSwitch={handleSwitch}
-      />,
-    );
-
-    await waitFor(() => {
-      const chevronIcon = container.querySelector('svg');
-      expect(chevronIcon).toBeTruthy();
-      if (chevronIcon) {
-        // The transform is on the parent span, not the SVG itself
-        const parentSpan = chevronIcon.parentElement;
-        expect(parentSpan?.style.transform).toContain('scaleX(-1)');
-      }
-    });
-  });
-
-  it('should not flip chevron icon in LTR mode', async () => {
-    document.documentElement.setAttribute('dir', 'ltr');
-    const handleSwitch = vi.fn();
-
-    const {container} = render(
-      <BaseOrganizationSwitcher
-        organizations={mockOrganizations}
-        currentOrganization={mockOrganizations[0]}
-        onOrganizationSwitch={handleSwitch}
-      />,
-    );
-
-    await waitFor(() => {
-      const chevronIcon = container.querySelector('svg');
-      expect(chevronIcon).toBeTruthy();
-      if (chevronIcon) {
-        // The transform is on the parent span, not the SVG itself
-        // In LTR mode, the transform should be 'none'
-        const parentSpan = chevronIcon.parentElement;
-        expect(parentSpan?.style.transform).toBe('none');
-      }
-    });
-  });
-
-  it('should update icon flip when direction changes', async () => {
-    document.documentElement.setAttribute('dir', 'ltr');
-    const handleSwitch = vi.fn();
-
-    const {container, rerender} = render(
-      <BaseOrganizationSwitcher
-        organizations={mockOrganizations}
-        currentOrganization={mockOrganizations[0]}
-        onOrganizationSwitch={handleSwitch}
-      />,
-    );
-
-    // Initially LTR - style.transform is 'none' on parent span
-    let chevronIcon = container.querySelector('svg');
-    let parentSpan = chevronIcon?.parentElement;
-    expect(parentSpan?.style.transform).toBe('none');
-
-    // Change to RTL
-    document.documentElement.setAttribute('dir', 'rtl');
-
-    // Force re-render
-    rerender(
-      <BaseOrganizationSwitcher
-        organizations={mockOrganizations}
-        currentOrganization={mockOrganizations[0]}
-        onOrganizationSwitch={handleSwitch}
-      />,
-    );
-
-    await waitFor(() => {
-      chevronIcon = container.querySelector('svg');
-      parentSpan = chevronIcon?.parentElement;
-      expect(parentSpan?.style.transform).toContain('scaleX(-1)');
-    });
-  });
-});
diff --git a/packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.tsx b/packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.tsx
deleted file mode 100644
index d70714e..0000000
--- a/packages/react/src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.tsx
+++ /dev/null
@@ -1,522 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-// Removed BEM and vendor prefix utilities
-import {cx} from '@emotion/css';
-import {
-  useFloating,
-  autoUpdate,
-  offset,
-  flip,
-  shift,
-  useClick,
-  useDismiss,
-  useRole,
-  useInteractions,
-  FloatingFocusManager,
-  FloatingPortal,
-} from '@floating-ui/react';
-import {Preferences} from '@thunderid/browser';
-import {CSSProperties, FC, ReactElement, ReactNode, useState} from 'react';
-import useStyles from './BaseOrganizationSwitcher.styles';
-import useTheme from '../../../contexts/Theme/useTheme';
-import useTranslation from '../../../hooks/useTranslation';
-import {Avatar} from '../../primitives/Avatar/Avatar';
-import Button from '../../primitives/Button/Button';
-import Building from '../../primitives/Icons/Building';
-import Check from '../../primitives/Icons/Check';
-import ChevronDown from '../../primitives/Icons/ChevronDown';
-import Typography from '../../primitives/Typography/Typography';
-
-interface MenuItem {
-  href?: string;
-  icon?: ReactNode;
-  label: ReactNode;
-  onClick?: () => void;
-}
-
-/**
- * Interface for organization data.
- */
-export interface Organization {
-  /**
-   * Avatar URL for the organization.
-   */
-  avatar?: string;
-  /**
-   * Unique identifier for the organization.
-   */
-  id: string;
-  /**
-   * Number of members in the organization.
-   */
-  memberCount?: number;
-  /**
-   * Additional metadata for the organization.
-   */
-  metadata?: Record<string, any>;
-  /**
-   * Display name of the organization.
-   */
-  name: string;
-  /**
-   * User's role in the organization.
-   */
-  role?: 'owner' | 'admin' | 'member';
-  /**
-   * URL slug for the organization.
-   */
-  slug?: string;
-}
-
-/**
- * Props interface for the BaseOrganizationSwitcher component.
- */
-export interface BaseOrganizationSwitcherProps {
-  /**
-   * Optional size for the avatar
-   */
-  avatarSize?: number;
-  /**
-   * Custom class name for styling.
-   */
-  className?: string;
-  /**
-   * Currently selected organization.
-   */
-  currentOrganization?: Organization;
-  /**
-   * Error message to display.
-   */
-  error?: string;
-  /**
-   * Optional element to render when no organization is selected.
-   */
-  fallback?: ReactElement | null;
-  /**
-   * Whether the component is in a loading state.
-   */
-  loading?: boolean;
-  /**
-   * Additional menu items to display at the bottom of the dropdown.
-   */
-  menuItems?: MenuItem[];
-  /**
-   * Handler for when the manage profile button is clicked.
-   */
-  onManageProfile?: () => void;
-  /**
-   * Handler for when an organization is selected.
-   */
-  onOrganizationSwitch: (organization: Organization) => void;
-  /**
-   * List of available organizations.
-   */
-  organizations: Organization[];
-  /**
-   * The HTML element ID where the portal should be mounted
-   */
-  portalId?: string;
-  /**
-   * Component-level preferences to override global i18n and theme settings.
-   * Preferences are deep-merged with global ones, with component preferences
-   * taking precedence. Affects this component and all its descendants.
-   */
-  preferences?: Preferences;
-  /**
-   * Custom render function for the error state.
-   */
-  renderError?: (error: string) => ReactElement;
-  /**
-   * Custom render function for the loading state.
-   */
-  renderLoading?: () => ReactElement;
-  /**
-   * Custom render function for the organization item.
-   */
-  renderOrganization?: (organization: Organization, isSelected: boolean) => ReactElement;
-  /**
-   * Whether to show the member count.
-   */
-  showMemberCount?: boolean;
-  /**
-   * Whether to show the role badge.
-   */
-  showRole?: boolean;
-  /**
-   * Show organization name next to avatar in the trigger button
-   */
-  showTriggerLabel?: boolean;
-
-  /**
-   * Custom styles for the component.
-   */
-  style?: CSSProperties;
-}
-
-/**
- * BaseOrganizationSwitcher component displays an organization selector with a dropdown menu.
- * When clicked, it shows a popover with available organizations to switch between.
- * This component serves as the base for framework-specific implementations.
- */
-export const BaseOrganizationSwitcher: FC<BaseOrganizationSwitcherProps> = ({
-  organizations,
-  currentOrganization,
-  loading = false,
-  error,
-  onOrganizationSwitch,
-  onManageProfile,
-  className = '',
-  style,
-  renderOrganization,
-  renderLoading,
-  renderError,
-  showRole = false,
-  showMemberCount = true,
-  menuItems = [],
-  portalId = 'thunderid-organization-switcher',
-  showTriggerLabel = true,
-  avatarSize = 24,
-  fallback = null,
-  preferences,
-}: BaseOrganizationSwitcherProps): ReactElement | null => {
-  const {theme, colorScheme, direction} = useTheme();
-  const styles: Record<string, string> = useStyles(theme, colorScheme);
-  const [isOpen, setIsOpen] = useState(false);
-  const [hoveredItemIndex, setHoveredItemIndex] = useState<number | null>(null);
-  const {t} = useTranslation(preferences?.i18n);
-  const isRTL: boolean = direction === 'rtl';
-
-  const {refs, floatingStyles, context} = useFloating({
-    middleware: [offset(5), flip({fallbackAxisSideDirection: 'end'}), shift({padding: 5})],
-    onOpenChange: setIsOpen,
-    open: isOpen,
-    placement: 'bottom-end',
-    whileElementsMounted: autoUpdate,
-  });
-
-  const click: any = useClick(context);
-  const dismiss: any = useDismiss(context);
-  const role: any = useRole(context);
-
-  const {getReferenceProps, getFloatingProps} = useInteractions([click, dismiss, role]);
-
-  if (fallback && !currentOrganization && !loading && organizations.length === 0) {
-    return fallback;
-  }
-
-  const handleOrganizationSwitch = (organization: Organization): void => {
-    onOrganizationSwitch(organization);
-    setIsOpen(false);
-  };
-
-  const handleMenuItemClick = (item: MenuItem): void => {
-    if (item.onClick) {
-      item.onClick();
-    }
-    setIsOpen(false);
-  };
-
-  // Filter out current organization from switchable list
-  const switchableOrganizations: Organization[] = organizations.filter(
-    (org: Organization): boolean => org.id !== currentOrganization?.id,
-  );
-
-  const defaultRenderOrganization = (organization: Organization, isSelected: boolean): ReactElement => (
-    <>
-      <Avatar
-        variant="square"
-        imageUrl={organization.avatar}
-        name={organization.name}
-        size={avatarSize * 1.25}
-        alt={`${organization.name} avatar`}
-      />
-      <div className={cx(styles['organizationInfo'])}>
-        <Typography variant="body2" fontWeight="medium" className={cx(styles['organizationName'])}>
-          {organization.name}
-        </Typography>
-        <div className={cx(styles['organizationMeta'])}>
-          {showMemberCount && organization.memberCount !== undefined && (
-            <span>
-              {organization.memberCount}{' '}
-              {organization.memberCount === 1 ? t('organization.switcher.member') : t('organization.switcher.members')}
-            </span>
-          )}
-          {showRole && organization.role && showMemberCount && organization.memberCount !== undefined && (
-            <span> • </span>
-          )}
-          {showRole && organization.role && <span className={cx(styles['roleCapitalized'])}>{organization.role}</span>}
-        </div>
-      </div>
-      {isSelected && <Check width="16" height="16" color={theme.vars.colors.text.primary} />}
-    </>
-  );
-
-  const defaultRenderLoading = (): ReactElement => (
-    <div className={cx(styles['loadingContainer'])}>
-      <Typography variant="caption" className={cx(styles['loadingText'])}>
-        {t('organization.switcher.loading.placeholder.organizations')}
-      </Typography>
-    </div>
-  );
-
-  const defaultRenderError = (errorMessage: string): ReactElement => (
-    <div className={cx(styles['errorContainer'])}>
-      <Typography variant="caption" className={cx(styles['errorText'])}>
-        {errorMessage}
-      </Typography>
-    </div>
-  );
-
-  return (
-    <div className={cx(styles['root'], className)} style={style}>
-      <Button
-        ref={refs.setReference}
-        className={cx(styles['trigger'])}
-        color="tertiary"
-        variant="outline"
-        size="medium"
-        {...getReferenceProps()}
-      >
-        {currentOrganization ? (
-          <>
-            <Avatar
-              variant="square"
-              imageUrl={currentOrganization.avatar}
-              name={currentOrganization.name}
-              size={avatarSize}
-              alt={`${currentOrganization.name} avatar`}
-            />
-            {showTriggerLabel && (
-              <Typography variant="body2" className={cx(styles['triggerLabel'])}>
-                {currentOrganization.name}
-              </Typography>
-            )}
-          </>
-        ) : (
-          <>
-            <Building width={avatarSize} height={avatarSize} />
-            {showTriggerLabel && (
-              <Typography variant="body2" className={cx(styles['triggerLabel'])}>
-                {t('elements.fields.organization.select.label')}
-              </Typography>
-            )}
-          </>
-        )}
-        <span style={{display: 'inline-flex', transform: isRTL ? 'scaleX(-1)' : 'none'}}>
-          <ChevronDown width="16" height="16" />
-        </span>
-      </Button>
-
-      {isOpen && (
-        <FloatingPortal id={portalId}>
-          <FloatingFocusManager context={context} modal={false} initialFocus={-1}>
-            <div
-              ref={refs.setFloating}
-              className={cx(styles['content'])}
-              style={floatingStyles}
-              {...getFloatingProps()}
-            >
-              {/* Header - Current Organization */}
-              {currentOrganization && (
-                <div className={cx(styles['header'])}>
-                  <Avatar
-                    variant="square"
-                    imageUrl={currentOrganization.avatar}
-                    name={currentOrganization.name}
-                    size={avatarSize * 1.5}
-                    alt={`${currentOrganization.name} avatar`}
-                  />
-                  <div className={cx(styles['headerInfo'])}>
-                    <Typography noWrap className={cx(styles['headerName'])} variant="body1" fontWeight="medium">
-                      {currentOrganization.name}
-                    </Typography>
-                    <div className={cx(styles['headerMeta'])}>
-                      {showMemberCount && currentOrganization.memberCount !== undefined && (
-                        <Typography
-                          noWrap
-                          // ...existing code...
-                          variant="caption"
-                          color="secondary"
-                        >
-                          {currentOrganization.memberCount}{' '}
-                          {currentOrganization.memberCount === 1
-                            ? t('organization.switcher.member')
-                            : t('organization.switcher.members')}
-                          {showRole && currentOrganization.role && <span> • {currentOrganization.role}</span>}
-                        </Typography>
-                      )}
-                      {showRole &&
-                        currentOrganization.role &&
-                        (!showMemberCount || currentOrganization.memberCount === undefined) && (
-                          <Typography noWrap className={cx(styles['headerRole'])} variant="caption" color="secondary">
-                            {currentOrganization.role}
-                          </Typography>
-                        )}
-                    </div>
-                  </div>
-                  {onManageProfile && (
-                    <Button
-                      onClick={onManageProfile}
-                      color="tertiary"
-                      variant="outline"
-                      size="small"
-                      aria-label="Manage Organization Profile"
-                      className={cx(styles['manageButton'])}
-                      endIcon={
-                        <svg
-                          width="16"
-                          height="16"
-                          viewBox="0 0 24 24"
-                          fill="none"
-                          stroke="currentColor"
-                          strokeWidth="2"
-                          strokeLinecap="round"
-                          strokeLinejoin="round"
-                        >
-                          <circle cx="12" cy="12" r="3" />
-                          <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1 1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" />
-                        </svg>
-                      }
-                    >
-                      {t('organization.switcher.buttons.manage.text')}
-                    </Button>
-                  )}
-                </div>
-              )}
-
-              {/* Section Header for Other Organizations */}
-              {organizations.length > 1 && (
-                <div
-                  className={cx(styles['header'], styles['sectionHeaderContainer'])}
-                  style={{
-                    borderTop: currentOrganization ? `1px solid ${theme.vars.colors.border}` : 'none',
-                  }}
-                >
-                  <Typography variant="caption" fontWeight={600} className={cx(styles['sectionHeader'])}>
-                    {t('organization.switcher.switch.organization')}
-                  </Typography>
-                </div>
-              )}
-
-              {/* Content */}
-              <div className={cx(styles['menu'])}>
-                {((): ReactElement => {
-                  if (loading) {
-                    return renderLoading ? renderLoading() : defaultRenderLoading();
-                  }
-                  if (error) {
-                    return renderError ? renderError(error) : defaultRenderError(error);
-                  }
-                  return (
-                    <>
-                      {switchableOrganizations.map((organization: Organization): ReactElement => {
-                        const isSelected = false; // Never selected since we exclude current org
-                        return (
-                          <Button
-                            key={organization.id}
-                            onClick={(): void => handleOrganizationSwitch(organization)}
-                            className={cx(styles['menuItem'])}
-                            color="tertiary"
-                            variant="text"
-                            size="small"
-                            style={{
-                              backgroundColor:
-                                hoveredItemIndex === switchableOrganizations.indexOf(organization)
-                                  ? theme.vars.colors.action?.hover
-                                  : 'transparent',
-                            }}
-                            onMouseEnter={(): void =>
-                              setHoveredItemIndex(switchableOrganizations.indexOf(organization))
-                            }
-                            onMouseLeave={(): void => setHoveredItemIndex(null)}
-                          >
-                            {renderOrganization
-                              ? renderOrganization(organization, isSelected)
-                              : defaultRenderOrganization(organization, isSelected)}
-                          </Button>
-                        );
-                      })}
-
-                      {/* Menu Items */}
-                      {menuItems.length > 0 && (
-                        <>
-                          <div className={cx(styles['menuDivider'])} />
-                          {menuItems.map(
-                            (item: any, index: number): ReactElement => (
-                              <div key={index}>
-                                {item.href ? (
-                                  <a
-                                    href={item.href}
-                                    style={{
-                                      backgroundColor:
-                                        hoveredItemIndex === switchableOrganizations.length + index
-                                          ? theme.vars.colors.action?.hover
-                                          : 'transparent',
-                                    }}
-                                    className={cx(styles['menuItem'])}
-                                    onMouseEnter={(): void =>
-                                      setHoveredItemIndex(switchableOrganizations.length + index)
-                                    }
-                                    onMouseLeave={(): void => setHoveredItemIndex(null)}
-                                    onFocus={(): void => setHoveredItemIndex(switchableOrganizations.length + index)}
-                                    onBlur={(): void => setHoveredItemIndex(null)}
-                                  >
-                                    {item.icon}
-                                    <span>{item.label}</span>
-                                  </a>
-                                ) : (
-                                  <Button
-                                    onClick={(): void => handleMenuItemClick(item)}
-                                    style={{
-                                      backgroundColor:
-                                        hoveredItemIndex === switchableOrganizations.length + index
-                                          ? theme.vars.colors.action?.hover
-                                          : 'transparent',
-                                    }}
-                                    className={cx(styles['menuItem'])}
-                                    color="tertiary"
-                                    variant="text"
-                                    size="small"
-                                    startIcon={item.icon}
-                                    onMouseEnter={(): void =>
-                                      setHoveredItemIndex(switchableOrganizations.length + index)
-                                    }
-                                    onMouseLeave={(): void => setHoveredItemIndex(null)}
-                                  >
-                                    {item.label}
-                                  </Button>
-                                )}
-                              </div>
-                            ),
-                          )}
-                        </>
-                      )}
-                    </>
-                  );
-                })()}
-              </div>
-            </div>
-          </FloatingFocusManager>
-        </FloatingPortal>
-      )}
-    </div>
-  );
-};
-
-export default BaseOrganizationSwitcher;
diff --git a/packages/react/src/components/presentation/OrganizationSwitcher/OrganizationSwitcher.tsx b/packages/react/src/components/presentation/OrganizationSwitcher/OrganizationSwitcher.tsx
deleted file mode 100644
index fedd940..0000000
--- a/packages/react/src/components/presentation/OrganizationSwitcher/OrganizationSwitcher.tsx
+++ /dev/null
@@ -1,201 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {FC, ReactElement, useState} from 'react';
-
-import {
-  BaseOrganizationSwitcher as BaseOrganizationSwitcherComponent,
-  BaseOrganizationSwitcherProps,
-  Organization,
-} from './BaseOrganizationSwitcher';
-import useOrganization from '../../../contexts/Organization/useOrganization';
-import useThunderID from '../../../contexts/ThunderID/useThunderID';
-import useTranslation from '../../../hooks/useTranslation';
-import BuildingAlt from '../../primitives/Icons/BuildingAlt';
-import {CreateOrganization} from '../CreateOrganization/CreateOrganization';
-import OrganizationListComponent from '../OrganizationList/OrganizationList';
-import OrganizationProfile from '../OrganizationProfile/OrganizationProfile';
-
-/**
- * Props interface for the OrganizationSwitcher component.
- * Makes organizations optional since they'll be retrieved from OrganizationContext.
- */
-export interface OrganizationSwitcherProps
-  extends Omit<BaseOrganizationSwitcherProps, 'organizations' | 'currentOrganization' | 'onOrganizationSwitch'> {
-  /**
-   * Optional override for current organization (will use context if not provided)
-   */
-  currentOrganization?: Organization;
-  /**
-   * Fallback element to render when the user is not signed in.
-   */
-  fallback?: ReactElement | null;
-  /**
-   * Optional callback for organization switch (will use context if not provided)
-   */
-  onOrganizationSwitch?: (organization: Organization) => Promise<void> | void;
-  /**
-   * Optional override for organizations list (will use context if not provided)
-   */
-  organizations?: Organization[];
-}
-
-/**
- * OrganizationSwitcher component that provides organization switching functionality.
- * This component automatically retrieves organizations from the OrganizationContext.
- * You can also override the organizations, currentOrganization, and onOrganizationSwitch
- * by passing them as props.
- *
- * @example
- * ```tsx
- * import { OrganizationSwitcher } from '@thunderid/react';
- *
- * // Basic usage - uses OrganizationContext
- * <OrganizationSwitcher />
- *
- * // With custom organization switch handler
- * <OrganizationSwitcher
- *   onOrganizationSwitch={(org) => {
- *     console.log('Switching to:', org.name);
- *     // Custom logic here
- *   }}
- * />
- *
- * // With fallback for unauthenticated users
- * <OrganizationSwitcher
- *   fallback={<div>Please sign in to view organizations</div>}
- * />
- * ```
- */
-export const OrganizationSwitcher: FC<OrganizationSwitcherProps> = ({
-  currentOrganization: propCurrentOrganization,
-  fallback = null,
-  onOrganizationSwitch: propOnOrganizationSwitch,
-  organizations: propOrganizations,
-  preferences,
-  ...props
-}: OrganizationSwitcherProps): ReactElement | null => {
-  const {isSignedIn} = useThunderID();
-  const {
-    currentOrganization: contextCurrentOrganization,
-    myOrganizations: contextOrganizations,
-    switchOrganization,
-    isLoading,
-    error,
-  } = useOrganization();
-  const [isCreateOrgOpen, setIsCreateOrgOpen] = useState(false);
-  const [isProfileOpen, setIsProfileOpen] = useState(false);
-  const [isOrganizationListOpen, setIsOrganizationListOpen] = useState(false);
-  const {t} = useTranslation(preferences?.i18n);
-
-  if (!isSignedIn && fallback) {
-    return fallback;
-  }
-
-  if (!isSignedIn) {
-    return <></>;
-  }
-
-  const organizations: Organization[] = propOrganizations || contextOrganizations || [];
-  const currentOrganization: Organization | undefined =
-    propCurrentOrganization || contextCurrentOrganization || undefined;
-  const onOrganizationSwitch: (organization: Organization) => Promise<void> | void =
-    propOnOrganizationSwitch || switchOrganization;
-
-  const handleManageOrganizations = (): void => {
-    setIsOrganizationListOpen(true);
-  };
-
-  const handleManageOrganization = (): void => {
-    setIsProfileOpen(true);
-  };
-
-  const defaultMenuItems: {icon?: ReactElement; label: string; onClick: () => void}[] = [];
-
-  if (currentOrganization) {
-    defaultMenuItems.push({
-      icon: <BuildingAlt />,
-      label: t('organization.switcher.manage.organizations'),
-      onClick: handleManageOrganizations,
-    });
-  }
-
-  defaultMenuItems.push({
-    icon: (
-      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
-        <path d="M12 5v14m-7-7h14" />
-      </svg>
-    ),
-    label: t('organization.switcher.create.organization'),
-    onClick: (): void => setIsCreateOrgOpen(true),
-  });
-
-  const menuItems: any[] = props.menuItems ? [...defaultMenuItems, ...props.menuItems] : defaultMenuItems;
-
-  return (
-    <>
-      <BaseOrganizationSwitcherComponent
-        organizations={organizations}
-        currentOrganization={currentOrganization}
-        onOrganizationSwitch={onOrganizationSwitch}
-        loading={isLoading}
-        error={error ?? undefined}
-        menuItems={menuItems}
-        onManageProfile={handleManageOrganization}
-        preferences={preferences}
-        {...props}
-      />
-      <CreateOrganization
-        mode="popup"
-        open={isCreateOrgOpen}
-        onOpenChange={setIsCreateOrgOpen}
-        onSuccess={(org: Organization): void => {
-          if (org && onOrganizationSwitch) {
-            onOrganizationSwitch(org);
-          }
-          setIsCreateOrgOpen(false);
-        }}
-      />
-      {currentOrganization && (
-        <OrganizationProfile
-          organizationId={currentOrganization.id}
-          mode="popup"
-          open={isProfileOpen}
-          onOpenChange={setIsProfileOpen}
-          cardLayout={true}
-          loadingFallback={<div>{t('organization.profile.loading')}</div>}
-          errorFallback={<div>{t('organization.profile.error')}</div>}
-        />
-      )}
-      <OrganizationListComponent
-        mode="popup"
-        open={isOrganizationListOpen}
-        onOpenChange={setIsOrganizationListOpen}
-        title={t('organization.switcher.manage.organizations')}
-        onOrganizationSelect={(organization: Organization): void => {
-          if (onOrganizationSwitch) {
-            onOrganizationSwitch(organization);
-          }
-          setIsOrganizationListOpen(false);
-        }}
-      />
-    </>
-  );
-};
-
-export default OrganizationSwitcher;
diff --git a/packages/react/src/components/presentation/UserAvatar/BaseUserAvatar.tsx b/packages/react/src/components/presentation/UserAvatar/BaseUserAvatar.tsx
new file mode 100644
index 0000000..f90faba
--- /dev/null
+++ b/packages/react/src/components/presentation/UserAvatar/BaseUserAvatar.tsx
@@ -0,0 +1,90 @@
+/**
+ * Copyright (c) 2025-2026, WSO2 LLC. (https://www.wso2.com).
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import {User} from '@thunderid/browser';
+import {FC, JSX} from 'react';
+import {Avatar} from '../../primitives/Avatar/Avatar';
+
+export interface BaseUserAvatarProps {
+  /**
+   * Optional CSS class name for the avatar container.
+   */
+  className?: string;
+  /**
+   * Size of the avatar in pixels.
+   * @default 40
+   */
+  size?: number;
+  /**
+   * The user object. When provided, the avatar derives the image URL and
+   * initials from the user's profile fields automatically.
+   */
+  user: User | null;
+}
+
+/**
+ * Resolves the profile picture URL from common user claim fields.
+ */
+const resolvePicture = (user: User): string | undefined => {
+  for (const key of ['picture', 'profileUrl', 'profile', 'URL', 'avatarUrl', 'avatar']) {
+    const val: unknown = user[key];
+    if (typeof val === 'string' && val) return val;
+  }
+  return undefined;
+};
+
+/**
+ * Resolves a display name suitable for generating avatar initials.
+ */
+const resolveName = (user: User): string | undefined => {
+  const given: string = user['givenName'] || user['given_name'] || '';
+  const family: string = user['familyName'] || user['family_name'] || '';
+  if (given && family) return `${given} ${family}`;
+
+  return (
+    user['displayName'] ||
+    user['name'] ||
+    given ||
+    user['username'] ||
+    user['email'] ||
+    undefined
+  );
+};
+
+/**
+ * Base `UserAvatar` component. Renders an avatar derived from a user object
+ * without any context dependency — pass the `user` prop explicitly.
+ *
+ * For the context-aware version that reads the signed-in user automatically,
+ * use `UserAvatar`.
+ *
+ * @example
+ * ```tsx
+ * <BaseUserAvatar user={user} size={48} />
+ * ```
+ */
+const BaseUserAvatar: FC<BaseUserAvatarProps> = ({user, size = 40, className}: BaseUserAvatarProps): JSX.Element => {
+  const imageUrl: string | undefined = user ? resolvePicture(user) : undefined;
+  const name: string | undefined = user ? resolveName(user) : undefined;
+
+  return <Avatar imageUrl={imageUrl} name={name} size={size} className={className} />;
+};
+
+BaseUserAvatar.displayName = 'BaseUserAvatar';
+
+export default BaseUserAvatar;
diff --git a/packages/react/src/components/presentation/UserAvatar/UserAvatar.tsx b/packages/react/src/components/presentation/UserAvatar/UserAvatar.tsx
new file mode 100644
index 0000000..c708ab0
--- /dev/null
+++ b/packages/react/src/components/presentation/UserAvatar/UserAvatar.tsx
@@ -0,0 +1,55 @@
+/**
+ * Copyright (c) 2025-2026, WSO2 LLC. (https://www.wso2.com).
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import {User} from '@thunderid/browser';
+import {FC, JSX} from 'react';
+import useThunderID from '../../../contexts/ThunderID/useThunderID';
+import BaseUserAvatar, {BaseUserAvatarProps} from './BaseUserAvatar';
+
+export interface UserAvatarProps extends Omit<BaseUserAvatarProps, 'user'> {
+  /**
+   * Override the user to render. When omitted the signed-in user from
+   * ThunderID context is used automatically.
+   */
+  user?: User | null;
+}
+
+/**
+ * Context-aware avatar component. Renders an avatar for the currently
+ * signed-in user without requiring an explicit `user` prop.
+ *
+ * Derives the profile picture and initials from the user's token claims,
+ * with graceful fallback to generated initials when no image is available.
+ *
+ * @example
+ * ```tsx
+ * // Auto-reads from context
+ * <UserAvatar size={48} />
+ *
+ * // Override with a specific user
+ * <UserAvatar user={someUser} size={32} />
+ * ```
+ */
+const UserAvatar: FC<UserAvatarProps> = ({user: userProp, ...rest}: UserAvatarProps): JSX.Element => {
+  const {user} = useThunderID();
+  return <BaseUserAvatar user={userProp ?? user} {...rest} />;
+};
+
+UserAvatar.displayName = 'UserAvatar';
+
+export default UserAvatar;
diff --git a/packages/react/src/components/presentation/UserDropdown/BaseUserDropdown.tsx b/packages/react/src/components/presentation/UserDropdown/BaseUserDropdown.tsx
index 823c232..290fcbb 100644
--- a/packages/react/src/components/presentation/UserDropdown/BaseUserDropdown.tsx
+++ b/packages/react/src/components/presentation/UserDropdown/BaseUserDropdown.tsx
@@ -206,14 +206,16 @@ export const BaseUserDropdown: FC<BaseUserDropdownProps> = ({
         variant="text"
         size="medium"
         data-testid="thunderid-user-dropdown-trigger"
+        startIcon={
+          <Avatar
+            imageUrl={getMappedUserProfileValue('picture', mergedMappings, user)}
+            name={getDisplayName(mergedMappings, user)}
+            size={avatarSize}
+            alt={`${getDisplayName(mergedMappings, user)}'s avatar`}
+          />
+        }
         {...getReferenceProps()}
       >
-        <Avatar
-          imageUrl={getMappedUserProfileValue('picture', mergedMappings, user)}
-          name={getDisplayName(mergedMappings, user)}
-          size={avatarSize}
-          alt={`${getDisplayName(mergedMappings, user)}'s avatar`}
-        />
         {showTriggerLabel && (
           <Typography
             variant="body2"
diff --git a/packages/react/src/components/presentation/auth/AuthOptionFactory.tsx b/packages/react/src/components/presentation/auth/AuthOptionFactory.tsx
index cb6a8fa..c7b9c59 100644
--- a/packages/react/src/components/presentation/auth/AuthOptionFactory.tsx
+++ b/packages/react/src/components/presentation/auth/AuthOptionFactory.tsx
@@ -20,7 +20,6 @@ import {css} from '@emotion/css';
 import {
   FieldType,
   FlowMetadataResponse,
-  OrganizationUnitListResponse,
   EmbeddedFlowComponent,
   EmbeddedFlowComponentType,
   EmbeddedFlowTextVariant,
@@ -33,10 +32,10 @@ import {
   ConsentDecisions,
   ConsentPurposeDecision,
   ConsentAttributeElement,
+  OrganizationUnitListResponse,
 } from '@thunderid/browser';
 import DOMPurify from 'dompurify';
 import {cloneElement, CSSProperties, ReactElement} from 'react';
-import {OrganizationUnitPicker} from './OrganizationUnitPicker';
 import {
   ComponentRenderer,
   ComponentRenderContext,
@@ -199,12 +198,6 @@ const createAuthComponentFromFlow = (
     buttonClassName?: string;
     /** Current consent purpose being rendered. Set by CONSENT_PURPOSE block iteration. */
     currentConsentPurpose?: ConsentPurposeData;
-    /** Function to fetch child organization units. Used by OU_SELECT component type. */
-    fetchOrganizationUnitChildren?: (
-      parentId: string,
-      limit: number,
-      offset: number,
-    ) => Promise<OrganizationUnitListResponse>;
     inStack?: boolean;
     inputClassName?: string;
     /** Flag to determine if the step timeline has expired */
@@ -489,23 +482,8 @@ const createAuthComponentFromFlow = (
     }
 
     case EmbeddedFlowComponentType.OuSelect: {
-      const identifier: string = component.ref ?? component.id;
-      const rootOuId: string | undefined = options.additionalData?.['rootOuId'] as string | undefined;
-
-      if (!rootOuId || !options.fetchOrganizationUnitChildren) {
-        logger.warn('OU_SELECT requires additionalData.rootOuId and fetchOrganizationUnitChildren. Skipping render.');
-        return null;
-      }
-
-      return (
-        <OrganizationUnitPicker
-          key={key}
-          rootOuId={rootOuId}
-          selectedOuId={formValues[identifier] || null}
-          onSelect={(ouId: string) => onInputChange(identifier, ouId)}
-          fetchChildren={options.fetchOrganizationUnitChildren}
-        />
-      );
+      logger.warn('OU_SELECT component type is not supported. Skipping render.');
+      return null;
     }
 
     case EmbeddedFlowComponentType.Block: {
@@ -843,7 +821,7 @@ export const renderInviteUserComponents = (
     /** Additional data from the flow response */
     additionalData?: Record<string, any>;
     buttonClassName?: string;
-    /** Function to fetch child organization units. Used by OU_SELECT component type. */
+    /** Function to fetch child organization units for OU_SELECT components. */
     fetchOrganizationUnitChildren?: (
       parentId: string,
       limit: number,
diff --git a/packages/react/src/components/presentation/auth/OrganizationUnitPicker/OrganizationUnitPicker.styles.ts b/packages/react/src/components/presentation/auth/OrganizationUnitPicker/OrganizationUnitPicker.styles.ts
deleted file mode 100644
index cf11a30..0000000
--- a/packages/react/src/components/presentation/auth/OrganizationUnitPicker/OrganizationUnitPicker.styles.ts
+++ /dev/null
@@ -1,153 +0,0 @@
-/**
- * Copyright (c) 2026, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {css} from '@emotion/css';
-import {Theme} from '@thunderid/browser';
-import {useMemo} from 'react';
-
-const useStyles = (theme: Theme): Record<string, string> =>
-  useMemo(() => {
-    const container: string = css`
-      display: flex;
-      flex-direction: column;
-      width: 100%;
-      max-height: 320px;
-      overflow-y: auto;
-      border: 1px solid ${theme.vars.colors.border};
-      border-radius: ${theme.vars.borderRadius.medium};
-      font-family: ${theme.vars.typography.fontFamily};
-    `;
-
-    const node: string = css`
-      display: flex;
-      align-items: center;
-      padding: calc(${theme.vars.spacing.unit} * 1) calc(${theme.vars.spacing.unit} * 1.5);
-      cursor: pointer;
-      user-select: none;
-      transition: background-color 0.15s ease;
-
-      &:hover {
-        background-color: ${theme.vars.colors.action.hover};
-      }
-    `;
-
-    const nodeSelected: string = css`
-      background-color: ${theme.vars.colors.action.selected};
-
-      &:hover {
-        background-color: ${theme.vars.colors.action.selected};
-      }
-    `;
-
-    const toggleButton: string = css`
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      width: 20px;
-      height: 20px;
-      border: none;
-      background: none;
-      cursor: pointer;
-      padding: 0;
-      margin-right: calc(${theme.vars.spacing.unit} * 0.5);
-      color: ${theme.vars.colors.text.secondary};
-      font-size: 12px;
-      flex-shrink: 0;
-    `;
-
-    const togglePlaceholder: string = css`
-      width: 20px;
-      height: 20px;
-      margin-right: calc(${theme.vars.spacing.unit} * 0.5);
-      flex-shrink: 0;
-    `;
-
-    const nodeName: string = css`
-      font-size: 14px;
-      color: ${theme.vars.colors.text.primary};
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    `;
-
-    const loadMoreButton: string = css`
-      display: flex;
-      align-items: center;
-      padding: calc(${theme.vars.spacing.unit} * 0.75) calc(${theme.vars.spacing.unit} * 1.5);
-      border: none;
-      background: none;
-      cursor: pointer;
-      color: ${theme.vars.colors.primary.main};
-      font-size: 13px;
-      font-family: ${theme.vars.typography.fontFamily};
-
-      &:hover {
-        text-decoration: underline;
-      }
-    `;
-
-    const loadingPlaceholder: string = css`
-      display: flex;
-      align-items: center;
-      padding: calc(${theme.vars.spacing.unit} * 1) calc(${theme.vars.spacing.unit} * 1.5);
-      gap: calc(${theme.vars.spacing.unit} * 1);
-    `;
-
-    const skeleton: string = css`
-      height: 14px;
-      border-radius: ${theme.vars.borderRadius.small};
-      background-color: ${theme.vars.colors.background.disabled};
-      animation: pulse 1.5s ease-in-out infinite;
-
-      @keyframes pulse {
-        0%,
-        100% {
-          opacity: 1;
-        }
-        50% {
-          opacity: 0.4;
-        }
-      }
-    `;
-
-    return {
-      container,
-      loadMoreButton,
-      loadingPlaceholder,
-      node,
-      nodeName,
-      nodeSelected,
-      skeleton,
-      toggleButton,
-      togglePlaceholder,
-    };
-  }, [
-    theme.vars.colors.action.hover,
-    theme.vars.colors.action.selected,
-    theme.vars.colors.background.disabled,
-    theme.vars.colors.border,
-    theme.vars.colors.primary.main,
-    theme.vars.colors.text.primary,
-    theme.vars.colors.text.secondary,
-    theme.vars.borderRadius.medium,
-    theme.vars.borderRadius.small,
-    theme.vars.spacing.unit,
-    theme.vars.typography.fontFamily,
-  ]);
-
-export default useStyles;
diff --git a/packages/react/src/components/presentation/auth/OrganizationUnitPicker/OrganizationUnitPicker.tsx b/packages/react/src/components/presentation/auth/OrganizationUnitPicker/OrganizationUnitPicker.tsx
deleted file mode 100644
index 438561c..0000000
--- a/packages/react/src/components/presentation/auth/OrganizationUnitPicker/OrganizationUnitPicker.tsx
+++ /dev/null
@@ -1,245 +0,0 @@
-/**
- * Copyright (c) 2026, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {cx} from '@emotion/css';
-import {OrganizationUnit, OrganizationUnitListResponse} from '@thunderid/browser';
-import React, {useCallback, useEffect, useState} from 'react';
-import useStyles from './OrganizationUnitPicker.styles';
-import useTheme from '../../../../contexts/Theme/useTheme';
-
-interface NodeState {
-  children: OrganizationUnit[];
-  expanded: boolean;
-  hasMore: boolean;
-  loading: boolean;
-  offset: number;
-  totalResults: number;
-}
-
-export interface OrganizationUnitPickerProps {
-  className?: string;
-  fetchChildren: (parentId: string, limit: number, offset: number) => Promise<OrganizationUnitListResponse>;
-  onSelect: (ouId: string) => void;
-  pageSize?: number;
-  rootOuId: string;
-  selectedOuId?: string | null;
-}
-
-const OrganizationUnitPicker = ({
-  rootOuId,
-  selectedOuId,
-  onSelect,
-  fetchChildren,
-  pageSize = 10,
-  className,
-}: OrganizationUnitPickerProps): React.ReactElement => {
-  const {theme} = useTheme();
-  const styles: Record<string, string> = useStyles(theme);
-
-  const [nodeStates, setNodeStates] = useState<Record<string, NodeState>>({});
-
-  const loadChildren: (parentId: string, offset?: number) => Promise<void> = useCallback(
-    async (parentId: string, offset = 0) => {
-      setNodeStates((prev: Record<string, NodeState>) => ({
-        ...prev,
-        [parentId]: {
-          ...(prev[parentId] || {children: [], expanded: true, hasMore: false, offset: 0, totalResults: 0}),
-          loading: true,
-        },
-      }));
-
-      try {
-        const response: OrganizationUnitListResponse = await fetchChildren(parentId, pageSize, offset);
-        const newChildren: OrganizationUnit[] = response.organizationUnits || [];
-
-        setNodeStates((prev: Record<string, NodeState>) => {
-          const existing: NodeState = prev[parentId] || {
-            children: [],
-            expanded: true,
-            hasMore: false,
-            loading: false,
-            offset: 0,
-            totalResults: 0,
-          };
-          const mergedChildren: OrganizationUnit[] =
-            offset === 0 ? newChildren : [...existing.children, ...newChildren];
-          const newOffset: number = offset + newChildren.length;
-
-          return {
-            ...prev,
-            [parentId]: {
-              children: mergedChildren,
-              expanded: true,
-              hasMore: newOffset < response.totalResults,
-              loading: false,
-              offset: newOffset,
-              totalResults: response.totalResults,
-            },
-          };
-        });
-      } catch {
-        setNodeStates((prev: Record<string, NodeState>) => ({
-          ...prev,
-          [parentId]: {
-            ...(prev[parentId] || {children: [], expanded: true, hasMore: false, offset: 0, totalResults: 0}),
-            loading: false,
-          },
-        }));
-      }
-    },
-    [fetchChildren, pageSize],
-  );
-
-  // Auto-load root children on mount
-  useEffect(() => {
-    if (rootOuId && !nodeStates[rootOuId]) {
-      loadChildren(rootOuId);
-    }
-  }, [rootOuId, loadChildren, nodeStates]);
-
-  const handleToggle: (ouId: string) => void = useCallback(
-    (ouId: string) => {
-      const state: NodeState | undefined = nodeStates[ouId];
-
-      if (state?.expanded) {
-        setNodeStates((prev: Record<string, NodeState>) => ({
-          ...prev,
-          [ouId]: {...prev[ouId], expanded: false},
-        }));
-      } else if (state?.children.length) {
-        setNodeStates((prev: Record<string, NodeState>) => ({
-          ...prev,
-          [ouId]: {...prev[ouId], expanded: true},
-        }));
-      } else {
-        loadChildren(ouId);
-      }
-    },
-    [nodeStates, loadChildren],
-  );
-
-  const handleLoadMore: (parentId: string) => void = useCallback(
-    (parentId: string) => {
-      const state: NodeState | undefined = nodeStates[parentId];
-
-      if (state) {
-        loadChildren(parentId, state.offset);
-      }
-    },
-    [nodeStates, loadChildren],
-  );
-
-  const renderLoadingPlaceholders = (depth: number): React.ReactElement => (
-    <>
-      {[0, 1, 2].map((i: number) => (
-        <div
-          key={`skeleton-${i}`}
-          className={styles['loadingPlaceholder']}
-          style={{paddingLeft: `${(depth + 1) * 20}px`}}
-        >
-          <div className={styles['skeleton']} style={{width: `${100 - i * 20}px`}} />
-        </div>
-      ))}
-    </>
-  );
-
-  const renderNode = (ou: OrganizationUnit, depth = 0): React.ReactElement => {
-    const state: NodeState | undefined = nodeStates[ou.id];
-    const isSelected: boolean = selectedOuId === ou.id;
-    const isExpanded: boolean = state?.expanded || false;
-    const isLoading: boolean = state?.loading || false;
-    const hasChildren: boolean = !state || state.totalResults > 0 || state.children.length > 0;
-
-    return (
-      <React.Fragment key={ou.id}>
-        <div
-          className={cx(styles['node'], isSelected && styles['nodeSelected'])}
-          style={{paddingLeft: `${depth * 20 + 12}px`}}
-          role="treeitem"
-          aria-selected={isSelected}
-          aria-expanded={hasChildren ? isExpanded : undefined}
-          onClick={() => onSelect(ou.id)}
-          onKeyDown={(e: React.KeyboardEvent) => {
-            if (e.key === 'Enter' || e.key === ' ') {
-              e.preventDefault();
-              onSelect(ou.id);
-            }
-          }}
-          tabIndex={0}
-        >
-          {hasChildren ? (
-            <button
-              className={styles['toggleButton']}
-              onClick={(e: React.MouseEvent) => {
-                e.stopPropagation();
-                handleToggle(ou.id);
-              }}
-              aria-label={isExpanded ? 'Collapse' : 'Expand'}
-              type="button"
-            >
-              {isExpanded ? '▾' : '▸'}
-            </button>
-          ) : (
-            <span className={styles['togglePlaceholder']} />
-          )}
-          <span className={styles['nodeName']}>{ou.name}</span>
-        </div>
-
-        {isExpanded && isLoading && !state?.children.length && renderLoadingPlaceholders(depth)}
-
-        {isExpanded && state?.children.map((child: OrganizationUnit) => renderNode(child, depth + 1))}
-
-        {isExpanded && state?.hasMore && (
-          <button
-            className={styles['loadMoreButton']}
-            style={{paddingLeft: `${(depth + 1) * 20 + 12}px`}}
-            onClick={() => handleLoadMore(ou.id)}
-            disabled={isLoading}
-            type="button"
-          >
-            {isLoading ? 'Loading...' : 'Load more'}
-          </button>
-        )}
-      </React.Fragment>
-    );
-  };
-
-  const rootState: NodeState | undefined = nodeStates[rootOuId];
-  const isRootLoading: boolean = rootState?.loading && !rootState?.children.length;
-
-  return (
-    <div className={cx(styles['container'], className)} role="tree" aria-label="Organization unit picker">
-      {isRootLoading && renderLoadingPlaceholders(0)}
-
-      {rootState?.children.map((ou: OrganizationUnit) => renderNode(ou, 0))}
-
-      {rootState?.hasMore && (
-        <button
-          className={styles['loadMoreButton']}
-          onClick={() => handleLoadMore(rootOuId)}
-          disabled={rootState?.loading}
-          type="button"
-        >
-          {rootState?.loading ? 'Loading...' : 'Load more'}
-        </button>
-      )}
-    </div>
-  );
-};
-
-export default OrganizationUnitPicker;
diff --git a/packages/react/src/components/presentation/auth/OrganizationUnitPicker/index.ts b/packages/react/src/components/presentation/auth/OrganizationUnitPicker/index.ts
deleted file mode 100644
index 1223d67..0000000
--- a/packages/react/src/components/presentation/auth/OrganizationUnitPicker/index.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-/**
- * Copyright (c) 2026, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-export {default as OrganizationUnitPicker} from './OrganizationUnitPicker';
-export type {OrganizationUnitPickerProps} from './OrganizationUnitPicker';
diff --git a/packages/react/src/contexts/Organization/OrganizationContext.ts b/packages/react/src/contexts/Organization/OrganizationContext.ts
deleted file mode 100644
index 83bee07..0000000
--- a/packages/react/src/contexts/Organization/OrganizationContext.ts
+++ /dev/null
@@ -1,59 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {AllOrganizationsApiResponse, Organization, CreateOrganizationPayload} from '@thunderid/browser';
-import {Context, createContext} from 'react';
-
-/**
- * Props interface of {@link OrganizationContext}
- */
-export interface OrganizationContextProps {
-  /**
-   * Function to create a new organization.
-   */
-  createOrganization?: (payload: CreateOrganizationPayload, sessionId: string) => Promise<Organization>;
-  currentOrganization: Organization | null;
-  error: string | null;
-  getAllOrganizations: () => Promise<AllOrganizationsApiResponse>;
-  isLoading: boolean;
-  myOrganizations: Organization[];
-  revalidateMyOrganizations: () => Promise<Organization[]>;
-  switchOrganization: (organization: Organization) => Promise<void>;
-}
-
-/**
- * Context object for managing organization data and related operations.
- */
-const OrganizationContext: Context<OrganizationContextProps | null> = createContext<null | OrganizationContextProps>({
-  createOrganization: () => null as unknown as Promise<Organization>,
-  currentOrganization: null,
-  error: null,
-  getAllOrganizations: () =>
-    Promise.resolve({
-      count: 0,
-      organizations: [],
-    }),
-  isLoading: false,
-  myOrganizations: [] as Organization[],
-  revalidateMyOrganizations: () => Promise.resolve([]),
-  switchOrganization: () => Promise.resolve(),
-});
-
-OrganizationContext.displayName = 'OrganizationContext';
-
-export default OrganizationContext;
diff --git a/packages/react/src/contexts/Organization/OrganizationProvider.tsx b/packages/react/src/contexts/Organization/OrganizationProvider.tsx
deleted file mode 100644
index 233f8a5..0000000
--- a/packages/react/src/contexts/Organization/OrganizationProvider.tsx
+++ /dev/null
@@ -1,178 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {
-  ThunderIDRuntimeError,
-  Organization,
-  AllOrganizationsApiResponse,
-  CreateOrganizationPayload,
-  TokenResponse,
-} from '@thunderid/browser';
-import {FC, PropsWithChildren, ReactElement, useCallback, useMemo, useState} from 'react';
-import OrganizationContext, {OrganizationContextProps} from './OrganizationContext';
-
-/**
- * Props interface of {@link OrganizationProvider}
- */
-export interface OrganizationProviderProps {
-  /**
-   * Whether to automatically fetch organizations on mount
-   */
-  autoFetch?: boolean;
-  /**
-   * Function to create a new organization.
-   */
-  createOrganization?: (payload: CreateOrganizationPayload, sessionId: string) => Promise<Organization>;
-  /**
-   * Initial current organization
-   */
-  currentOrganization?: Organization | null;
-  /**
-   * Initial list of organizations
-   */
-  getAllOrganizations?: () => Promise<AllOrganizationsApiResponse>;
-  /**
-   * List of organizations the signed-in user belongs to.
-   */
-  myOrganizations?: Organization[];
-  /**
-   * Callback function called when an error occurs
-   */
-  onError?: (error: string) => void;
-  /**
-   * Callback function called when switching organizations
-   */
-  onOrganizationSwitch?: (organization: Organization) => Promise<TokenResponse | Response>;
-  /**
-   * Refetch the my organizations list.
-   * @returns
-   */
-  revalidateMyOrganizations: () => Promise<Organization[]>;
-}
-
-/**
- * OrganizationProvider component that manages organization data and provides it through OrganizationContext.
- *
- * This provider:
- * - Fetches organization data from the organizations endpoint
- * - Manages current organization state
- * - Provides functions for switching organizations and refreshing data
- * - Handles loading states and errors
- *
- * @example
- * ```tsx
- * // Basic usage with auto-fetch (uses internal API)
- * <OrganizationProvider>
- *   <App />
- * </OrganizationProvider>
- *
- * // With custom error handling
- * <OrganizationProvider onError={(error) => console.error('Organization error:', error)}>
- *   <App />
- * </OrganizationProvider>
- *
- * // With custom organization switch handler
- * <OrganizationProvider
- *   onOrganizationSwitch={(org) => console.log('Switched to:', org.name)}
- * >
- *   <App />
- * </OrganizationProvider>
- *
- * // Disable auto-fetch (fetch manually using revalidateMyOrganizations)
- * <OrganizationProvider autoFetch={false}>
- *   <App />
- * </OrganizationProvider>
- * ```
- */
-const OrganizationProvider: FC<PropsWithChildren<OrganizationProviderProps>> = ({
-  children,
-  currentOrganization,
-  onError,
-  myOrganizations,
-  onOrganizationSwitch,
-  revalidateMyOrganizations,
-  getAllOrganizations,
-  createOrganization,
-}: PropsWithChildren<OrganizationProviderProps>): ReactElement => {
-  const [isLoading, setIsLoading] = useState<boolean>(false);
-  const [error, setError] = useState<string | null>(null);
-
-  /**
-   * Switches to a different organization
-   */
-  const switchOrganization: (organization: Organization) => Promise<void> = useCallback(
-    async (organization: Organization): Promise<void> => {
-      if (!onOrganizationSwitch) {
-        throw new ThunderIDRuntimeError(
-          'onOrganizationSwitch callback is required',
-          'OrganizationProvider-SwitchError-001',
-          'react',
-          'The onOrganizationSwitch callback must be provided to handle organization switching.',
-        );
-      }
-
-      setIsLoading(true);
-      setError(null);
-
-      try {
-        await onOrganizationSwitch(organization);
-        // The organization state will be updated by the parent provider
-      } catch (switchError) {
-        const errorMessage: string =
-          switchError instanceof Error ? switchError.message : 'Failed to switch organization';
-        setError(errorMessage);
-        if (onError) {
-          onError(errorMessage);
-        }
-        throw switchError; // Re-throw so the UI can handle it
-      } finally {
-        setIsLoading(false);
-      }
-    },
-    [onOrganizationSwitch, onError],
-  );
-
-  const contextValue: OrganizationContextProps = useMemo(
-    () => ({
-      createOrganization,
-      currentOrganization: currentOrganization ?? null,
-      error,
-      getAllOrganizations:
-        getAllOrganizations ??
-        ((): Promise<AllOrganizationsApiResponse> => Promise.resolve({count: 0, organizations: []})),
-      isLoading,
-      myOrganizations: myOrganizations ?? [],
-      revalidateMyOrganizations,
-      switchOrganization,
-    }),
-    [
-      currentOrganization,
-      error,
-      isLoading,
-      myOrganizations,
-      switchOrganization,
-      revalidateMyOrganizations,
-      getAllOrganizations,
-      createOrganization,
-    ],
-  );
-
-  return <OrganizationContext.Provider value={contextValue}>{children}</OrganizationContext.Provider>;
-};
-
-export default OrganizationProvider;
diff --git a/packages/react/src/contexts/Organization/useOrganization.ts b/packages/react/src/contexts/Organization/useOrganization.ts
deleted file mode 100644
index b4790b9..0000000
--- a/packages/react/src/contexts/Organization/useOrganization.ts
+++ /dev/null
@@ -1,116 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {useContext} from 'react';
-import OrganizationContext, {OrganizationContextProps} from './OrganizationContext';
-
-/**
- * Hook to access the Organization context.
- *
- * This hook provides access to organization data including:
- * - List of organizations the user belongs to
- * - Current organization
- * - Functions to switch organizations and refresh data
- * - Function to fetch organizations programmatically
- * - Loading states and error handling
- *
- * @returns {OrganizationContextProps} The organization context value containing all organization-related data and functions
- * @throws {Error} Throws an error if used outside of OrganizationProvider
- *
- * @example
- * ```tsx
- * import {useOrganization} from '@thunderid/react';
- *
- * function OrganizationSelector() {
- *   const {
- *     organizations,
- *     currentOrganization,
- *     switchOrganization,
- *     revalidateMyOrganizations,
- *     getOrganizations,
- *     isLoading,
- *     error
- *   } = useOrganization();
- *
- *   if (isLoading) {
- *     return <div>Loading organizations...</div>;
- *   }
- *
- *   if (error) {
- *     return <div>Error: {error}</div>;
- *   }
- *
- *   return (
- *     <div>
- *       <h2>Current: {currentOrganization?.name}</h2>
- *       <select
- *         value={currentOrganization?.id || ''}
- *         onChange={(e) => {
- *           const org = organizations?.find(o => o.id === e.target.value);
- *           if (org) switchOrganization(org);
- *         }}
- *       >
- *         {organizations?.map(org => (
- *           <option key={org.id} value={org.id}>
- *             {org.name}
- *           </option>
- *         ))}
- *       </select>
- *       <button onClick={revalidateMyOrganizations}>
- *         Refresh Organizations
- *       </button>
- *       <button onClick={async () => {
- *         const fresh = await getOrganizations();
- *         console.log('Fresh organizations:', fresh);
- *       }}>
- *         Get Organizations Manually
- *       </button>
- *     </div>
- *   );
- * }
- *
- * // Switch to a specific organization
- * function SwitchOrgButton() {
- *   const {organizations, switchOrganization} = useOrganization();
- *
- *   const handleSwitch = (orgId: string) => {
- *     const org = organizations?.find(o => o.id === orgId);
- *     if (org) {
- *       switchOrganization(org);
- *     }
- *   };
- *
- *   return (
- *     <button onClick={() => handleSwitch('org-123')}>
- *       Switch to Organization
- *     </button>
- *   );
- * }
- * ```
- */
-const useOrganization = (): OrganizationContextProps => {
-  const context: OrganizationContextProps | null = useContext(OrganizationContext);
-
-  if (!context) {
-    throw new Error('useOrganization must be used within an OrganizationProvider');
-  }
-
-  return context;
-};
-
-export default useOrganization;
diff --git a/packages/react/src/contexts/ThunderID/ThunderIDContext.ts b/packages/react/src/contexts/ThunderID/ThunderIDContext.ts
index 005694a..0507021 100644
--- a/packages/react/src/contexts/ThunderID/ThunderIDContext.ts
+++ b/packages/react/src/contexts/ThunderID/ThunderIDContext.ts
@@ -22,7 +22,6 @@ import {
   HttpResponse,
   IdToken,
   OIDCDiscoveryApiResponse,
-  Organization,
   SignInOptions,
   TokenExchangeRequestConfig,
   TokenResponse,
@@ -126,8 +125,6 @@ export type ThunderIDContextProps = {
    */
   meta: FlowMetadataResponse | null;
 
-  organization: Organization;
-
   organizationHandle: string | undefined;
 
   /**
@@ -211,7 +208,7 @@ export type ThunderIDContextProps = {
   signUpUrl: string | undefined;
 
   user: any;
-} & Pick<ThunderIDReactClient, 'clearSession' | 'switchOrganization'>;
+} & Pick<ThunderIDReactClient, 'clearSession'>;
 
 /**
  * Context object for managing the Authentication flow builder core context.
@@ -241,7 +238,6 @@ const ThunderIDContext: Context<ThunderIDContextProps | null> = createContext<nu
   isMetaLoading: false,
   isSignedIn: false,
   meta: null,
-  organization: null as unknown as Organization,
   organizationHandle: undefined,
   reInitialize: null as unknown as ThunderIDContextProps['reInitialize'],
   recover: () => Promise.resolve({} as any),
@@ -252,7 +248,6 @@ const ThunderIDContext: Context<ThunderIDContextProps | null> = createContext<nu
   signOut: () => Promise.resolve({} as any),
   signUp: () => Promise.resolve({} as any),
   signUpUrl: undefined,
-  switchOrganization: null as unknown as ThunderIDContextProps['switchOrganization'],
   user: null,
 });
 
diff --git a/packages/react/src/contexts/ThunderID/ThunderIDProvider.tsx b/packages/react/src/contexts/ThunderID/ThunderIDProvider.tsx
index 9309e8e..c69eed8 100644
--- a/packages/react/src/contexts/ThunderID/ThunderIDProvider.tsx
+++ b/packages/react/src/contexts/ThunderID/ThunderIDProvider.tsx
@@ -17,18 +17,15 @@
  */
 
 import {
-  AllOrganizationsApiResponse,
   ThunderIDRuntimeError,
   generateFlattenedUserProfile,
   OIDCDiscoveryApiResponse,
-  Organization,
   SignInOptions,
   User,
   UserProfile,
   IdToken,
   extractUserClaimsFromIdToken,
   EmbeddedSignInFlowResponse,
-  TokenResponse,
   createPackageComponentLogger,
 } from '@thunderid/browser';
 import {FC, RefObject, PropsWithChildren, ReactElement, useEffect, useMemo, useRef, useState, useCallback} from 'react';
@@ -40,7 +37,6 @@ import ComponentRendererProvider from '../ComponentRenderer/ComponentRendererPro
 import FlowProvider from '../Flow/FlowProvider';
 import FlowMetaProvider from '../FlowMeta/FlowMetaProvider';
 import I18nProvider from '../I18n/I18nProvider';
-import OrganizationProvider from '../Organization/OrganizationProvider';
 import ThemeProvider from '../Theme/ThemeProvider';
 import UserProvider from '../User/UserProvider';
 
@@ -79,13 +75,10 @@ const ThunderIDProvider: FC<PropsWithChildren<ThunderIDProviderProps>> = ({
   const storageManagerRef: any = useRef<any>(null);
   const {hasAuthParams, hasCalledForThisInstance} = useBrowserUrl();
   const [user, setUser] = useState<any | null>(null);
-  const [currentOrganization, setCurrentOrganization] = useState<Organization | null>(null);
-
   const [isSignedInSync, setIsSignedInSync] = useState<boolean>(false);
   const [isInitializedSync, setIsInitializedSync] = useState<boolean>(false);
   const [isLoadingSync, setIsLoadingSync] = useState<boolean>(true);
 
-  const [myOrganizations, setMyOrganizations] = useState<Organization[]>([]);
   const [userProfile, setUserProfile] = useState<UserProfile | null>(null);
   const [baseUrl, setBaseUrl] = useState<string>(initialBaseUrl ?? '');
   const [config, setConfig] = useState<ThunderIDReactConfig>({
@@ -368,30 +361,6 @@ const ThunderIDProvider: FC<PropsWithChildren<ThunderIDProviderProps>> = ({
     }
   };
 
-  const switchOrganization = async (organization: Organization): Promise<TokenResponse | Response> => {
-    try {
-      setIsUpdatingSession(true);
-      setIsLoadingSync(true);
-      const response: TokenResponse | Response = await client.switchOrganization(organization);
-
-      if (await client.isSignedIn()) {
-        await updateSession();
-      }
-
-      return response;
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to switch organization: ${error instanceof Error ? error.message : String(JSON.stringify(error))}`,
-        'thunderid-switchOrganization-Error',
-        'react',
-        'An error occurred while switching to the specified organization.',
-      );
-    } finally {
-      setIsUpdatingSession(false);
-      setIsLoadingSync(client.isLoading());
-    }
-  };
-
   const handleProfileUpdate = (payload: User): void => {
     setUser(payload);
     setUserProfile((prev: UserProfile | null) => ({
@@ -485,7 +454,6 @@ const ThunderIDProvider: FC<PropsWithChildren<ThunderIDProviderProps>> = ({
       isInitialized: isInitializedSync,
       isLoading: isLoadingSync,
       isSignedIn: isSignedInSync,
-      organization: currentOrganization,
       organizationChain,
       organizationHandle: config?.organizationHandle,
       reInitialize,
@@ -498,7 +466,6 @@ const ThunderIDProvider: FC<PropsWithChildren<ThunderIDProviderProps>> = ({
       signOut,
       signUp,
       signUpUrl,
-      switchOrganization,
       syncSession,
       user,
     }),
@@ -515,7 +482,6 @@ const ThunderIDProvider: FC<PropsWithChildren<ThunderIDProviderProps>> = ({
       isInitializedSync,
       isLoadingSync,
       isSignedInSync,
-      currentOrganization,
       signIn,
       signInSilently,
       user,
@@ -523,7 +489,6 @@ const ThunderIDProvider: FC<PropsWithChildren<ThunderIDProviderProps>> = ({
       signInOptions,
       tokenRequest,
       syncSession,
-      switchOrganization,
       getDecodedIdToken,
       clearSession,
       exchangeToken,
@@ -552,17 +517,9 @@ const ThunderIDProvider: FC<PropsWithChildren<ThunderIDProviderProps>> = ({
           >
             <FlowProvider>
               <UserProvider profile={userProfile!} onUpdateProfile={handleProfileUpdate}>
-                <OrganizationProvider
-                  getAllOrganizations={async (): Promise<AllOrganizationsApiResponse> => client.getAllOrganizations()}
-                  myOrganizations={myOrganizations}
-                  currentOrganization={currentOrganization}
-                  onOrganizationSwitch={switchOrganization}
-                  revalidateMyOrganizations={async (): Promise<Organization[]> => client.getMyOrganizations()}
-                >
-                  <ComponentRendererProvider renderers={(extensions?.components?.renderers ?? {}) as any}>
-                    {children}
-                  </ComponentRendererProvider>
-                </OrganizationProvider>
+                <ComponentRendererProvider renderers={(extensions?.components?.renderers ?? {}) as any}>
+                  {children}
+                </ComponentRendererProvider>
               </UserProvider>
             </FlowProvider>
           </ThemeProvider>
diff --git a/packages/react/src/contexts/ThunderID/__tests__/useThunderID.test.tsx b/packages/react/src/contexts/ThunderID/__tests__/useThunderID.test.tsx
index c6fdb77..31d3914 100644
--- a/packages/react/src/contexts/ThunderID/__tests__/useThunderID.test.tsx
+++ b/packages/react/src/contexts/ThunderID/__tests__/useThunderID.test.tsx
@@ -17,7 +17,6 @@
  */
 
 import {cleanup, render, screen} from '@testing-library/react';
-import {Organization} from '@thunderid/browser';
 import {afterEach, describe, expect, it, vi} from 'vitest';
 import ThunderIDContext, {ThunderIDContextProps} from '../ThunderIDContext';
 import useThunderID from '../useThunderID';
@@ -42,7 +41,6 @@ function createMockContext(overrides: Partial<ThunderIDContextProps> = {}): Thun
     isMetaLoading: false,
     isSignedIn: false,
     meta: null,
-    organization: null as unknown as Organization,
     organizationHandle: undefined,
     reInitialize: vi.fn(),
     recover: vi.fn(),
@@ -55,7 +53,6 @@ function createMockContext(overrides: Partial<ThunderIDContextProps> = {}): Thun
     signUp: vi.fn(),
     signUpUrl: undefined,
     storage: undefined,
-    switchOrganization: vi.fn(),
     user: null,
     ...overrides,
   } as unknown as ThunderIDContextProps;
diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts
index ecc338c..398ed42 100644
--- a/packages/react/src/index.ts
+++ b/packages/react/src/index.ts
@@ -32,11 +32,6 @@ export * from './contexts/User/UserProvider';
 
 export {default as useUser} from './contexts/User/useUser';
 
-export {default as OrganizationProvider} from './contexts/Organization/OrganizationProvider';
-export * from './contexts/Organization/OrganizationProvider';
-
-export {default as useOrganization} from './contexts/Organization/useOrganization';
-
 export {default as FlowContext} from './contexts/Flow/FlowContext';
 export type {FlowStep, FlowMessage, FlowContextValue} from './contexts/Flow/FlowContext';
 
@@ -99,9 +94,6 @@ export * from './components/control/SignedOut';
 export {default as Loading} from './components/control/Loading';
 export * from './components/control/Loading';
 
-export {default as OrganizationContext} from './components/control/OrganizationContext/OrganizationContext';
-export * from './components/control/OrganizationContext/OrganizationContext';
-
 export {default as BaseSignIn} from './components/presentation/auth/SignIn/BaseSignIn';
 export * from './components/presentation/auth/SignIn/BaseSignIn';
 
@@ -121,7 +113,6 @@ export {default as Recovery} from './components/presentation/auth/Recovery/Recov
 export * from './components/presentation/auth/Recovery/Recovery';
 
 export * from './components/presentation/auth/InviteUser';
-export * from './components/presentation/auth/OrganizationUnitPicker';
 
 export {BaseAcceptInvite, AcceptInvite} from './components/presentation/auth/AcceptInvite';
 export type {AcceptInviteFlowResponse} from './components/presentation/auth/AcceptInvite';
@@ -155,11 +146,6 @@ export * from './components/presentation/User/BaseUser';
 export {default as User} from './components/presentation/User/User';
 export * from './components/presentation/User/User';
 
-export {default as BaseOrganization} from './components/presentation/Organization/BaseOrganization';
-export * from './components/presentation/Organization/BaseOrganization';
-
-export {default as Organization} from './components/presentation/Organization/Organization';
-
 export {default as BaseUserProfile} from './components/presentation/UserProfile/BaseUserProfile';
 export * from './components/presentation/UserProfile/BaseUserProfile';
 
@@ -178,33 +164,6 @@ export type {BaseUserDropdownProps} from './components/presentation/UserDropdown
 export {default as UserDropdown} from './components/presentation/UserDropdown/UserDropdown';
 export * from './components/presentation/UserDropdown/UserDropdown';
 
-export {default as BaseOrganizationSwitcher} from './components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher';
-export type {BaseOrganizationSwitcherProps} from './components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher';
-
-export {default as OrganizationSwitcher} from './components/presentation/OrganizationSwitcher/OrganizationSwitcher';
-
-export {default as BaseOrganizationList} from './components/presentation/OrganizationList/BaseOrganizationList';
-export type {
-  BaseOrganizationListProps,
-  OrganizationWithSwitchAccess,
-} from './components/presentation/OrganizationList/BaseOrganizationList';
-
-export {default as OrganizationList} from './components/presentation/OrganizationList/OrganizationList';
-
-export {default as BaseOrganizationProfile} from './components/presentation/OrganizationProfile/BaseOrganizationProfile';
-export * from './components/presentation/OrganizationProfile/BaseOrganizationProfile';
-
-export {default as OrganizationProfile} from './components/presentation/OrganizationProfile/OrganizationProfile';
-export * from './components/presentation/OrganizationProfile/OrganizationProfile';
-
-export {BaseCreateOrganization} from './components/presentation/CreateOrganization/BaseCreateOrganization';
-export type {
-  BaseCreateOrganizationProps,
-  OrganizationFormData,
-} from './components/presentation/CreateOrganization/BaseCreateOrganization';
-
-export {CreateOrganization} from './components/presentation/CreateOrganization/CreateOrganization';
-
 export {default as BaseLanguageSwitcher} from './components/presentation/LanguageSwitcher/BaseLanguageSwitcher';
 export type {
   BaseLanguageSwitcherProps,
@@ -280,18 +239,6 @@ export {createField, FieldFactory, validateFieldValue} from './components/factor
 
 export {default as BuildingAlt} from './components/primitives/Icons/BuildingAlt';
 
-export {default as getAllOrganizations} from './api/getAllOrganizations';
-export type {GetAllOrganizationsConfig} from './api/getAllOrganizations';
-export {default as createOrganization} from './api/createOrganization';
-export type {CreateOrganizationConfig} from './api/createOrganization';
-export {default as getMeOrganizations} from './api/getMeOrganizations';
-export type {GetMeOrganizationsConfig} from './api/getMeOrganizations';
-export {default as getOrganization} from './api/getOrganization';
-export type {GetOrganizationConfig} from './api/getOrganization';
-export {default as updateOrganization, createPatchOperations} from './api/updateOrganization';
-export type {UpdateOrganizationConfig} from './api/updateOrganization';
-export {default as getSchemas} from './api/getSchemas';
-export type {GetSchemasConfig} from './api/getSchemas';
 export {default as updateMeProfile} from './api/updateMeProfile';
 export type {UpdateMeProfileConfig} from './api/updateMeProfile';
 export {default as getMeProfile} from './api/getScim2Me';
diff --git a/packages/vue/src/ThunderIDVueClient.ts b/packages/vue/src/ThunderIDVueClient.ts
index fbb4696..ca08145 100644
--- a/packages/vue/src/ThunderIDVueClient.ts
+++ b/packages/vue/src/ThunderIDVueClient.ts
@@ -27,9 +27,7 @@ import {
   ThunderIDRuntimeError,
   executeEmbeddedSignUpFlow,
   executeEmbeddedSignInFlow,
-  Organization,
   IdToken,
-  AllOrganizationsApiResponse,
   extractUserClaimsFromIdToken,
   TokenResponse,
   HttpRequestConfig,
@@ -41,8 +39,6 @@ import {
   EmbeddedSignUpFlowStatus,
   StorageManager,
 } from '@thunderid/browser';
-import getAllOrganizations from './api/getAllOrganizations';
-import getMeOrganizations from './api/getMeOrganizations';
 import getSchemas from './api/getSchemas';
 import getScim2Me from './api/getScim2Me';
 import {ThunderIDVueConfig} from './models/config';
@@ -160,109 +156,6 @@ class ThunderIDVueClient<T extends ThunderIDVueConfig = ThunderIDVueConfig> exte
     });
   }
 
-  override async getMyOrganizations(options?: any): Promise<Organization[]> {
-    try {
-      let baseUrl: string = options?.baseUrl;
-
-      if (!baseUrl) {
-        const configData: any = await this.getStorageManager().getConfigData();
-        baseUrl = configData?.baseUrl;
-      }
-
-      return await getMeOrganizations({baseUrl, instanceId: this.getInstanceId()});
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to fetch the user's associated organizations: ${
-          error instanceof Error ? error.message : String(error)
-        }`,
-        'ThunderIDVueClient-getMyOrganizations-RuntimeError-001',
-        'vue',
-        'An error occurred while fetching associated organizations of the signed-in user.',
-      );
-    }
-  }
-
-  override async getAllOrganizations(options?: any): Promise<AllOrganizationsApiResponse> {
-    try {
-      let baseUrl: string = options?.baseUrl;
-
-      if (!baseUrl) {
-        const configData: any = await this.getStorageManager().getConfigData();
-        baseUrl = configData?.baseUrl;
-      }
-
-      return await getAllOrganizations({baseUrl, instanceId: this.getInstanceId()});
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to fetch all organizations: ${error instanceof Error ? error.message : String(error)}`,
-        'ThunderIDVueClient-getAllOrganizations-RuntimeError-001',
-        'vue',
-        'An error occurred while fetching all the organizations associated with the user.',
-      );
-    }
-  }
-
-  override async getCurrentOrganization(): Promise<Organization | null> {
-    try {
-      return await this.withLoading(async () => {
-        const idToken: IdToken = await this.getDecodedIdToken();
-        return {
-          id: idToken?.org_id ?? '',
-          name: idToken?.org_name ?? '',
-          orgHandle: idToken?.org_handle ?? '',
-        };
-      });
-    } catch (error) {
-      throw new ThunderIDRuntimeError(
-        `Failed to fetch the current organization: ${error instanceof Error ? error.message : String(error)}`,
-        'ThunderIDVueClient-getCurrentOrganization-RuntimeError-001',
-        'vue',
-        'An error occurred while fetching the current organization of the signed-in user.',
-      );
-    }
-  }
-
-  override async switchOrganization(organization: Organization): Promise<TokenResponse | Response> {
-    return this.withLoading(async () => {
-      try {
-        const configData: any = await this.getStorageManager().getConfigData();
-        const sourceInstanceId: number | undefined = configData?.organizationChain?.sourceInstanceId;
-
-        if (!organization.id) {
-          throw new ThunderIDRuntimeError(
-            'Organization ID is required for switching organizations',
-            'vue-ThunderIDVueClient-SwitchOrganizationError-001',
-            'vue',
-            'The organization object must contain a valid ID to perform the organization switch.',
-          );
-        }
-
-        const exchangeConfig: TokenExchangeRequestConfig = {
-          attachToken: false,
-          data: {
-            client_id: '{{clientId}}',
-            grant_type: 'organization_switch',
-            scope: '{{scopes}}',
-            switching_organization: organization.id,
-            token: '{{accessToken}}',
-          },
-          id: 'organization-switch',
-          returnsSession: true,
-          signInRequired: sourceInstanceId === undefined,
-        };
-
-        return (await super.exchangeToken(exchangeConfig as any)) as unknown as TokenResponse | Response;
-      } catch (error) {
-        throw new ThunderIDRuntimeError(
-          `Failed to switch organization: ${error.message || error}`,
-          'vue-ThunderIDVueClient-SwitchOrganizationError-003',
-          'vue',
-          'An error occurred while switching to the specified organization. Please try again.',
-        );
-      }
-    });
-  }
-
   override isLoading(): boolean {
     return this.loadingState || super.isLoading();
   }
diff --git a/packages/vue/src/__tests__/composables/useOrganization.test.ts b/packages/vue/src/__tests__/composables/useOrganization.test.ts
deleted file mode 100644
index 6df2683..0000000
--- a/packages/vue/src/__tests__/composables/useOrganization.test.ts
+++ /dev/null
@@ -1,100 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {mount} from '@vue/test-utils';
-import {describe, expect, it, vi} from 'vitest';
-import {defineComponent, h, ref, shallowRef} from 'vue';
-import useOrganization from '../../composables/useOrganization';
-import {ORGANIZATION_KEY} from '../../keys';
-import type {OrganizationContextValue} from '../../models/contexts';
-
-function createMockOrganizationContext(overrides: Partial<OrganizationContextValue> = {}): OrganizationContextValue {
-  return {
-    myOrganizations: shallowRef([]),
-    currentOrganization: shallowRef(null),
-    switchOrganization: vi.fn(),
-    getAllOrganizations: vi.fn(),
-    revalidateMyOrganizations: vi.fn(),
-    isLoading: ref(false),
-    error: ref(null),
-    ...overrides,
-  } as unknown as OrganizationContextValue;
-}
-
-describe('useOrganization', () => {
-  it('should return the OrganizationContextValue when called inside a provider', () => {
-    const mockContext = createMockOrganizationContext();
-    let result: OrganizationContextValue | undefined;
-
-    const TestChild = defineComponent({
-      setup() {
-        result = useOrganization();
-        return () => h('div', 'test');
-      },
-    });
-
-    mount(TestChild, {
-      global: {
-        provide: {
-          [ORGANIZATION_KEY as symbol]: mockContext,
-        },
-      },
-    });
-
-    expect(result).toBeDefined();
-    expect(result.myOrganizations.value).toEqual([]);
-    expect(result.currentOrganization.value).toBeNull();
-  });
-
-  it('should throw an error when called outside of ThunderIDProvider', () => {
-    const TestChild = defineComponent({
-      setup() {
-        useOrganization();
-        return () => h('div', 'test');
-      },
-    });
-
-    expect(() => {
-      mount(TestChild);
-    }).toThrow('[ThunderID] useOrganization() was called outside of <ThunderIDProvider>');
-  });
-
-  it('should expose organization management methods', () => {
-    const mockContext = createMockOrganizationContext();
-    let result: OrganizationContextValue | undefined;
-
-    const TestChild = defineComponent({
-      setup() {
-        result = useOrganization();
-        return () => h('div', 'test');
-      },
-    });
-
-    mount(TestChild, {
-      global: {
-        provide: {
-          [ORGANIZATION_KEY as symbol]: mockContext,
-        },
-      },
-    });
-
-    expect(typeof result.switchOrganization).toBe('function');
-    expect(typeof result.getAllOrganizations).toBe('function');
-    expect(typeof result.revalidateMyOrganizations).toBe('function');
-  });
-});
diff --git a/packages/vue/src/api/getAllOrganizations.ts b/packages/vue/src/api/getAllOrganizations.ts
deleted file mode 100644
index db0cca8..0000000
--- a/packages/vue/src/api/getAllOrganizations.ts
+++ /dev/null
@@ -1,62 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {
-  HttpResponse,
-  FetchHttpClient,
-  HttpRequestConfig,
-  getAllOrganizations as baseGetAllOrganizations,
-  GetAllOrganizationsConfig as BaseGetAllOrganizationsConfig,
-  AllOrganizationsApiResponse,
-} from '@thunderid/browser';
-
-export interface GetAllOrganizationsConfig extends Omit<BaseGetAllOrganizationsConfig, 'fetcher'> {
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  instanceId?: number;
-}
-
-const getAllOrganizations = async ({
-  fetcher,
-  instanceId = 0,
-  ...requestConfig
-}: GetAllOrganizationsConfig): Promise<AllOrganizationsApiResponse> => {
-  const defaultFetcher = async (url: string, config: RequestInit): Promise<Response> => {
-    const httpClient: FetchHttpClient = FetchHttpClient.getInstance(instanceId);
-
-    const response: HttpResponse<any> = await httpClient.request({
-      headers: config.headers as Record<string, string>,
-      method: config.method || 'GET',
-      url,
-    } as HttpRequestConfig);
-
-    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)),
-    } as Response;
-  };
-
-  return baseGetAllOrganizations({
-    ...requestConfig,
-    fetcher: fetcher || defaultFetcher,
-  });
-};
-
-export default getAllOrganizations;
diff --git a/packages/vue/src/api/getMeOrganizations.ts b/packages/vue/src/api/getMeOrganizations.ts
deleted file mode 100644
index 0901cde..0000000
--- a/packages/vue/src/api/getMeOrganizations.ts
+++ /dev/null
@@ -1,62 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {
-  Organization,
-  HttpResponse,
-  FetchHttpClient,
-  HttpRequestConfig,
-  getMeOrganizations as baseGetMeOrganizations,
-  GetMeOrganizationsConfig as BaseGetMeOrganizationsConfig,
-} from '@thunderid/browser';
-
-export interface GetMeOrganizationsConfig extends Omit<BaseGetMeOrganizationsConfig, 'fetcher'> {
-  fetcher?: (url: string, config: RequestInit) => Promise<Response>;
-  instanceId?: number;
-}
-
-const getMeOrganizations = async ({
-  fetcher,
-  instanceId = 0,
-  ...requestConfig
-}: GetMeOrganizationsConfig): Promise<Organization[]> => {
-  const defaultFetcher = async (url: string, config: RequestInit): Promise<Response> => {
-    const httpClient: FetchHttpClient = FetchHttpClient.getInstance(instanceId);
-
-    const response: HttpResponse<any> = await httpClient.request({
-      headers: config.headers as Record<string, string>,
-      method: config.method || 'GET',
-      url,
-    } as HttpRequestConfig);
-
-    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)),
-    } as Response;
-  };
-
-  return baseGetMeOrganizations({
-    ...requestConfig,
-    fetcher: fetcher || defaultFetcher,
-  });
-};
-
-export default getMeOrganizations;
diff --git a/packages/vue/src/components/presentation/create-organization/BaseCreateOrganization.ts b/packages/vue/src/components/presentation/create-organization/BaseCreateOrganization.ts
deleted file mode 100644
index a5194c0..0000000
--- a/packages/vue/src/components/presentation/create-organization/BaseCreateOrganization.ts
+++ /dev/null
@@ -1,118 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {withVendorCSSClassPrefix} from '@thunderid/browser';
-import {type Component, type PropType, type Ref, type VNode, defineComponent, h, ref} from 'vue';
-import Alert from '../../primitives/Alert';
-import Button from '../../primitives/Button';
-import Card from '../../primitives/Card';
-import TextField from '../../primitives/TextField';
-import Typography from '../../primitives/Typography';
-
-const cls = (name: string): string => withVendorCSSClassPrefix(`create-organization${name}`);
-
-interface BaseCreateOrganizationSetupProps {
-  className: string;
-  description: string;
-  onCreate?: (name: string) => Promise<void> | void;
-  title: string;
-}
-
-/**
- * BaseCreateOrganization — unstyled sub-organisation creation form.
- *
- * Provides a form with an org name input and create button.
- */
-const BaseCreateOrganization: Component = defineComponent({
-  name: 'BaseCreateOrganization',
-  props: {
-    className: {default: '', type: String},
-    description: {default: 'Create a new sub-organization.', type: String},
-    onCreate: {default: undefined, type: Function as PropType<(name: string) => Promise<void> | void>},
-    title: {default: 'Create Organization', type: String},
-  },
-  setup(props: BaseCreateOrganizationSetupProps, {slots}: {slots: any}): () => VNode | VNode[] {
-    const orgName: Ref<string> = ref('');
-    const isSubmitting: Ref<boolean> = ref(false);
-    const error: Ref<string | null> = ref<string | null>(null);
-
-    const handleSubmit = async (): Promise<void> => {
-      const name: string = orgName.value.trim();
-      if (!name) {
-        error.value = 'Organization name is required.';
-        return;
-      }
-
-      error.value = null;
-      isSubmitting.value = true;
-      try {
-        await props.onCreate?.(name);
-        orgName.value = '';
-      } catch (err: unknown) {
-        error.value = err instanceof Error ? err.message : 'Failed to create organization.';
-      } finally {
-        isSubmitting.value = false;
-      }
-    };
-
-    return (): any => {
-      if (slots.default) {
-        return slots.default({
-          error: error.value,
-          handleSubmit,
-          isSubmitting: isSubmitting.value,
-          orgName: orgName.value,
-          setOrgName: (v: string) => {
-            orgName.value = v;
-          },
-        });
-      }
-
-      return h(Card, {class: [cls(''), props.className].filter(Boolean).join(' ')}, () => [
-        h(Typography, {class: cls('__title'), variant: 'h6'}, () => props.title),
-        props.description
-          ? h(Typography, {class: cls('__description'), variant: 'body2'}, () => props.description)
-          : null,
-        error.value ? h(Alert, {class: cls('__error'), severity: 'error'}, () => error.value) : null,
-        h(TextField, {
-          class: cls('__input'),
-          label: 'Organization Name',
-          modelValue: orgName.value,
-          'onUpdate:modelValue': (v: string) => {
-            orgName.value = v;
-          },
-          placeholder: 'Enter organization name',
-        }),
-        h(
-          Button,
-          {
-            class: cls('__submit'),
-            color: 'primary',
-            disabled: isSubmitting.value,
-            loading: isSubmitting.value,
-            onClick: handleSubmit,
-            variant: 'solid',
-          },
-          () => 'Create',
-        ),
-      ]);
-    };
-  },
-});
-
-export default BaseCreateOrganization;
diff --git a/packages/vue/src/components/presentation/create-organization/CreateOrganization.css.ts b/packages/vue/src/components/presentation/create-organization/CreateOrganization.css.ts
deleted file mode 100644
index 3efb480..0000000
--- a/packages/vue/src/components/presentation/create-organization/CreateOrganization.css.ts
+++ /dev/null
@@ -1,67 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/**
- * Styles for the CreateOrganization presentation component.
- *
- * BEM block: `.thunderid-create-organization`
- *
- * The root element is a Card, whose padding is intentionally kept
- * as this is a full form panel.
- *
- * Elements:
- *   __title        – form heading (Typography h6)
- *   __description  – optional sub-heading (Typography body2)
- *   __error        – error Alert
- *   __input        – the org-name TextField
- *   __submit       – the submit Button
- */
-const CREATE_ORGANIZATION_CSS = `
-/* ============================================================
-   CreateOrganization
-   ============================================================ */
-
-.thunderid-create-organization {
-  display: flex;
-  flex-direction: column;
-  gap: calc(var(--thunder-spacing-unit) * 1.75);
-  max-width: 440px;
-  width: 100%;
-}
-
-/* Title & description --------------------------------------- */
-
-.thunderid-create-organization__description {
-  margin-top: calc(var(--thunder-spacing-unit) * -0.75);
-  color: var(--thunder-color-text-secondary);
-}
-
-/* Input ----------------------------------------------------- */
-
-.thunderid-create-organization__input {
-  width: 100%;
-}
-
-/* Submit ---------------------------------------------------- */
-
-.thunderid-create-organization__submit {
-  align-self: flex-start;
-}
-`;
-
-export default CREATE_ORGANIZATION_CSS;
diff --git a/packages/vue/src/components/presentation/create-organization/CreateOrganization.ts b/packages/vue/src/components/presentation/create-organization/CreateOrganization.ts
deleted file mode 100644
index dabd6d5..0000000
--- a/packages/vue/src/components/presentation/create-organization/CreateOrganization.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {withVendorCSSClassPrefix} from '@thunderid/browser';
-import {type Component, type VNode, defineComponent, h} from 'vue';
-import BaseCreateOrganization from './BaseCreateOrganization';
-import useOrganization from '../../../composables/useOrganization';
-
-interface CreateOrganizationSetupProps {
-  className: string;
-  description: string;
-  title: string;
-}
-
-/**
- * CreateOrganization — styled sub-organisation creation component.
- *
- * Retrieves createOrganization from context and delegates to BaseCreateOrganization.
- */
-const CreateOrganization: Component = defineComponent({
-  name: 'CreateOrganization',
-  props: {
-    className: {default: '', type: String},
-    description: {default: 'Create a new sub-organization.', type: String},
-    title: {default: 'Create Organization', type: String},
-  },
-  setup(props: CreateOrganizationSetupProps, {slots}: {slots: any}): () => VNode {
-    const {createOrganization} = useOrganization();
-
-    return (): VNode =>
-      h(
-        BaseCreateOrganization,
-        {
-          class: withVendorCSSClassPrefix('create-organization--styled'),
-          className: props.className,
-          description: props.description,
-          onCreate: createOrganization
-            ? async (name: string): Promise<void> => {
-                await createOrganization({description: '', name, parentId: '', type: 'TENANT'}, '');
-              }
-            : undefined,
-          title: props.title,
-        },
-        slots,
-      );
-  },
-});
-
-export default CreateOrganization;
diff --git a/packages/vue/src/components/presentation/organization-list/BaseOrganizationList.ts b/packages/vue/src/components/presentation/organization-list/BaseOrganizationList.ts
deleted file mode 100644
index 11235f2..0000000
--- a/packages/vue/src/components/presentation/organization-list/BaseOrganizationList.ts
+++ /dev/null
@@ -1,82 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {type Organization as IOrganization, withVendorCSSClassPrefix} from '@thunderid/browser';
-import {type Component, type PropType, type VNode, defineComponent, h} from 'vue';
-import {BuildingIcon} from '../../primitives/Icons';
-import Spinner from '../../primitives/Spinner';
-import Typography from '../../primitives/Typography';
-
-/**
- * BaseOrganizationList — unstyled list of organizations.
- */
-const BaseOrganizationList: Component = defineComponent({
-  name: 'BaseOrganizationList',
-  inheritAttrs: false,
-  props: {
-    className: {default: '', type: String},
-    isLoading: {default: false, type: Boolean},
-    onSelect: {default: undefined, type: Function as PropType<(org: IOrganization) => void>},
-    organizations: {default: () => [], type: Array as PropType<IOrganization[]>},
-  },
-  setup(
-    props: {
-      className: string;
-      isLoading: boolean;
-      onSelect?: (org: IOrganization) => void;
-      organizations: IOrganization[];
-    },
-    {slots}: {slots: any},
-  ): () => VNode | VNode[] | null {
-    return (): VNode | VNode[] | null => {
-      if (slots.default) {
-        return slots.default({isLoading: props.isLoading, organizations: props.organizations});
-      }
-
-      const prefix: typeof withVendorCSSClassPrefix = withVendorCSSClassPrefix;
-      const children: VNode[] = [];
-
-      if (props.isLoading) {
-        children.push(h('div', {class: prefix('organization-list__loading')}, [h(Spinner)]));
-      } else if (props.organizations.length === 0) {
-        children.push(
-          h(Typography, {class: prefix('organization-list__empty'), variant: 'body2'}, () => 'No organizations found'),
-        );
-      } else {
-        props.organizations.forEach((org: IOrganization) => {
-          children.push(
-            h(
-              'button',
-              {
-                class: prefix('organization-list__item'),
-                key: org.id,
-                onClick: () => props.onSelect?.(org),
-                type: 'button',
-              },
-              [h(BuildingIcon, {size: 16}), h(Typography, {variant: 'body1'}, () => org.name || org.id)],
-            ),
-          );
-        });
-      }
-
-      return h('div', {class: [prefix('organization-list'), props.className].filter(Boolean).join(' ')}, children);
-    };
-  },
-});
-
-export default BaseOrganizationList;
diff --git a/packages/vue/src/components/presentation/organization-list/OrganizationList.css.ts b/packages/vue/src/components/presentation/organization-list/OrganizationList.css.ts
deleted file mode 100644
index aa8c405..0000000
--- a/packages/vue/src/components/presentation/organization-list/OrganizationList.css.ts
+++ /dev/null
@@ -1,89 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/**
- * Styles for the OrganizationList presentation component.
- *
- * BEM block: `.thunderid-organization-list`
- *
- * The root element is a plain `div`. There is no Card wrapper here,
- * so this file provides the full layout including border and spacing.
- *
- * Elements:
- *   __loading  – loading state container (centred Spinner)
- *   __empty    – empty state message (Typography body2)
- *   __item     – each selectable organization row button
- */
-const ORGANIZATION_LIST_CSS = `
-/* ============================================================
-   OrganizationList
-   ============================================================ */
-
-.thunderid-organization-list {
-  display: flex;
-  flex-direction: column;
-  gap: calc(var(--thunder-spacing-unit) * 0.5);
-  font-family: var(--thunder-typography-fontFamily);
-}
-
-/* Loading / Empty ------------------------------------------- */
-
-.thunderid-organization-list__loading,
-.thunderid-organization-list__empty {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: calc(var(--thunder-spacing-unit) * 3);
-  color: var(--thunder-color-text-secondary);
-}
-
-/* Items ----------------------------------------------------- */
-
-.thunderid-organization-list__item {
-  display: flex;
-  align-items: center;
-  gap: calc(var(--thunder-spacing-unit) * 1.25);
-  width: 100%;
-  padding: calc(var(--thunder-spacing-unit) * 1.25) calc(var(--thunder-spacing-unit) * 1.5);
-  background: var(--thunder-color-background-surface);
-  border: 1px solid var(--thunder-color-border);
-  border-radius: var(--thunder-border-radius-small);
-  cursor: pointer;
-  text-align: left;
-  font-family: var(--thunder-typography-fontFamily);
-  font-size: var(--thunder-typography-fontSize-md);
-  color: var(--thunder-color-text-primary);
-  transition:
-    background-color var(--thunder-transition-fast),
-    border-color var(--thunder-transition-fast),
-    box-shadow var(--thunder-transition-fast);
-  box-sizing: border-box;
-}
-
-.thunderid-organization-list__item:hover {
-  background-color: var(--thunder-color-primary-light);
-  border-color: var(--thunder-color-primary-main);
-}
-
-.thunderid-organization-list__item:focus-visible {
-  outline: none;
-  box-shadow: 0 0 0 var(--thunder-focus-ring-width) var(--thunder-focus-ring-color);
-}
-`;
-
-export default ORGANIZATION_LIST_CSS;
diff --git a/packages/vue/src/components/presentation/organization-list/OrganizationList.ts b/packages/vue/src/components/presentation/organization-list/OrganizationList.ts
deleted file mode 100644
index 420bec4..0000000
--- a/packages/vue/src/components/presentation/organization-list/OrganizationList.ts
+++ /dev/null
@@ -1,61 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {type Organization as IOrganization, withVendorCSSClassPrefix} from '@thunderid/browser';
-import {type Component, type VNode, defineComponent, h} from 'vue';
-import BaseOrganizationList from './BaseOrganizationList';
-import useOrganization from '../../../composables/useOrganization';
-
-/**
- * OrganizationList — styled organization list component.
- *
- * Retrieves organization list from context and delegates to BaseOrganizationList.
- */
-const OrganizationList: Component = defineComponent({
-  name: 'OrganizationList',
-  props: {
-    className: {
-      default: '',
-      type: String,
-    },
-  },
-  emits: ['select'],
-  setup(props: {className: string}, {slots, emit}: {emit: any; slots: any}): () => VNode | VNode[] | null {
-    const {myOrganizations, isLoading, switchOrganization} = useOrganization();
-
-    const handleSelect = async (org: IOrganization): Promise<void> => {
-      emit('select', org);
-      await switchOrganization(org);
-    };
-
-    return (): VNode | VNode[] | null =>
-      h(
-        BaseOrganizationList,
-        {
-          class: withVendorCSSClassPrefix('organization-list--styled'),
-          className: props.className,
-          isLoading: isLoading.value,
-          onSelect: handleSelect,
-          organizations: myOrganizations.value,
-        },
-        slots,
-      );
-  },
-});
-
-export default OrganizationList;
diff --git a/packages/vue/src/components/presentation/organization-profile/BaseOrganizationProfile.ts b/packages/vue/src/components/presentation/organization-profile/BaseOrganizationProfile.ts
deleted file mode 100644
index 391e814..0000000
--- a/packages/vue/src/components/presentation/organization-profile/BaseOrganizationProfile.ts
+++ /dev/null
@@ -1,412 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {withVendorCSSClassPrefix} from '@thunderid/browser';
-import type {Organization} from '@thunderid/browser';
-import {type Component, type PropType, type Ref, type VNode, defineComponent, h, ref} from 'vue';
-import Button from '../../primitives/Button';
-import Card from '../../primitives/Card';
-import Divider from '../../primitives/Divider';
-import {PencilIcon} from '../../primitives/Icons';
-import TextField from '../../primitives/TextField';
-import Typography from '../../primitives/Typography';
-
-const ORG_AVATAR_GRADIENTS: string[] = [
-  'linear-gradient(135deg, #22d3ee 0%, #2dd4bf 100%)',
-  'linear-gradient(135deg, #34d399 0%, #059669 100%)',
-  'linear-gradient(135deg, #60a5fa 0%, #818cf8 100%)',
-  'linear-gradient(135deg, #f472b6 0%, #c084fc 100%)',
-  'linear-gradient(135deg, #fb923c 0%, #fbbf24 100%)',
-  'linear-gradient(135deg, #a78bfa 0%, #7c3aed 100%)',
-  'linear-gradient(135deg, #4ade80 0%, #22d3ee 100%)',
-  'linear-gradient(135deg, #f87171 0%, #fb923c 100%)',
-];
-
-const getOrgAvatarGradient = (seed: string): string => {
-  if (!seed) return ORG_AVATAR_GRADIENTS[0];
-  let hash = 0;
-  for (let i = 0; i < seed.length; i += 1) {
-    hash = Math.imul(31, hash) + seed.charCodeAt(i);
-  }
-  return ORG_AVATAR_GRADIENTS[Math.abs(hash) % ORG_AVATAR_GRADIENTS.length];
-};
-
-const getOrgInitials = (name: string): string => {
-  if (!name) return '?';
-  const parts: string[] = name.trim().split(/\s+/).filter(Boolean);
-  if (parts.length >= 2) return (parts[0].charAt(0) + parts[1].charAt(0)).toUpperCase();
-  return name.charAt(0).toUpperCase();
-};
-
-const formatDate = (dateStr: string): string => {
-  try {
-    return new Date(dateStr).toLocaleDateString('en-US', {day: 'numeric', month: 'long', year: 'numeric'});
-  } catch {
-    return dateStr;
-  }
-};
-
-/**
- * BaseOrganizationProfile — unstyled organization details view/edit component.
- *
- * Renders a profile card with avatar, org name, handle, and two-column field rows
- * for Organization ID, Name, Description, Created Date, and Last Modified Date.
- */
-const BaseOrganizationProfile: Component = defineComponent({
-  name: 'BaseOrganizationProfile',
-  props: {
-    className: {default: '', type: String},
-    editable: {default: false, type: Boolean},
-    onUpdate: {
-      default: undefined,
-      type: Function as PropType<(payload: Record<string, unknown>) => Promise<void>>,
-    },
-    organization: {default: null, type: Object as PropType<Organization | null>},
-    title: {default: 'Organization Profile', type: String},
-  },
-  setup(
-    props: {
-      className: string;
-      editable: boolean;
-      onUpdate?: (payload: Record<string, unknown>) => Promise<void>;
-      organization: Organization | null;
-      title: string;
-    },
-    {slots}: {slots: any},
-  ): () => VNode | VNode[] | null {
-    const editingName: Ref<boolean> = ref(false);
-    const editingDescription: Ref<boolean> = ref(false);
-    const editedName: Ref<string> = ref('');
-    const editedDescription: Ref<string> = ref('');
-
-    return (): VNode | VNode[] | null => {
-      if (slots.default) {
-        return slots.default({organization: props.organization});
-      }
-
-      if (!props.organization) {
-        return slots.fallback?.() ?? null;
-      }
-
-      const prefix: typeof withVendorCSSClassPrefix = withVendorCSSClassPrefix;
-      const org: Record<string, unknown> = props.organization as unknown as Record<string, unknown>;
-      const orgName = String(org['name'] || org['displayName'] || '');
-      const orgHandle = String(org['orgHandle'] || '');
-      const orgId = String(org['id'] || '');
-      const orgDescription: string | null = org['description'] != null ? String(org['description']) : null;
-      const createdDate: string | null = org['created'] ? formatDate(String(org['created'])) : null;
-      const lastModifiedDate: string | null = org['lastModified'] ? formatDate(String(org['lastModified'])) : null;
-      const initials: string = getOrgInitials(orgName);
-      const avatarGradient: string = getOrgAvatarGradient(orgId || orgName);
-
-      const children: VNode[] = [];
-
-      // Header: title
-      children.push(
-        h('div', {class: prefix('organization-profile__header')}, [
-          h(Typography, {class: prefix('organization-profile__title'), variant: 'h5'}, () => props.title),
-        ]),
-      );
-
-      children.push(h(Divider, {class: prefix('organization-profile__header-divider')}));
-
-      // Avatar + org name + handle
-      children.push(
-        h('div', {class: prefix('organization-profile__identity')}, [
-          h(
-            'div',
-            {
-              class: prefix('organization-profile__avatar'),
-              style: {background: avatarGradient},
-            },
-            [h('span', {class: prefix('organization-profile__avatar-initials')}, initials)],
-          ),
-          h(Typography, {class: prefix('organization-profile__org-name'), variant: 'h5'}, () => orgName),
-          orgHandle
-            ? h(
-                Typography,
-                {class: prefix('organization-profile__org-handle'), variant: 'body2'},
-                () => `@${orgHandle}`,
-              )
-            : null,
-        ]),
-      );
-
-      children.push(h(Divider, {class: prefix('organization-profile__identity-divider')}));
-
-      // Field rows
-      const fieldRows: VNode[] = [];
-
-      // Organization ID (readonly)
-      fieldRows.push(
-        h('div', {class: prefix('organization-profile__field'), key: 'id'}, [
-          h('div', {class: prefix('organization-profile__field-label-col')}, [
-            h(
-              Typography,
-              {class: prefix('organization-profile__field-label'), variant: 'body2'},
-              () => 'Organization ID',
-            ),
-          ]),
-          h('div', {class: prefix('organization-profile__field-value-col')}, [
-            h('div', {class: prefix('organization-profile__field-display')}, [
-              orgId
-                ? h(
-                    Typography,
-                    {
-                      class: [
-                        prefix('organization-profile__field-value'),
-                        prefix('organization-profile__field-value--id'),
-                      ].join(' '),
-                      variant: 'body1',
-                    },
-                    () => orgId,
-                  )
-                : h('span', {class: prefix('organization-profile__field-placeholder')}, 'Not available'),
-            ]),
-          ]),
-        ]),
-      );
-
-      // Organization Name (editable)
-      fieldRows.push(
-        h('div', {class: prefix('organization-profile__field'), key: 'name'}, [
-          h('div', {class: prefix('organization-profile__field-label-col')}, [
-            h(
-              Typography,
-              {class: prefix('organization-profile__field-label'), variant: 'body2'},
-              () => 'Organization Name',
-            ),
-          ]),
-          h('div', {class: prefix('organization-profile__field-value-col')}, [
-            editingName.value
-              ? h('div', {class: prefix('organization-profile__field-edit')}, [
-                  h(TextField, {
-                    modelValue: editedName.value,
-                    'onUpdate:modelValue': (v: string) => {
-                      editedName.value = v;
-                    },
-                  }),
-                  h('div', {class: prefix('organization-profile__field-edit-actions')}, [
-                    h(
-                      Button,
-                      {
-                        onClick: async () => {
-                          await props.onUpdate?.({name: editedName.value});
-                          editingName.value = false;
-                        },
-                        size: 'small' as const,
-                        variant: 'solid' as const,
-                      },
-                      () => 'Save',
-                    ),
-                    h(
-                      Button,
-                      {
-                        onClick: () => {
-                          editingName.value = false;
-                        },
-                        size: 'small' as const,
-                        variant: 'text' as const,
-                      },
-                      () => 'Cancel',
-                    ),
-                  ]),
-                ])
-              : h('div', {class: prefix('organization-profile__field-display')}, [
-                  h(Typography, {class: prefix('organization-profile__field-value'), variant: 'body1'}, () => orgName),
-                  props.editable
-                    ? h(
-                        'button',
-                        {
-                          'aria-label': 'Edit Organization Name',
-                          class: prefix('organization-profile__field-edit-btn'),
-                          onClick: () => {
-                            editedName.value = orgName;
-                            editingName.value = true;
-                          },
-                          type: 'button',
-                        },
-                        [h(PencilIcon)],
-                      )
-                    : null,
-                ]),
-          ]),
-        ]),
-      );
-
-      // Organization Description (editable)
-      fieldRows.push(
-        h('div', {class: prefix('organization-profile__field'), key: 'description'}, [
-          h('div', {class: prefix('organization-profile__field-label-col')}, [
-            h(
-              Typography,
-              {class: prefix('organization-profile__field-label'), variant: 'body2'},
-              () => 'Organization Description',
-            ),
-          ]),
-          h('div', {class: prefix('organization-profile__field-value-col')}, [
-            editingDescription.value
-              ? h('div', {class: prefix('organization-profile__field-edit')}, [
-                  h(TextField, {
-                    modelValue: editedDescription.value,
-                    'onUpdate:modelValue': (v: string) => {
-                      editedDescription.value = v;
-                    },
-                  }),
-                  h('div', {class: prefix('organization-profile__field-edit-actions')}, [
-                    h(
-                      Button,
-                      {
-                        onClick: async () => {
-                          await props.onUpdate?.({description: editedDescription.value});
-                          editingDescription.value = false;
-                        },
-                        size: 'small' as const,
-                        variant: 'solid' as const,
-                      },
-                      () => 'Save',
-                    ),
-                    h(
-                      Button,
-                      {
-                        onClick: () => {
-                          editingDescription.value = false;
-                        },
-                        size: 'small' as const,
-                        variant: 'text' as const,
-                      },
-                      () => 'Cancel',
-                    ),
-                  ]),
-                ])
-              : h('div', {class: prefix('organization-profile__field-display')}, [
-                  orgDescription != null
-                    ? h(
-                        Typography,
-                        {class: prefix('organization-profile__field-value'), variant: 'body1'},
-                        () => orgDescription,
-                      )
-                    : h(
-                        'span',
-                        {
-                          class: prefix('organization-profile__field-placeholder'),
-                          onClick: props.editable
-                            ? (): void => {
-                                editedDescription.value = '';
-                                editingDescription.value = true;
-                              }
-                            : undefined,
-                        },
-                        'Enter organization description',
-                      ),
-                  props.editable
-                    ? h(
-                        'button',
-                        {
-                          'aria-label': 'Edit Organization Description',
-                          class: prefix('organization-profile__field-edit-btn'),
-                          onClick: () => {
-                            editedDescription.value = orgDescription ?? '';
-                            editingDescription.value = true;
-                          },
-                          type: 'button',
-                        },
-                        [h(PencilIcon)],
-                      )
-                    : null,
-                ]),
-          ]),
-        ]),
-      );
-
-      // Created Date (readonly)
-      fieldRows.push(
-        h('div', {class: prefix('organization-profile__field'), key: 'created'}, [
-          h('div', {class: prefix('organization-profile__field-label-col')}, [
-            h(Typography, {class: prefix('organization-profile__field-label'), variant: 'body2'}, () => 'Created Date'),
-          ]),
-          h('div', {class: prefix('organization-profile__field-value-col')}, [
-            h('div', {class: prefix('organization-profile__field-display')}, [
-              createdDate
-                ? h(
-                    Typography,
-                    {class: prefix('organization-profile__field-value'), variant: 'body1'},
-                    () => createdDate,
-                  )
-                : h('span', {class: prefix('organization-profile__field-placeholder')}, 'Not available'),
-            ]),
-          ]),
-        ]),
-      );
-
-      // Last Modified Date (readonly)
-      fieldRows.push(
-        h('div', {class: prefix('organization-profile__field'), key: 'lastModified'}, [
-          h('div', {class: prefix('organization-profile__field-label-col')}, [
-            h(
-              Typography,
-              {class: prefix('organization-profile__field-label'), variant: 'body2'},
-              () => 'Last Modified Date',
-            ),
-          ]),
-          h('div', {class: prefix('organization-profile__field-value-col')}, [
-            h('div', {class: prefix('organization-profile__field-display')}, [
-              lastModifiedDate
-                ? h(
-                    Typography,
-                    {class: prefix('organization-profile__field-value'), variant: 'body1'},
-                    () => lastModifiedDate,
-                  )
-                : h('span', {class: prefix('organization-profile__field-placeholder')}, 'Not available'),
-            ]),
-          ]),
-        ]),
-      );
-
-      // Organization Handle (readonly)
-      fieldRows.push(
-        h('div', {class: prefix('organization-profile__field'), key: 'orgHandle'}, [
-          h('div', {class: prefix('organization-profile__field-label-col')}, [
-            h(
-              Typography,
-              {class: prefix('organization-profile__field-label'), variant: 'body2'},
-              () => 'Organization Handle',
-            ),
-          ]),
-          h('div', {class: prefix('organization-profile__field-value-col')}, [
-            h('div', {class: prefix('organization-profile__field-display')}, [
-              orgHandle
-                ? h(Typography, {class: prefix('organization-profile__field-value'), variant: 'body1'}, () => orgHandle)
-                : h('span', {class: prefix('organization-profile__field-placeholder')}, 'Not available'),
-            ]),
-          ]),
-        ]),
-      );
-
-      children.push(h('div', {class: prefix('organization-profile__fields')}, fieldRows));
-
-      return h(
-        Card,
-        {class: [prefix('organization-profile'), props.className].filter(Boolean).join(' ')},
-        () => children,
-      );
-    };
-  },
-});
-
-export default BaseOrganizationProfile;
diff --git a/packages/vue/src/components/presentation/organization-profile/OrganizationProfile.css.ts b/packages/vue/src/components/presentation/organization-profile/OrganizationProfile.css.ts
deleted file mode 100644
index b4a4b10..0000000
--- a/packages/vue/src/components/presentation/organization-profile/OrganizationProfile.css.ts
+++ /dev/null
@@ -1,219 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/**
- * Styles for the OrganizationProfile presentation component.
- *
- * BEM block: `.thunderid-organization-profile`
- */
-const ORGANIZATION_PROFILE_CSS = `
-/* ============================================================
-   OrganizationProfile
-   ============================================================ */
-
-.thunderid-organization-profile {
-  display: flex;
-  flex-direction: column;
-  min-width: 320px;
-  padding: 0;
-  overflow: hidden;
-}
-
-/* Header: title + divider ------------------------------------ */
-
-.thunderid-organization-profile__header {
-  padding: calc(var(--thunder-spacing-unit) * 2) calc(var(--thunder-spacing-unit) * 2.5);
-  padding-bottom: calc(var(--thunder-spacing-unit) * 1.5);
-}
-
-.thunderid-organization-profile__title {
-  margin: 0;
-}
-
-.thunderid-organization-profile__header-divider {
-  margin: 0;
-}
-
-/* Identity: avatar + org name + handle ----------------------- */
-
-.thunderid-organization-profile__identity {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding: calc(var(--thunder-spacing-unit) * 2) 0 calc(var(--thunder-spacing-unit) * 1.5);
-  gap: calc(var(--thunder-spacing-unit) * 0.5);
-}
-
-.thunderid-organization-profile__avatar {
-  width: var(--thunder-avatar-size);
-  height: var(--thunder-avatar-size);
-  border-radius: 50%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-  margin-bottom: calc(var(--thunder-spacing-unit) * 0.375);
-}
-
-.thunderid-organization-profile__avatar-initials {
-  color: #ffffff;
-  font-size: var(--thunder-avatar-fontSize);
-  font-weight: 600;
-  line-height: 1;
-  letter-spacing: 0.02em;
-  pointer-events: none;
-  user-select: none;
-}
-
-.thunderid-organization-profile__org-name {
-  margin: 0;
-  text-align: center;
-}
-
-.thunderid-organization-profile__org-handle {
-  color: var(--thunder-color-text-secondary);
-  text-align: center;
-}
-
-.thunderid-organization-profile__identity-divider {
-  margin: 0;
-}
-
-/* Fields ---------------------------------------------------- */
-
-.thunderid-organization-profile__fields {
-  display: flex;
-  flex-direction: column;
-}
-
-.thunderid-organization-profile__field {
-  display: grid;
-  grid-template-columns: 36% 64%;
-  align-items: center;
-  padding: calc(var(--thunder-spacing-unit) * 1.25) calc(var(--thunder-spacing-unit) * 2.5);
-  gap: calc(var(--thunder-spacing-unit) * 0.75);
-  box-sizing: border-box;
-  transition: background-color var(--thunder-transition-fast);
-}
-
-.thunderid-organization-profile__field:hover {
-  background-color: var(--thunder-color-action-hover);
-}
-
-.thunderid-organization-profile__field + .thunderid-organization-profile__field {
-  border-top: 1px solid var(--thunder-color-border);
-}
-
-.thunderid-organization-profile__field-label-col {
-  /* label column */
-}
-
-.thunderid-organization-profile__field-label {
-  color: var(--thunder-color-text-secondary);
-  font-size: var(--thunder-typography-fontSize-sm);
-}
-
-.thunderid-organization-profile__field-value-col {
-  /* value column */
-}
-
-.thunderid-organization-profile__field-display {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: calc(var(--thunder-spacing-unit) * 0.5);
-  min-height: 1.5rem;
-}
-
-.thunderid-organization-profile__field-value {
-  color: var(--thunder-color-text-primary);
-  word-break: break-word;
-  flex: 1;
-  font-size: var(--thunder-typography-fontSize-sm);
-}
-
-.thunderid-organization-profile__field-value--id {
-  font-size: calc(var(--thunder-typography-fontSize-sm) * 0.9);
-  color: var(--thunder-color-text-secondary);
-  font-family: monospace;
-  word-break: break-all;
-}
-
-.thunderid-organization-profile__field-placeholder {
-  color: var(--thunder-color-primary-main);
-  font-style: italic;
-  font-size: var(--thunder-typography-fontSize-sm);
-  flex: 1;
-  cursor: pointer;
-  text-decoration: underline;
-  text-decoration-style: dotted;
-  text-underline-offset: 2px;
-}
-
-/* Edit button (pencil icon) --------------------------------- */
-
-.thunderid-organization-profile__field-edit-btn {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  background: none;
-  border: none;
-  cursor: pointer;
-  color: var(--thunder-color-text-secondary);
-  flex-shrink: 0;
-  padding: calc(var(--thunder-spacing-unit) * 0.375);
-  border-radius: var(--thunder-border-radius-small);
-  transition:
-    color var(--thunder-transition-fast),
-    background-color var(--thunder-transition-fast),
-    opacity var(--thunder-transition-fast);
-  opacity: 0;
-  line-height: 0;
-}
-
-.thunderid-organization-profile__field:hover .thunderid-organization-profile__field-edit-btn {
-  opacity: 1;
-}
-
-.thunderid-organization-profile__field-edit-btn:hover {
-  color: var(--thunder-color-primary-main);
-  background-color: var(--thunder-color-primary-light);
-}
-
-.thunderid-organization-profile__field-edit-btn:focus-visible {
-  opacity: 1;
-  outline: none;
-  box-shadow: 0 0 0 var(--thunder-focus-ring-width) var(--thunder-focus-ring-color);
-}
-
-/* Edit mode ------------------------------------------------- */
-
-.thunderid-organization-profile__field-edit {
-  display: flex;
-  flex-direction: column;
-  gap: calc(var(--thunder-spacing-unit) * 0.75);
-}
-
-.thunderid-organization-profile__field-edit-actions {
-  display: flex;
-  align-items: center;
-  gap: calc(var(--thunder-spacing-unit) * 0.75);
-}
-`;
-
-export default ORGANIZATION_PROFILE_CSS;
diff --git a/packages/vue/src/components/presentation/organization-profile/OrganizationProfile.ts b/packages/vue/src/components/presentation/organization-profile/OrganizationProfile.ts
deleted file mode 100644
index 50803b1..0000000
--- a/packages/vue/src/components/presentation/organization-profile/OrganizationProfile.ts
+++ /dev/null
@@ -1,67 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {withVendorCSSClassPrefix} from '@thunderid/browser';
-import {type Component, type PropType, type VNode, defineComponent, h} from 'vue';
-import BaseOrganizationProfile from './BaseOrganizationProfile';
-import useOrganization from '../../../composables/useOrganization';
-
-/**
- * OrganizationProfile — styled organisation details component.
- *
- * Retrieves current organization from context and delegates to BaseOrganizationProfile.
- */
-const OrganizationProfile: Component = defineComponent({
-  name: 'OrganizationProfile',
-  props: {
-    className: {default: '', type: String},
-    editable: {default: false, type: Boolean},
-    onUpdate: {
-      default: undefined,
-      type: Function as PropType<(payload: Record<string, unknown>) => Promise<void>>,
-    },
-    title: {default: 'Organization Profile', type: String},
-  },
-  setup(
-    props: {
-      className: string;
-      editable: boolean;
-      onUpdate?: (payload: Record<string, unknown>) => Promise<void>;
-      title: string;
-    },
-    {slots}: {slots: any},
-  ): () => VNode | VNode[] | null {
-    const {currentOrganization} = useOrganization();
-
-    return (): VNode | VNode[] | null =>
-      h(
-        BaseOrganizationProfile,
-        {
-          class: withVendorCSSClassPrefix('organization-profile--styled'),
-          className: props.className,
-          editable: props.editable,
-          onUpdate: props.onUpdate,
-          organization: currentOrganization?.value ?? null,
-          title: props.title,
-        },
-        slots,
-      );
-  },
-});
-
-export default OrganizationProfile;
diff --git a/packages/vue/src/components/presentation/organization-switcher/BaseOrganizationSwitcher.ts b/packages/vue/src/components/presentation/organization-switcher/BaseOrganizationSwitcher.ts
deleted file mode 100644
index 68a1f5b..0000000
--- a/packages/vue/src/components/presentation/organization-switcher/BaseOrganizationSwitcher.ts
+++ /dev/null
@@ -1,131 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {withVendorCSSClassPrefix} from '@thunderid/browser';
-import type {Organization} from '@thunderid/browser';
-import {type Component, type PropType, type Ref, type VNode, defineComponent, h, ref} from 'vue';
-import Card from '../../primitives/Card';
-import {BuildingIcon, ChevronDownIcon} from '../../primitives/Icons';
-import Spinner from '../../primitives/Spinner';
-import Typography from '../../primitives/Typography';
-
-const cls = (name: string): string => withVendorCSSClassPrefix(`organization-switcher${name}`);
-
-/**
- * BaseOrganizationSwitcher — unstyled organisation dropdown switcher.
- *
- * Shows the current organization name and a dropdown list to switch.
- */
-const BaseOrganizationSwitcher: Component = defineComponent({
-  name: 'BaseOrganizationSwitcher',
-  inheritAttrs: false,
-  props: {
-    className: {default: '', type: String},
-    currentOrganization: {default: null, type: Object as PropType<Organization | null>},
-    isLoading: {default: false, type: Boolean},
-    onSwitch: {default: undefined, type: Function as PropType<(org: Organization) => void>},
-    organizations: {default: () => [], type: Array as PropType<Organization[]>},
-  },
-  setup(
-    props: {
-      className: string;
-      currentOrganization: Organization | null;
-      isLoading: boolean;
-      onSwitch?: (org: Organization) => void;
-      organizations: Organization[];
-    },
-    {slots}: {slots: any},
-  ): () => VNode | VNode[] | null {
-    const isOpen: Ref<boolean> = ref(false);
-
-    const toggle = (): void => {
-      isOpen.value = !isOpen.value;
-    };
-
-    const handleSelect = (org: Organization): void => {
-      isOpen.value = false;
-      props.onSwitch?.(org);
-    };
-
-    return (): VNode | VNode[] | null => {
-      if (slots.default) {
-        return slots.default({
-          currentOrganization: props.currentOrganization,
-          handleSelect,
-          isLoading: props.isLoading,
-          isOpen: isOpen.value,
-          organizations: props.organizations,
-          toggle,
-        });
-      }
-
-      const currentName: string = props.currentOrganization?.name ?? 'No Organization';
-
-      const triggerButton: VNode = h(
-        'button',
-        {
-          'aria-expanded': isOpen.value,
-          'aria-haspopup': 'listbox',
-          class: cls('__trigger'),
-          onClick: toggle,
-          type: 'button',
-        },
-        [
-          h(BuildingIcon, {size: 16}),
-          h(Typography, {class: cls('__trigger-label'), variant: 'body2'}, () => currentName),
-          h(ChevronDownIcon, {size: 12}),
-        ],
-      );
-
-      const dropdownChildren: VNode[] = [];
-
-      if (props.isLoading) {
-        dropdownChildren.push(h('div', {class: cls('__loading')}, [h(Spinner, {size: 'small'})]));
-      } else if (props.organizations.length === 0) {
-        dropdownChildren.push(
-          h(Typography, {class: cls('__empty'), variant: 'body2'}, () => 'No organizations available'),
-        );
-      } else {
-        props.organizations.forEach((org: Organization) => {
-          const isActive: boolean = org.id === props.currentOrganization?.id;
-          dropdownChildren.push(
-            h(
-              'button',
-              {
-                'aria-selected': isActive,
-                class: [cls('__item'), isActive ? cls('__item--active') : ''],
-                onClick: () => handleSelect(org),
-                role: 'option',
-                type: 'button',
-              },
-              [h(BuildingIcon, {size: 14}), h(Typography, {variant: 'body2'}, () => org.name)],
-            ),
-          );
-        });
-      }
-
-      const dropdown: VNode | null = isOpen.value
-        ? h('div', {class: cls('__dropdown'), role: 'listbox'}, dropdownChildren)
-        : null;
-
-      return h(Card, {class: [cls(''), props.className].filter(Boolean).join(' ')}, () => [triggerButton, dropdown]);
-    };
-  },
-});
-
-export default BaseOrganizationSwitcher;
diff --git a/packages/vue/src/components/presentation/organization-switcher/OrganizationSwitcher.css.ts b/packages/vue/src/components/presentation/organization-switcher/OrganizationSwitcher.css.ts
deleted file mode 100644
index 8206e9f..0000000
--- a/packages/vue/src/components/presentation/organization-switcher/OrganizationSwitcher.css.ts
+++ /dev/null
@@ -1,154 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-/**
- * Styles for the OrganizationSwitcher presentation component.
- *
- * BEM block: `.thunderid-organization-switcher`
- *
- * The root element is a Card (`.thunderid-card`), so we override its
- * default padding to let the trigger button fill the surface edge-to-edge,
- * and apply `position: relative` to anchor the absolute dropdown.
- *
- * Modifiers:  (none — state is controlled via isOpen in component logic)
- *
- * Elements:
- *   __trigger        – the clickable trigger button showing current org
- *   __trigger-label  – the org name Typography inside the trigger
- *   __dropdown       – the absolute-positioned dropdown listbox
- *   __loading        – loading state container (Spinner)
- *   __empty          – empty state message (Typography)
- *   __item           – each selectable organization row
- *   __item--active   – currently selected organization
- */
-const ORGANIZATION_SWITCHER_CSS = `
-/* ============================================================
-   OrganizationSwitcher
-   ============================================================ */
-
-/* Override Card's default padding so the trigger button fills the surface */
-.thunderid-organization-switcher.thunderid-card {
-  padding: 0;
-  position: relative;
-  display: inline-block;
-  min-width: 180px;
-}
-
-/* Trigger ---------------------------------------------------- */
-
-.thunderid-organization-switcher__trigger {
-  display: flex;
-  align-items: center;
-  gap: calc(var(--thunder-spacing-unit) * 0.75);
-  width: 100%;
-  padding: var(--thunder-dropdown-itemPaddingY) var(--thunder-dropdown-itemPaddingX);
-  background: none;
-  border: none;
-  cursor: pointer;
-  border-radius: var(--thunder-dropdown-borderRadius);
-  color: var(--thunder-color-text-primary);
-  font-family: var(--thunder-typography-fontFamily);
-  font-size: var(--thunder-typography-fontSize-md);
-  transition: background-color var(--thunder-transition-fast);
-  text-align: left;
-  box-sizing: border-box;
-}
-
-.thunderid-organization-switcher__trigger:hover {
-  background-color: var(--thunder-color-action-hover);
-}
-
-.thunderid-organization-switcher__trigger:focus-visible {
-  outline: none;
-  box-shadow: inset 0 0 0 var(--thunder-focus-ring-width) var(--thunder-focus-ring-color);
-  border-radius: var(--thunder-dropdown-borderRadius);
-}
-
-.thunderid-organization-switcher__trigger-label {
-  flex: 1;
-  text-align: left;
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-}
-
-/* Dropdown --------------------------------------------------- */
-
-.thunderid-organization-switcher__dropdown {
-  position: absolute;
-  top: calc(100% + calc(var(--thunder-spacing-unit) * 0.5));
-  left: 0;
-  right: 0;
-  z-index: 1000;
-  background-color: var(--thunder-color-background-surface);
-  border: 1px solid var(--thunder-color-border);
-  border-radius: var(--thunder-dropdown-borderRadius);
-  box-shadow: var(--thunder-dropdown-shadow);
-  overflow: hidden;
-  min-width: 160px;
-  display: flex;
-  flex-direction: column;
-  padding: calc(var(--thunder-spacing-unit) * 0.5) 0;
-}
-
-/* Loading / Empty states ------------------------------------ */
-
-.thunderid-organization-switcher__loading,
-.thunderid-organization-switcher__empty {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: calc(var(--thunder-spacing-unit) * 2);
-  color: var(--thunder-color-text-secondary);
-}
-
-/* Items ----------------------------------------------------- */
-
-.thunderid-organization-switcher__item {
-  display: flex;
-  align-items: center;
-  gap: calc(var(--thunder-spacing-unit) * 0.75);
-  width: 100%;
-  padding: var(--thunder-dropdown-itemPaddingY) var(--thunder-dropdown-itemPaddingX);
-  background: none;
-  border: none;
-  cursor: pointer;
-  text-align: left;
-  font-family: var(--thunder-typography-fontFamily);
-  font-size: var(--thunder-typography-fontSize-md);
-  color: var(--thunder-color-text-primary);
-  transition: background-color var(--thunder-transition-fast);
-  box-sizing: border-box;
-}
-
-.thunderid-organization-switcher__item:hover {
-  background-color: var(--thunder-color-action-hover);
-}
-
-.thunderid-organization-switcher__item--active {
-  background-color: var(--thunder-color-action-selected);
-  color: var(--thunder-color-primary-main);
-  font-weight: var(--thunder-typography-fontWeight-medium);
-}
-
-.thunderid-organization-switcher__item--active:hover {
-  background-color: var(--thunder-color-action-focus);
-}
-`;
-
-export default ORGANIZATION_SWITCHER_CSS;
diff --git a/packages/vue/src/components/presentation/organization-switcher/OrganizationSwitcher.ts b/packages/vue/src/components/presentation/organization-switcher/OrganizationSwitcher.ts
deleted file mode 100644
index ffcc891..0000000
--- a/packages/vue/src/components/presentation/organization-switcher/OrganizationSwitcher.ts
+++ /dev/null
@@ -1,53 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {withVendorCSSClassPrefix} from '@thunderid/browser';
-import {type Component, type VNode, defineComponent, h} from 'vue';
-import BaseOrganizationSwitcher from './BaseOrganizationSwitcher';
-import useOrganization from '../../../composables/useOrganization';
-
-/**
- * OrganizationSwitcher — styled organisation switcher component.
- *
- * Retrieves organisations from context and delegates to BaseOrganizationSwitcher.
- */
-const OrganizationSwitcher: Component = defineComponent({
-  name: 'OrganizationSwitcher',
-  props: {
-    className: {default: '', type: String},
-  },
-  setup(props: {className: string}, {slots}: {slots: any}): () => VNode | VNode[] | null {
-    const {currentOrganization, myOrganizations, isLoading, switchOrganization} = useOrganization();
-
-    return (): VNode | VNode[] | null =>
-      h(
-        BaseOrganizationSwitcher,
-        {
-          class: withVendorCSSClassPrefix('organization-switcher--styled'),
-          className: props.className,
-          currentOrganization: currentOrganization?.value ?? null,
-          isLoading: isLoading?.value ?? false,
-          onSwitch: switchOrganization,
-          organizations: myOrganizations?.value ?? [],
-        },
-        slots,
-      );
-  },
-});
-
-export default OrganizationSwitcher;
diff --git a/packages/vue/src/components/presentation/organization/Organization.ts b/packages/vue/src/components/presentation/organization/Organization.ts
deleted file mode 100644
index c75d147..0000000
--- a/packages/vue/src/components/presentation/organization/Organization.ts
+++ /dev/null
@@ -1,57 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {type Component, type VNode, defineComponent, h, Fragment} from 'vue';
-import useOrganization from '../../../composables/useOrganization';
-
-/**
- * Organization — presentation component that exposes the current organization via a scoped slot.
- *
- * Renders the `default` slot with `{ organization }` when a current organization is available,
- * or the `fallback` slot when none is set.
- *
- * @example
- * ```vue
- * <Organization>
- *   <template #default="{ organization }">
- *     <p>Current org: {{ organization.name }}</p>
- *   </template>
- *   <template #fallback>
- *     <p>No organization selected.</p>
- *   </template>
- * </Organization>
- * ```
- */
-const Organization: Component = defineComponent({
-  name: 'Organization',
-  setup(_props: Record<string, unknown>, {slots}: {slots: any}): () => VNode | VNode[] | null {
-    const {currentOrganization} = useOrganization();
-
-    return (): VNode | VNode[] | null => {
-      if (!currentOrganization?.value) {
-        const fallbackContent: VNode[] | undefined = slots.fallback?.();
-        return fallbackContent ? h(Fragment, {}, fallbackContent) : null;
-      }
-
-      const defaultContent: VNode[] | undefined = slots.default?.({organization: currentOrganization.value});
-      return defaultContent ? h(Fragment, {}, defaultContent) : null;
-    };
-  },
-});
-
-export default Organization;
diff --git a/packages/vue/src/composables/useOrganization.ts b/packages/vue/src/composables/useOrganization.ts
deleted file mode 100644
index cf503eb..0000000
--- a/packages/vue/src/composables/useOrganization.ts
+++ /dev/null
@@ -1,57 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {inject} from 'vue';
-import {ORGANIZATION_KEY} from '../keys';
-import type {OrganizationContextValue} from '../models/contexts';
-
-/**
- * Composable for accessing organization data and operations.
- *
- * Must be called inside a component that is a descendant of `<ThunderIDProvider>`.
- *
- * @returns {OrganizationContextValue} The organization context.
- * @throws {Error} If called outside of `<ThunderIDProvider>`.
- *
- * @example
- * ```vue
- * <script setup>
- * import { useOrganization } from '@thunderid/vue';
- *
- * const { myOrganizations, currentOrganization, switchOrganization } = useOrganization();
- *
- * async function handleSwitch(orgId: string) {
- *   await switchOrganization(orgId);
- * }
- * </script>
- * ```
- */
-const useOrganization = (): OrganizationContextValue => {
-  const context: unknown = inject(ORGANIZATION_KEY);
-
-  if (!context) {
-    throw new Error(
-      '[ThunderID] useOrganization() was called outside of <ThunderIDProvider>. ' +
-        'Make sure to install the ThunderIDPlugin or wrap your app with <ThunderIDProvider>.',
-    );
-  }
-
-  return context as OrganizationContextValue;
-};
-
-export default useOrganization;
diff --git a/packages/vue/src/index.ts b/packages/vue/src/index.ts
index ef7e1e5..a60fc75 100644
--- a/packages/vue/src/index.ts
+++ b/packages/vue/src/index.ts
@@ -27,7 +27,6 @@ export {default as ThunderIDProvider} from './providers/ThunderIDProvider';
 export {default as FlowMetaProvider} from './providers/FlowMetaProvider';
 export {default as FlowProvider} from './providers/FlowProvider';
 export {default as I18nProvider} from './providers/I18nProvider';
-export {default as OrganizationProvider} from './providers/OrganizationProvider';
 export {default as ThemeProvider} from './providers/ThemeProvider';
 export {default as UserProvider} from './providers/UserProvider';
 
@@ -36,7 +35,6 @@ export {default as useThunderID} from './composables/useThunderID';
 export {default as useFlow} from './composables/useFlow';
 export {default as useFlowMeta} from './composables/useFlowMeta';
 export {default as useI18n} from './composables/useI18n';
-export {default as useOrganization} from './composables/useOrganization';
 export {default as useTheme} from './composables/useTheme';
 export {default as useUser} from './composables/useUser';
 export {useOAuthCallback} from './composables/useOAuthCallback';
@@ -51,7 +49,6 @@ export {
   FLOW_KEY,
   FLOW_META_KEY,
   I18N_KEY,
-  ORGANIZATION_KEY,
   THEME_KEY,
   USER_KEY,
 } from './keys';
@@ -65,7 +62,6 @@ export type {
   FlowMetaContextValue,
   FlowStep,
   I18nContextValue,
-  OrganizationContextValue,
   ThemeContextValue,
   UserContextValue,
 } from './models/contexts';
@@ -130,7 +126,6 @@ export {default as Loading} from './components/control/Loading';
 
 // ── UI Components — Presentation ──
 export {default as User} from './components/presentation/user/User';
-export {default as Organization} from './components/presentation/organization/Organization';
 export {default as UserProfile} from './components/presentation/user-profile/UserProfile';
 export {default as BaseUserProfile} from './components/presentation/user-profile/BaseUserProfile';
 export {default as UserDropdown} from './components/presentation/user-dropdown/UserDropdown';
@@ -149,14 +144,6 @@ export type {
   BaseInviteUserRenderProps,
   BaseInviteUserProps,
 } from './components/presentation/invite-user/BaseInviteUser';
-export {default as OrganizationList} from './components/presentation/organization-list/OrganizationList';
-export {default as BaseOrganizationList} from './components/presentation/organization-list/BaseOrganizationList';
-export {default as OrganizationProfile} from './components/presentation/organization-profile/OrganizationProfile';
-export {default as BaseOrganizationProfile} from './components/presentation/organization-profile/BaseOrganizationProfile';
-export {default as OrganizationSwitcher} from './components/presentation/organization-switcher/OrganizationSwitcher';
-export {default as BaseOrganizationSwitcher} from './components/presentation/organization-switcher/BaseOrganizationSwitcher';
-export {default as CreateOrganization} from './components/presentation/create-organization/CreateOrganization';
-export {default as BaseCreateOrganization} from './components/presentation/create-organization/BaseCreateOrganization';
 export {default as LanguageSwitcher} from './components/presentation/language-switcher/LanguageSwitcher';
 export {default as BaseLanguageSwitcher} from './components/presentation/language-switcher/BaseLanguageSwitcher';
 
@@ -178,12 +165,10 @@ export type {HeadingExtractionResult, AuthComponentHeadingsResult} from './utils
 // ── Re-exports from @thunderid/browser ──
 export {
   FieldType,
-  type AllOrganizationsApiResponse,
   type Config,
   type HttpRequestConfig,
   type HttpResponse,
   type IdToken,
-  type Organization as IOrganization,
   type SignInOptions,
   type SignOutOptions,
   type SignUpOptions,
diff --git a/packages/vue/src/keys.ts b/packages/vue/src/keys.ts
index 406672f..b41b33b 100644
--- a/packages/vue/src/keys.ts
+++ b/packages/vue/src/keys.ts
@@ -22,7 +22,6 @@ import type {
   FlowContextValue,
   FlowMetaContextValue,
   I18nContextValue,
-  OrganizationContextValue,
   ThemeContextValue,
   UserContextValue,
 } from './models/contexts';
@@ -37,11 +36,6 @@ export const THUNDERID_KEY: InjectionKey<ThunderIDContext> = Symbol('thunderid')
  */
 export const USER_KEY: InjectionKey<UserContextValue> = Symbol('thunderid-user');
 
-/**
- * Injection key for the Organization context (list, current org, switching).
- */
-export const ORGANIZATION_KEY: InjectionKey<OrganizationContextValue> = Symbol('thunderid-organization');
-
 /**
  * Injection key for the Flow context (embedded flow UI state).
  */
diff --git a/packages/vue/src/models/contexts.ts b/packages/vue/src/models/contexts.ts
index 8f80fc5..838d7a5 100644
--- a/packages/vue/src/models/contexts.ts
+++ b/packages/vue/src/models/contexts.ts
@@ -17,13 +17,10 @@
  */
 
 import type {
-  AllOrganizationsApiResponse,
-  CreateOrganizationPayload,
   FlowMetadataResponse,
   HttpRequestConfig,
   HttpResponse,
   IdToken,
-  Organization,
   Schema,
   SignInOptions,
   StorageManager,
@@ -37,7 +34,6 @@ import type {
 } from '@thunderid/browser';
 import type {Ref} from 'vue';
 import type {ThunderIDVueConfig} from './config';
-import type ThunderIDVueClient from '../ThunderIDVueClient';
 
 /**
  * Shape of the core ThunderID context provided via `provide`/`inject`.
@@ -83,8 +79,6 @@ export interface ThunderIDContext {
   // ── FlowMeta (injected by useThunderID) ──
   /** Flow metadata from the FlowMeta context, or `null` while loading/unavailable. */
   meta?: Readonly<Ref<FlowMetadataResponse | null>>;
-  /** The current organization, or `null`. */
-  organization: Readonly<Ref<Organization | null>>;
   organizationHandle: string | undefined;
 
   // ── Lifecycle ──
@@ -105,9 +99,6 @@ export interface ThunderIDContext {
   signUpUrl: string | undefined;
   storage: ThunderIDVueConfig['storage'] | undefined;
 
-  // ── Organization ──
-  switchOrganization: ThunderIDVueClient['switchOrganization'];
-
   /** The current user object, or `null` if not signed in. */
   user: Readonly<Ref<any | null>>;
 }
@@ -139,32 +130,6 @@ export interface UserContextValue {
   ) => Promise<{data: {user: User}; error: string; success: boolean}>;
 }
 
-// ─────────────────────────────────────────────────────────────────────────────
-// Organization Context
-// ─────────────────────────────────────────────────────────────────────────────
-
-/**
- * Shape of the Organization context exposed by `useOrganization()`.
- */
-export interface OrganizationContextValue {
-  /** Optional function to create a new sub-organization. */
-  createOrganization?: (payload: CreateOrganizationPayload, sessionId: string) => Promise<Organization>;
-  /** The organization the user is currently operating in. */
-  currentOrganization: Readonly<Ref<Organization | null>>;
-  /** Last error message from an organization operation, if any. */
-  error: Readonly<Ref<string | null>>;
-  /** Fetch all organizations (paginated). */
-  getAllOrganizations: () => Promise<AllOrganizationsApiResponse>;
-  /** Whether an organization operation is in-flight. */
-  isLoading: Readonly<Ref<boolean>>;
-  /** The list of organizations the signed-in user is a member of. */
-  myOrganizations: Readonly<Ref<Organization[]>>;
-  /** Re-fetch the user's organization list from the server. */
-  revalidateMyOrganizations: () => Promise<Organization[]>;
-  /** Switch to the given organization (performs token exchange). */
-  switchOrganization: (organization: Organization) => Promise<void>;
-}
-
 // ─────────────────────────────────────────────────────────────────────────────
 // Flow Context
 // ─────────────────────────────────────────────────────────────────────────────
diff --git a/packages/vue/src/providers/OrganizationProvider.ts b/packages/vue/src/providers/OrganizationProvider.ts
deleted file mode 100644
index 6bedb26..0000000
--- a/packages/vue/src/providers/OrganizationProvider.ts
+++ /dev/null
@@ -1,148 +0,0 @@
-/**
- * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
- *
- * WSO2 LLC. licenses this file to you under the Apache License,
- * Version 2.0 (the "License"); you may not use this file except
- * in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import {
-  AllOrganizationsApiResponse,
-  ThunderIDRuntimeError,
-  CreateOrganizationPayload,
-  Organization,
-  TokenResponse,
-} from '@thunderid/browser';
-import {
-  computed,
-  defineComponent,
-  h,
-  provide,
-  readonly,
-  ref,
-  type Component,
-  type PropType,
-  type Ref,
-  type SetupContext,
-  type VNode,
-} from 'vue';
-import {ORGANIZATION_KEY} from '../keys';
-import type {OrganizationContextValue} from '../models/contexts';
-
-/**
- * OrganizationProvider manages organization state and makes it available
- * via `useOrganization()`.
- *
- * @internal — This provider is mounted automatically by `<ThunderIDProvider>`.
- */
-interface OrganizationProviderProps {
-  createOrganization: ((payload: CreateOrganizationPayload, sessionId: string) => Promise<Organization>) | undefined;
-  currentOrganization: Organization | null;
-  getAllOrganizations: (() => Promise<AllOrganizationsApiResponse>) | undefined;
-  myOrganizations: Organization[];
-  onError: ((error: string) => void) | undefined;
-  onOrganizationSwitch: ((organization: Organization) => Promise<TokenResponse | Response>) | undefined;
-  revalidateMyOrganizations: () => Promise<Organization[]>;
-}
-
-const OrganizationProvider: Component = defineComponent({
-  name: 'OrganizationProvider',
-  props: {
-    /** Optional factory for creating a new sub-organization. */
-    createOrganization: {
-      default: undefined,
-      type: Function as PropType<(payload: CreateOrganizationPayload, sessionId: string) => Promise<Organization>>,
-    },
-    /** The organization the user is currently operating in. */
-    currentOrganization: {default: null, type: Object as PropType<Organization | null>},
-    /** Callback to fetch all organizations (paginated). */
-    getAllOrganizations: {
-      default: undefined,
-      type: Function as PropType<() => Promise<AllOrganizationsApiResponse>>,
-    },
-    /** The list of organizations the user is a member of. */
-    myOrganizations: {default: () => [], type: Array as PropType<Organization[]>},
-    /** Callback when an error occurs. */
-    onError: {default: undefined, type: Function as PropType<(error: string) => void>},
-    /** Callback that performs the actual organization switch (token exchange). */
-    onOrganizationSwitch: {
-      default: undefined,
-      type: Function as PropType<(organization: Organization) => Promise<TokenResponse | Response>>,
-    },
-    /** Callback to re-fetch the user's organization list. */
-    revalidateMyOrganizations: {
-      default: async () => [],
-      type: Function as PropType<() => Promise<Organization[]>>,
-    },
-  },
-  setup(props: OrganizationProviderProps, {slots}: SetupContext): () => VNode {
-    const isLoading: Ref<boolean> = ref(false);
-    const error: Ref<string | null> = ref(null);
-
-    const switchOrganization = async (organization: Organization): Promise<void> => {
-      if (!props.onOrganizationSwitch) {
-        throw new ThunderIDRuntimeError(
-          'onOrganizationSwitch callback is required',
-          'OrganizationProvider-SwitchError-001',
-          'vue',
-          'The onOrganizationSwitch callback must be provided to handle organization switching.',
-        );
-      }
-
-      isLoading.value = true;
-      error.value = null;
-
-      try {
-        await props.onOrganizationSwitch(organization);
-      } catch (switchError: unknown) {
-        const errorMessage: string =
-          switchError instanceof Error ? switchError.message : 'Failed to switch organization';
-        error.value = errorMessage;
-        if (props.onError) {
-          props.onError(errorMessage);
-        }
-        throw switchError;
-      } finally {
-        isLoading.value = false;
-      }
-    };
-
-    const getAllOrgs = async (): Promise<AllOrganizationsApiResponse> => {
-      if (props.getAllOrganizations) {
-        return props.getAllOrganizations();
-      }
-      return {organizations: []};
-    };
-
-    // Use computed refs so context stays in sync when props change
-    const currentOrganizationRef: Ref<Organization | null> = computed(() => props.currentOrganization);
-    const myOrganizationsRef: Ref<Organization[]> = computed(() => props.myOrganizations);
-
-    const context: OrganizationContextValue = {
-      createOrganization: props.createOrganization,
-      currentOrganization: currentOrganizationRef as unknown as Readonly<Ref<Organization | null>>,
-      error: readonly(error),
-      getAllOrganizations: getAllOrgs,
-      isLoading: readonly(isLoading),
-      myOrganizations: myOrganizationsRef as unknown as Readonly<Ref<Organization[]>>,
-      revalidateMyOrganizations: props.revalidateMyOrganizations,
-      switchOrganization,
-    };
-
-    provide(ORGANIZATION_KEY, context);
-
-    return () => h('div', {style: 'display:contents'}, slots['default']?.());
-  },
-});
-
-export default OrganizationProvider;
diff --git a/packages/vue/src/providers/ThunderIDProvider.ts b/packages/vue/src/providers/ThunderIDProvider.ts
index 11dbd06..32f265a 100644
--- a/packages/vue/src/providers/ThunderIDProvider.ts
+++ b/packages/vue/src/providers/ThunderIDProvider.ts
@@ -17,7 +17,6 @@
  */
 
 import {
-  AllOrganizationsApiResponse,
   ThunderIDRuntimeError,
   extractUserClaimsFromIdToken,
   generateFlattenedUserProfile,
@@ -25,7 +24,6 @@ import {
   hasCalledForThisInstanceInUrl,
   HttpResponse,
   IdToken,
-  Organization,
   User,
   UserProfile,
   SignInOptions,
@@ -50,7 +48,6 @@ import {
 import FlowMetaProvider from './FlowMetaProvider';
 import FlowProvider from './FlowProvider';
 import I18nProvider from './I18nProvider';
-import OrganizationProvider from './OrganizationProvider';
 import ThemeProvider from './ThemeProvider';
 import UserProvider from './UserProvider';
 import {THUNDERID_KEY} from '../keys';
@@ -185,8 +182,6 @@ const ThunderIDProvider: Component = defineComponent({
     const isInitialized: Ref<boolean> = ref<boolean>(false);
     const isLoading: Ref<boolean> = ref<boolean>(true);
     const user: ShallowRef<any | null> = shallowRef<any | null>(null);
-    const currentOrganization: ShallowRef<Organization | null> = shallowRef<Organization | null>(null);
-    const myOrganizations: ShallowRef<Organization[]> = shallowRef<Organization[]>([]);
     const userProfile: ShallowRef<UserProfile | null> = shallowRef<UserProfile | null>(null);
     const resolvedBaseUrl: Ref<string> = ref<string>(props.baseUrl);
 
@@ -303,31 +298,6 @@ const ThunderIDProvider: Component = defineComponent({
       }
     }
 
-    // ── Switch Organization ──
-    async function switchOrganization(organization: Organization): Promise<TokenResponse | Response> {
-      try {
-        isUpdatingSession = true;
-        isLoading.value = true;
-        const response: TokenResponse | Response = await client.switchOrganization(organization);
-
-        if (await client.isSignedIn()) {
-          await updateSession();
-        }
-
-        return response;
-      } catch (error) {
-        throw new ThunderIDRuntimeError(
-          `Failed to switch organization: ${error instanceof Error ? error.message : String(JSON.stringify(error))}`,
-          'thunderid-switchOrganization-Error',
-          'vue',
-          'An error occurred while switching to the specified organization.',
-        );
-      } finally {
-        isUpdatingSession = false;
-        isLoading.value = client.isLoading();
-      }
-    }
-
     // ── Provide Context ──
     const context: ThunderIDContext = {
       afterSignInUrl: props.afterSignInUrl,
@@ -351,7 +321,6 @@ const ThunderIDProvider: Component = defineComponent({
       isInitialized,
       isLoading,
       isSignedIn,
-      organization: currentOrganization,
       organizationHandle: props.organizationHandle,
       reInitialize: async (config: any): Promise<boolean> => {
         const result: boolean = await client.reInitialize(config);
@@ -365,7 +334,6 @@ const ThunderIDProvider: Component = defineComponent({
       signUp,
       signUpUrl: props.signUpUrl,
       storage: props.storage as ThunderIDVueConfig['storage'],
-      switchOrganization,
       user,
     };
 
@@ -518,30 +486,7 @@ const ThunderIDProvider: Component = defineComponent({
                             },
                           },
                           {
-                            default: (): any =>
-                              h(
-                                OrganizationProvider,
-                                {
-                                  currentOrganization: currentOrganization.value,
-                                  getAllOrganizations: async (): Promise<AllOrganizationsApiResponse> =>
-                                    client.getAllOrganizations({baseUrl: resolvedBaseUrl.value}),
-                                  myOrganizations: myOrganizations.value,
-                                  onOrganizationSwitch: switchOrganization,
-                                  revalidateMyOrganizations: async (): Promise<Organization[]> => {
-                                    const baseUrl: string = resolvedBaseUrl.value;
-                                    try {
-                                      const orgs: Organization[] = await client.getMyOrganizations({baseUrl});
-                                      myOrganizations.value = orgs || [];
-                                      return orgs || [];
-                                    } catch {
-                                      return [];
-                                    }
-                                  },
-                                },
-                                {
-                                  default: (): any => slots['default']?.(),
-                                },
-                              ),
+                            default: (): any => slots['default']?.(),
                           },
                         ),
                     }),
diff --git a/packages/vue/src/styles/injectStyles.ts b/packages/vue/src/styles/injectStyles.ts
index b9b2ec4..b04d787 100644
--- a/packages/vue/src/styles/injectStyles.ts
+++ b/packages/vue/src/styles/injectStyles.ts
@@ -38,11 +38,7 @@ import ANIMATIONS_CSS from './animations.css';
 import DEFAULTS_CSS from './defaults.css';
 
 // Primitives
-import CREATE_ORGANIZATION_CSS from '../components/presentation/create-organization/CreateOrganization.css';
 import LANGUAGE_SWITCHER_CSS from '../components/presentation/language-switcher/LanguageSwitcher.css';
-import ORGANIZATION_LIST_CSS from '../components/presentation/organization-list/OrganizationList.css';
-import ORGANIZATION_PROFILE_CSS from '../components/presentation/organization-profile/OrganizationProfile.css';
-import ORGANIZATION_SWITCHER_CSS from '../components/presentation/organization-switcher/OrganizationSwitcher.css';
 import USER_DROPDOWN_CSS from '../components/presentation/user-dropdown/UserDropdown.css';
 import USER_PROFILE_CSS from '../components/presentation/user-profile/UserProfile.css';
 import ALERT_CSS from '../components/primitives/Alert/Alert.css';
@@ -89,10 +85,6 @@ const STYLES: string = [
   LOGO_CSS,
   SPINNER_CSS,
   // Presentation
-  ORGANIZATION_LIST_CSS,
-  ORGANIZATION_SWITCHER_CSS,
-  ORGANIZATION_PROFILE_CSS,
-  CREATE_ORGANIZATION_CSS,
   LANGUAGE_SWITCHER_CSS,
   USER_DROPDOWN_CSS,
   USER_PROFILE_CSS,

From 993fc290cae91d8119d2558a1783a84871a58a30 Mon Sep 17 00:00:00 2001
From: Brion <info@brionmario.com>
Date: Mon, 29 Jun 2026 02:13:37 +0530
Subject: [PATCH 5/5] Add new Quickstart samples

---
 .github/actions/pack-sample/action.yml        |   51 +
 .github/workflows/pr-builder.yml              |    4 +-
 .github/workflows/release.yml                 |  136 ++
 eslint.config.js                              |    6 +
 package.json                                  |    1 +
 .../src/api/getOrganizationUnitChildren.ts    |    3 +-
 packages/nextjs/rolldown.config.js            |    2 +-
 .../actions/SignInButton/SignInButton.tsx     |   23 +-
 .../contexts/ThunderID/ThunderIDProvider.tsx  |    5 +-
 packages/nextjs/src/server/index.ts           |    1 -
 .../nextjs/src/server/proxy/thunderIDProxy.ts |    3 +-
 .../src/runtime/components/ThunderIDRoot.ts   |   14 +-
 packages/nuxt/src/runtime/types.ts            |    7 +-
 .../UserAvatar/BaseUserAvatar.tsx             |    9 +-
 .../composables/secondary-composables.test.ts |    7 +-
 .../src/components/actions/SignInButton.ts    |   35 +-
 .../src/components/actions/SignUpButton.ts    |   25 +-
 packages/vue/src/index.ts                     |    9 +-
 pnpm-lock.yaml                                |  921 ++++++++++++-
 pnpm-workspace.yaml                           |    1 +
 samples/browser/quickstart/.env.example       |    2 +
 samples/browser/quickstart/README.md          |   35 +
 samples/browser/quickstart/index.html         |   12 +
 samples/browser/quickstart/package.json       |   17 +
 samples/browser/quickstart/src/auth.js        |   12 +
 .../browser/quickstart/src/components/nav.js  |  163 +++
 samples/browser/quickstart/src/main.js        |   78 ++
 samples/browser/quickstart/src/pages/home.js  |  216 ++++
 .../browser/quickstart/src/pages/profile.js   |   45 +
 samples/browser/quickstart/src/pages/token.js |  118 ++
 samples/browser/quickstart/src/style.css      | 1039 +++++++++++++++
 samples/browser/quickstart/vite.config.js     |    7 +
 samples/express/quickstart/.env.example       |    3 +
 samples/express/quickstart/README.md          |   38 +
 samples/express/quickstart/index.js           |   69 +
 samples/express/quickstart/package.json       |   14 +
 samples/nextjs/quickstart/.env.example        |    4 +
 samples/nextjs/quickstart/README.md           |   40 +
 samples/nextjs/quickstart/app/actions.ts      |   19 +
 .../quickstart/app/components/HeroCtas.tsx    |   23 +
 .../nextjs/quickstart/app/components/Nav.tsx  |  119 ++
 .../quickstart/app/components/ThunderMark.tsx |   36 +
 samples/nextjs/quickstart/app/globals.css     |  889 +++++++++++++
 samples/nextjs/quickstart/app/layout.tsx      |   26 +
 samples/nextjs/quickstart/app/not-found.tsx   |   13 +
 samples/nextjs/quickstart/app/page.tsx        |  266 ++++
 .../nextjs/quickstart/app/profile/page.tsx    |   14 +
 samples/nextjs/quickstart/app/token/page.tsx  |  143 +++
 samples/nextjs/quickstart/next-env.d.ts       |    6 +
 samples/nextjs/quickstart/next.config.ts      |    5 +
 samples/nextjs/quickstart/package.json        |   22 +
 samples/nextjs/quickstart/proxy.ts            |   13 +
 samples/nextjs/quickstart/tsconfig.json       |   21 +
 samples/node/quickstart/.env.example          |    3 +
 samples/node/quickstart/README.md             |   38 +
 samples/node/quickstart/index.js              |  129 ++
 samples/node/quickstart/package.json          |   12 +
 samples/nuxt/quickstart/.env.example          |    4 +
 samples/nuxt/quickstart/README.md             |   40 +
 samples/nuxt/quickstart/app.vue               |    5 +
 samples/nuxt/quickstart/assets/styles.css     |  745 +++++++++++
 samples/nuxt/quickstart/components/AppNav.vue |   78 ++
 samples/nuxt/quickstart/nuxt.config.ts        |    4 +
 samples/nuxt/quickstart/package.json          |   16 +
 samples/nuxt/quickstart/pages/index.vue       |  243 ++++
 samples/nuxt/quickstart/pages/profile.vue     |   14 +
 samples/nuxt/quickstart/pages/token.vue       |  125 ++
 samples/react/quickstart/.env.example         |    2 +
 samples/react/quickstart/README.md            |   34 +
 samples/react/quickstart/index.html           |   13 +
 samples/react/quickstart/package.json         |   22 +
 samples/react/quickstart/pnpm-lock.yaml       | 1135 +++++++++++++++++
 samples/react/quickstart/src/App.css          |  707 ++++++++++
 samples/react/quickstart/src/App.jsx          |   23 +
 .../quickstart/src/components/HeroCtas.jsx    |   22 +
 .../react/quickstart/src/components/Nav.jsx   |  126 ++
 .../quickstart/src/components/ThunderMark.jsx |   10 +
 samples/react/quickstart/src/index.css        |    9 +
 samples/react/quickstart/src/main.jsx         |   17 +
 .../react/quickstart/src/pages/HomePage.jsx   |  254 ++++
 .../quickstart/src/pages/ProfilePage.jsx      |    9 +
 .../quickstart/src/pages/TokenDebugPage.jsx   |  139 ++
 samples/react/quickstart/vite.config.js       |    6 +
 samples/vue/quickstart/.env.example           |    2 +
 samples/vue/quickstart/README.md              |   34 +
 samples/vue/quickstart/index.html             |   13 +
 samples/vue/quickstart/package.json           |   19 +
 samples/vue/quickstart/src/App.vue            |   35 +
 samples/vue/quickstart/src/components/Nav.vue |   90 ++
 samples/vue/quickstart/src/main.js            |    8 +
 samples/vue/quickstart/src/pages/HomePage.vue |  256 ++++
 .../vue/quickstart/src/pages/ProfilePage.vue  |    9 +
 .../quickstart/src/pages/TokenDebugPage.vue   |  118 ++
 samples/vue/quickstart/src/style.css          |  742 +++++++++++
 samples/vue/quickstart/vite.config.js         |    6 +
 95 files changed, 9977 insertions(+), 129 deletions(-)
 create mode 100644 .github/actions/pack-sample/action.yml
 create mode 100644 samples/browser/quickstart/.env.example
 create mode 100644 samples/browser/quickstart/README.md
 create mode 100644 samples/browser/quickstart/index.html
 create mode 100644 samples/browser/quickstart/package.json
 create mode 100644 samples/browser/quickstart/src/auth.js
 create mode 100644 samples/browser/quickstart/src/components/nav.js
 create mode 100644 samples/browser/quickstart/src/main.js
 create mode 100644 samples/browser/quickstart/src/pages/home.js
 create mode 100644 samples/browser/quickstart/src/pages/profile.js
 create mode 100644 samples/browser/quickstart/src/pages/token.js
 create mode 100644 samples/browser/quickstart/src/style.css
 create mode 100644 samples/browser/quickstart/vite.config.js
 create mode 100644 samples/express/quickstart/.env.example
 create mode 100644 samples/express/quickstart/README.md
 create mode 100644 samples/express/quickstart/index.js
 create mode 100644 samples/express/quickstart/package.json
 create mode 100644 samples/nextjs/quickstart/.env.example
 create mode 100644 samples/nextjs/quickstart/README.md
 create mode 100644 samples/nextjs/quickstart/app/actions.ts
 create mode 100644 samples/nextjs/quickstart/app/components/HeroCtas.tsx
 create mode 100644 samples/nextjs/quickstart/app/components/Nav.tsx
 create mode 100644 samples/nextjs/quickstart/app/components/ThunderMark.tsx
 create mode 100644 samples/nextjs/quickstart/app/globals.css
 create mode 100644 samples/nextjs/quickstart/app/layout.tsx
 create mode 100644 samples/nextjs/quickstart/app/not-found.tsx
 create mode 100644 samples/nextjs/quickstart/app/page.tsx
 create mode 100644 samples/nextjs/quickstart/app/profile/page.tsx
 create mode 100644 samples/nextjs/quickstart/app/token/page.tsx
 create mode 100644 samples/nextjs/quickstart/next-env.d.ts
 create mode 100644 samples/nextjs/quickstart/next.config.ts
 create mode 100644 samples/nextjs/quickstart/package.json
 create mode 100644 samples/nextjs/quickstart/proxy.ts
 create mode 100644 samples/nextjs/quickstart/tsconfig.json
 create mode 100644 samples/node/quickstart/.env.example
 create mode 100644 samples/node/quickstart/README.md
 create mode 100644 samples/node/quickstart/index.js
 create mode 100644 samples/node/quickstart/package.json
 create mode 100644 samples/nuxt/quickstart/.env.example
 create mode 100644 samples/nuxt/quickstart/README.md
 create mode 100644 samples/nuxt/quickstart/app.vue
 create mode 100644 samples/nuxt/quickstart/assets/styles.css
 create mode 100644 samples/nuxt/quickstart/components/AppNav.vue
 create mode 100644 samples/nuxt/quickstart/nuxt.config.ts
 create mode 100644 samples/nuxt/quickstart/package.json
 create mode 100644 samples/nuxt/quickstart/pages/index.vue
 create mode 100644 samples/nuxt/quickstart/pages/profile.vue
 create mode 100644 samples/nuxt/quickstart/pages/token.vue
 create mode 100644 samples/react/quickstart/.env.example
 create mode 100644 samples/react/quickstart/README.md
 create mode 100644 samples/react/quickstart/index.html
 create mode 100644 samples/react/quickstart/package.json
 create mode 100644 samples/react/quickstart/pnpm-lock.yaml
 create mode 100644 samples/react/quickstart/src/App.css
 create mode 100644 samples/react/quickstart/src/App.jsx
 create mode 100644 samples/react/quickstart/src/components/HeroCtas.jsx
 create mode 100644 samples/react/quickstart/src/components/Nav.jsx
 create mode 100644 samples/react/quickstart/src/components/ThunderMark.jsx
 create mode 100644 samples/react/quickstart/src/index.css
 create mode 100644 samples/react/quickstart/src/main.jsx
 create mode 100644 samples/react/quickstart/src/pages/HomePage.jsx
 create mode 100644 samples/react/quickstart/src/pages/ProfilePage.jsx
 create mode 100644 samples/react/quickstart/src/pages/TokenDebugPage.jsx
 create mode 100644 samples/react/quickstart/vite.config.js
 create mode 100644 samples/vue/quickstart/.env.example
 create mode 100644 samples/vue/quickstart/README.md
 create mode 100644 samples/vue/quickstart/index.html
 create mode 100644 samples/vue/quickstart/package.json
 create mode 100644 samples/vue/quickstart/src/App.vue
 create mode 100644 samples/vue/quickstart/src/components/Nav.vue
 create mode 100644 samples/vue/quickstart/src/main.js
 create mode 100644 samples/vue/quickstart/src/pages/HomePage.vue
 create mode 100644 samples/vue/quickstart/src/pages/ProfilePage.vue
 create mode 100644 samples/vue/quickstart/src/pages/TokenDebugPage.vue
 create mode 100644 samples/vue/quickstart/src/style.css
 create mode 100644 samples/vue/quickstart/vite.config.js

diff --git a/.github/actions/pack-sample/action.yml b/.github/actions/pack-sample/action.yml
new file mode 100644
index 0000000..c8b7a35
--- /dev/null
+++ b/.github/actions/pack-sample/action.yml
@@ -0,0 +1,51 @@
+name: Pack Sample App
+description: >
+  Packages a sample app into a standalone zip using pnpm pack, which
+  rewrites workspace:* and catalog: references to real npm versions.
+  Requires the pnpm workspace to be installed before this action runs.
+
+inputs:
+  sdk:
+    description: SDK slug matching the samples/ subdirectory (e.g. react, browser, node)
+    required: true
+  version:
+    description: Version being released (e.g. 1.2.3), used to name the zip file
+    required: true
+
+outputs:
+  archive:
+    description: Filename of the produced zip (relative to the workspace root)
+    value: ${{ steps.pack.outputs.archive }}
+
+runs:
+  using: composite
+  steps:
+    - name: Pack
+      id: pack
+      shell: bash
+      run: |
+        SDK="${{ inputs.sdk }}"
+        VERSION="${{ inputs.version }}"
+        DEST_DIR="$(pwd)"
+        FOLDER="thunderid-${SDK}-sdk-sample-v${VERSION}"
+        ARCHIVE="${FOLDER}.zip"
+
+        PACK_DIR="$(mktemp -d)"
+        trap 'rm -rf "$PACK_DIR"' EXIT
+
+        cd "samples/${SDK}/quickstart"
+        pnpm pack --pack-destination "${PACK_DIR}"
+        cd "${DEST_DIR}"
+
+        tgz=$(ls "${PACK_DIR}"/*.tgz | head -1)
+        if [ -z "$tgz" ]; then
+          echo "Error: pnpm pack did not produce a .tgz for ${SDK}"
+          exit 1
+        fi
+
+        tar xzf "$tgz"
+        mv package "${FOLDER}"
+        (find "${FOLDER}" | sort | zip "${ARCHIVE}" -@)
+        rm -rf "${FOLDER}"
+
+        echo "archive=${ARCHIVE}" >> "$GITHUB_OUTPUT"
diff --git a/.github/workflows/pr-builder.yml b/.github/workflows/pr-builder.yml
index 074ae7a..7072b5a 100644
--- a/.github/workflows/pr-builder.yml
+++ b/.github/workflows/pr-builder.yml
@@ -72,7 +72,7 @@ jobs:
         run: pnpm format:check
 
       - name: 🧹 Lint
-        run: pnpm --filter '!./packages/**' lint
+        run: pnpm --filter '!./packages/**' --filter '!./samples/**' lint
 
       - name: 🧪 Test
-        run: pnpm --filter '!./packages/**' test
+        run: pnpm --filter '!./packages/**' --filter '!./samples/**' test
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index ed6579b..7230ee7 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -163,6 +163,14 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
+      - name: 🚀 Create GitHub Release
+        env:
+          GH_TOKEN: ${{ secrets.THUNDERID_AUTOMATION_BOT }}
+        run: |
+          gh release create "sdk/javascript/v${{ steps.bump.outputs.version }}" \
+            --title "ThunderID JavaScript SDK v${{ steps.bump.outputs.version }}" \
+            --generate-notes
+
   # ── Level 1: depends on javascript ─────────────────────────────────────────
   release-browser:
     name: 🌐 Release @thunderid/browser
@@ -221,6 +229,22 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
+      - name: 📦 Pack Sample
+        id: pack
+        uses: ./.github/actions/pack-sample
+        with:
+          sdk: browser
+          version: ${{ steps.bump.outputs.version }}
+
+      - name: 🚀 Create GitHub Release
+        env:
+          GH_TOKEN: ${{ secrets.THUNDERID_AUTOMATION_BOT }}
+        run: |
+          gh release create "sdk/browser/v${{ steps.bump.outputs.version }}" \
+            --title "ThunderID Browser SDK v${{ steps.bump.outputs.version }}" \
+            --generate-notes \
+            "${{ steps.pack.outputs.archive }}"
+
   release-node:
     name: 🟢 Release @thunderid/node
     needs: [validate, release-javascript]
@@ -278,6 +302,22 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
+      - name: 📦 Pack Sample
+        id: pack
+        uses: ./.github/actions/pack-sample
+        with:
+          sdk: node
+          version: ${{ steps.bump.outputs.version }}
+
+      - name: 🚀 Create GitHub Release
+        env:
+          GH_TOKEN: ${{ secrets.THUNDERID_AUTOMATION_BOT }}
+        run: |
+          gh release create "sdk/node/v${{ steps.bump.outputs.version }}" \
+            --title "ThunderID Node SDK v${{ steps.bump.outputs.version }}" \
+            --generate-notes \
+            "${{ steps.pack.outputs.archive }}"
+
   # ── Level 2: depends on browser / node ─────────────────────────────────────
   release-express:
     name: 🚂 Release @thunderid/express
@@ -336,6 +376,22 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
+      - name: 📦 Pack Sample
+        id: pack
+        uses: ./.github/actions/pack-sample
+        with:
+          sdk: express
+          version: ${{ steps.bump.outputs.version }}
+
+      - name: 🚀 Create GitHub Release
+        env:
+          GH_TOKEN: ${{ secrets.THUNDERID_AUTOMATION_BOT }}
+        run: |
+          gh release create "sdk/express/v${{ steps.bump.outputs.version }}" \
+            --title "ThunderID Express SDK v${{ steps.bump.outputs.version }}" \
+            --generate-notes \
+            "${{ steps.pack.outputs.archive }}"
+
   release-react:
     name: ⚛️ Release @thunderid/react
     needs: [validate, release-browser]
@@ -393,6 +449,22 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
+      - name: 📦 Pack Sample
+        id: pack
+        uses: ./.github/actions/pack-sample
+        with:
+          sdk: react
+          version: ${{ steps.bump.outputs.version }}
+
+      - name: 🚀 Create GitHub Release
+        env:
+          GH_TOKEN: ${{ secrets.THUNDERID_AUTOMATION_BOT }}
+        run: |
+          gh release create "sdk/react/v${{ steps.bump.outputs.version }}" \
+            --title "ThunderID React SDK v${{ steps.bump.outputs.version }}" \
+            --generate-notes \
+            "${{ steps.pack.outputs.archive }}"
+
   release-vue:
     name: 🟩 Release @thunderid/vue
     needs: [validate, release-browser]
@@ -450,6 +522,22 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
+      - name: 📦 Pack Sample
+        id: pack
+        uses: ./.github/actions/pack-sample
+        with:
+          sdk: vue
+          version: ${{ steps.bump.outputs.version }}
+
+      - name: 🚀 Create GitHub Release
+        env:
+          GH_TOKEN: ${{ secrets.THUNDERID_AUTOMATION_BOT }}
+        run: |
+          gh release create "sdk/vue/v${{ steps.bump.outputs.version }}" \
+            --title "ThunderID Vue SDK v${{ steps.bump.outputs.version }}" \
+            --generate-notes \
+            "${{ steps.pack.outputs.archive }}"
+
   # ── Level 3: depends on react / node+react / browser+node+vue ──────────────
   release-react-router:
     name: 🔀 Release @thunderid/react-router
@@ -508,6 +596,14 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
+      - name: 🚀 Create GitHub Release
+        env:
+          GH_TOKEN: ${{ secrets.THUNDERID_AUTOMATION_BOT }}
+        run: |
+          gh release create "sdk/react-router/v${{ steps.bump.outputs.version }}" \
+            --title "ThunderID React Router SDK v${{ steps.bump.outputs.version }}" \
+            --generate-notes
+
   release-tanstack-router:
     name: 🔱 Release @thunderid/tanstack-router
     needs: [validate, release-react]
@@ -565,6 +661,14 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
+      - name: 🚀 Create GitHub Release
+        env:
+          GH_TOKEN: ${{ secrets.THUNDERID_AUTOMATION_BOT }}
+        run: |
+          gh release create "sdk/tanstack-router/v${{ steps.bump.outputs.version }}" \
+            --title "ThunderID TanStack Router SDK v${{ steps.bump.outputs.version }}" \
+            --generate-notes
+
   release-nextjs:
     name: ▲ Release @thunderid/nextjs
     needs: [validate, release-node, release-react]
@@ -622,6 +726,22 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
+      - name: 📦 Pack Sample
+        id: pack
+        uses: ./.github/actions/pack-sample
+        with:
+          sdk: nextjs
+          version: ${{ steps.bump.outputs.version }}
+
+      - name: 🚀 Create GitHub Release
+        env:
+          GH_TOKEN: ${{ secrets.THUNDERID_AUTOMATION_BOT }}
+        run: |
+          gh release create "sdk/nextjs/v${{ steps.bump.outputs.version }}" \
+            --title "ThunderID Next.js SDK v${{ steps.bump.outputs.version }}" \
+            --generate-notes \
+            "${{ steps.pack.outputs.archive }}"
+
   release-nuxt:
     name: 💚 Release @thunderid/nuxt
     needs: [validate, release-browser, release-node, release-vue]
@@ -678,3 +798,19 @@ jobs:
         working-directory: packages/nuxt
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+
+      - name: 📦 Pack Sample
+        id: pack
+        uses: ./.github/actions/pack-sample
+        with:
+          sdk: nuxt
+          version: ${{ steps.bump.outputs.version }}
+
+      - name: 🚀 Create GitHub Release
+        env:
+          GH_TOKEN: ${{ secrets.THUNDERID_AUTOMATION_BOT }}
+        run: |
+          gh release create "sdk/nuxt/v${{ steps.bump.outputs.version }}" \
+            --title "ThunderID Nuxt SDK v${{ steps.bump.outputs.version }}" \
+            --generate-notes \
+            "${{ steps.pack.outputs.archive }}"
diff --git a/eslint.config.js b/eslint.config.js
index 20e710e..3b73558 100644
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -23,4 +23,10 @@ export default [
     ignores: ['dist/**', 'build/**', 'node_modules/**', 'coverage/**'],
   },
   ...thunderIdPlugin.configs.typescript,
+  {
+    files: ['samples/**'],
+    rules: {
+      '@thunderid/copyright-header': 'off',
+    },
+  },
 ];
diff --git a/package.json b/package.json
index ef24710..bb4ac8e 100644
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
   },
   "devDependencies": {
     "nx": "22.7.5",
+    "@thunderid/eslint-plugin": "catalog:",
     "eslint": "catalog:",
     "prettier": "catalog:",
     "rimraf": "catalog:",
diff --git a/packages/javascript/src/api/getOrganizationUnitChildren.ts b/packages/javascript/src/api/getOrganizationUnitChildren.ts
index 2e0d4c2..243d0c1 100644
--- a/packages/javascript/src/api/getOrganizationUnitChildren.ts
+++ b/packages/javascript/src/api/getOrganizationUnitChildren.ts
@@ -116,8 +116,7 @@ const getOrganizationUnitChildren = async ({
   if (offset !== undefined) queryParams.set('offset', String(offset));
   const query = queryParams.toString();
 
-  const resolvedBase =
-    url ?? `${baseUrl}/api/server/v1/organization-units/${organizationUnitId}/children`;
+  const resolvedBase = url ?? `${baseUrl}/api/server/v1/organization-units/${organizationUnitId}/children`;
   const resolvedUrl = query ? `${resolvedBase}?${query}` : resolvedBase;
 
   const requestInit: RequestInit = {
diff --git a/packages/nextjs/rolldown.config.js b/packages/nextjs/rolldown.config.js
index eb865e0..984611e 100644
--- a/packages/nextjs/rolldown.config.js
+++ b/packages/nextjs/rolldown.config.js
@@ -23,7 +23,7 @@ import {defineConfig} from 'rolldown';
 const pkg = JSON.parse(readFileSync('./package.json', 'utf8'));
 
 const externalPackages = [...Object.keys(pkg.dependencies || {}), ...Object.keys(pkg.peerDependencies || {})];
-const external = id => externalPackages.some(name => id === name || id.startsWith(`${name}/`));
+const external = (id) => externalPackages.some((name) => id === name || id.startsWith(`${name}/`));
 
 const commonOptions = {
   input: [join('src', 'index.ts'), join('src', 'server', 'index.ts')],
diff --git a/packages/nextjs/src/client/components/actions/SignInButton/SignInButton.tsx b/packages/nextjs/src/client/components/actions/SignInButton/SignInButton.tsx
index e91c98b..7036540 100644
--- a/packages/nextjs/src/client/components/actions/SignInButton/SignInButton.tsx
+++ b/packages/nextjs/src/client/components/actions/SignInButton/SignInButton.tsx
@@ -22,7 +22,7 @@ import {ThunderIDRuntimeError} from '@thunderid/node';
 import {BaseSignInButton, BaseSignInButtonProps, useTranslation} from '@thunderid/react';
 import {AppRouterInstance} from 'next/dist/shared/lib/app-router-context.shared-runtime';
 import {useRouter} from 'next/navigation';
-import {forwardRef, ForwardRefExoticComponent, ReactElement, Ref, RefAttributes, MouseEvent} from 'react';
+import {forwardRef, ForwardRefExoticComponent, ReactElement, Ref, RefAttributes, MouseEvent, useState} from 'react';
 import useThunderID from '../../../contexts/ThunderID/useThunderID';
 
 /**
@@ -71,18 +71,18 @@ const SignInButton: ForwardRefExoticComponent<SignInButtonProps & RefAttributes<
     const router: AppRouterInstance = useRouter();
     const {t} = useTranslation(preferences?.i18n);
 
-    const handleOnClick = async (e: MouseEvent<HTMLButtonElement>): Promise<void> => {
+    const [isLoading, setIsLoading] = useState(false);
+
+    const handleSignIn = async (): Promise<void> => {
       try {
+        setIsLoading(true);
+
         // If a custom `signInUrl` is provided, use it for navigation.
         if (signInUrl) {
           router.push(signInUrl);
         } else if (signIn) {
           await signIn(signInOptions);
         }
-
-        if (onClick) {
-          onClick(e);
-        }
       } catch (error) {
         throw new ThunderIDRuntimeError(
           `Sign in failed: ${error instanceof Error ? error.message : String(error)}`,
@@ -90,6 +90,15 @@ const SignInButton: ForwardRefExoticComponent<SignInButtonProps & RefAttributes<
           'nextjs',
           'Something went wrong while trying to sign in. Please try again later.',
         );
+      } finally {
+        setIsLoading(false);
+      }
+    };
+
+    const handleOnClick = async (e: MouseEvent<HTMLButtonElement>): Promise<void> => {
+      await handleSignIn();
+      if (onClick) {
+        onClick(e);
       }
     };
 
@@ -99,6 +108,8 @@ const SignInButton: ForwardRefExoticComponent<SignInButtonProps & RefAttributes<
         style={style}
         ref={ref}
         preferences={preferences}
+        isLoading={isLoading}
+        signIn={handleSignIn}
         onClick={handleOnClick}
         {...rest}
       >
diff --git a/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx b/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx
index 0624ed9..498faab 100644
--- a/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx
+++ b/packages/nextjs/src/client/contexts/ThunderID/ThunderIDProvider.tsx
@@ -302,10 +302,7 @@ const ThunderIDClientProvider: FC<PropsWithChildren<ThunderIDClientProviderProps
     <ThunderIDContext.Provider value={contextValue}>
       <I18nProvider preferences={preferences?.i18n}>
         <FlowMetaProvider enabled={preferences?.resolveFromMeta !== false}>
-          <ThemeProvider
-            theme={preferences?.theme?.overrides}
-            mode={getActiveTheme(preferences?.theme?.mode as any)}
-          >
+          <ThemeProvider theme={preferences?.theme?.overrides} mode={getActiveTheme(preferences?.theme?.mode as any)}>
             <FlowProvider>
               <UserProvider profile={userProfile} onUpdateProfile={handleProfileUpdate} updateProfile={updateProfile}>
                 {children}
diff --git a/packages/nextjs/src/server/index.ts b/packages/nextjs/src/server/index.ts
index 8fb8585..017d6de 100644
--- a/packages/nextjs/src/server/index.ts
+++ b/packages/nextjs/src/server/index.ts
@@ -27,4 +27,3 @@ export {default as thunderIDProxy} from './proxy/thunderIDProxy';
 export * from './proxy/thunderIDProxy';
 
 export {default as createRouteMatcher} from './proxy/createRouteMatcher';
-
diff --git a/packages/nextjs/src/server/proxy/thunderIDProxy.ts b/packages/nextjs/src/server/proxy/thunderIDProxy.ts
index aad40f5..4b3c0e4 100644
--- a/packages/nextjs/src/server/proxy/thunderIDProxy.ts
+++ b/packages/nextjs/src/server/proxy/thunderIDProxy.ts
@@ -146,8 +146,7 @@ const thunderIDProxy =
     options?: ThunderIDProxyOptions | ((req: NextRequest) => ThunderIDProxyOptions),
   ): ((request: NextRequest) => Promise<NextResponse>) =>
   async (request: NextRequest): Promise<NextResponse> => {
-    const resolvedOptions: ThunderIDProxyOptions =
-      typeof options === 'function' ? options(request) : options || {};
+    const resolvedOptions: ThunderIDProxyOptions = typeof options === 'function' ? options(request) : options || {};
 
     // Resolve full config from passed options + environment variable fallbacks.
     const resolvedConfig: ThunderIDNextConfig = decorateConfigWithNextEnv(resolvedOptions as ThunderIDNextConfig);
diff --git a/packages/nuxt/src/runtime/components/ThunderIDRoot.ts b/packages/nuxt/src/runtime/components/ThunderIDRoot.ts
index 08d9304..e3f1034 100644
--- a/packages/nuxt/src/runtime/components/ThunderIDRoot.ts
+++ b/packages/nuxt/src/runtime/components/ThunderIDRoot.ts
@@ -17,18 +17,8 @@
  */
 
 import {generateFlattenedUserProfile} from '@thunderid/browser';
-import type {
-  UpdateMeProfileConfig,
-  User,
-  UserProfile,
-} from '@thunderid/node';
-import {
-  FlowMetaProvider,
-  FlowProvider,
-  I18nProvider,
-  ThemeProvider,
-  UserProvider,
-} from '@thunderid/vue';
+import type {UpdateMeProfileConfig, User, UserProfile} from '@thunderid/node';
+import {FlowMetaProvider, FlowProvider, I18nProvider, ThemeProvider, UserProvider} from '@thunderid/vue';
 import {defineComponent, h, type Component, type Ref, type SetupContext, type VNode} from 'vue';
 import type {ThunderIDAuthState, ThunderIDNuxtConfig} from '../types';
 import {useState, useRuntimeConfig} from '#imports';
diff --git a/packages/nuxt/src/runtime/types.ts b/packages/nuxt/src/runtime/types.ts
index 72223f7..eab09b7 100644
--- a/packages/nuxt/src/runtime/types.ts
+++ b/packages/nuxt/src/runtime/types.ts
@@ -16,12 +16,7 @@
  * under the License.
  */
 
-import type {
-  I18nPreferences,
-  TokenEndpointAuthMethod,
-  User,
-  UserProfile,
-} from '@thunderid/node';
+import type {I18nPreferences, TokenEndpointAuthMethod, User, UserProfile} from '@thunderid/node';
 import type {JWTPayload} from 'jose';
 
 /**
diff --git a/packages/react/src/components/presentation/UserAvatar/BaseUserAvatar.tsx b/packages/react/src/components/presentation/UserAvatar/BaseUserAvatar.tsx
index f90faba..a37c7ea 100644
--- a/packages/react/src/components/presentation/UserAvatar/BaseUserAvatar.tsx
+++ b/packages/react/src/components/presentation/UserAvatar/BaseUserAvatar.tsx
@@ -56,14 +56,7 @@ const resolveName = (user: User): string | undefined => {
   const family: string = user['familyName'] || user['family_name'] || '';
   if (given && family) return `${given} ${family}`;
 
-  return (
-    user['displayName'] ||
-    user['name'] ||
-    given ||
-    user['username'] ||
-    user['email'] ||
-    undefined
-  );
+  return user['displayName'] || user['name'] || given || user['username'] || user['email'] || undefined;
 };
 
 /**
diff --git a/packages/vue/src/__tests__/composables/secondary-composables.test.ts b/packages/vue/src/__tests__/composables/secondary-composables.test.ts
index 8fe73f1..0c7f2dd 100644
--- a/packages/vue/src/__tests__/composables/secondary-composables.test.ts
+++ b/packages/vue/src/__tests__/composables/secondary-composables.test.ts
@@ -25,12 +25,7 @@ import useFlowMeta from '../../composables/useFlowMeta';
 import useI18n from '../../composables/useI18n';
 import useTheme from '../../composables/useTheme';
 import {FLOW_KEY, FLOW_META_KEY, THEME_KEY, I18N_KEY} from '../../keys';
-import type {
-  FlowContextValue,
-  FlowMetaContextValue,
-  ThemeContextValue,
-  I18nContextValue,
-} from '../../models/contexts';
+import type {FlowContextValue, FlowMetaContextValue, ThemeContextValue, I18nContextValue} from '../../models/contexts';
 
 describe('useFlow', () => {
   it('should return the FlowContextValue when called inside a provider', () => {
diff --git a/packages/vue/src/components/actions/SignInButton.ts b/packages/vue/src/components/actions/SignInButton.ts
index 3f2aaa9..ca819df 100644
--- a/packages/vue/src/components/actions/SignInButton.ts
+++ b/packages/vue/src/components/actions/SignInButton.ts
@@ -17,7 +17,17 @@
  */
 
 import {ThunderIDRuntimeError, navigate} from '@thunderid/browser';
-import {defineComponent, h, ref, type Component, type PropType, type Ref, type SetupContext, type VNode} from 'vue';
+import {
+  Fragment,
+  defineComponent,
+  h,
+  ref,
+  type Component,
+  type PropType,
+  type Ref,
+  type SetupContext,
+  type VNode,
+} from 'vue';
 import BaseSignInButton from './BaseSignInButton';
 import useThunderID from '../../composables/useThunderID';
 
@@ -60,20 +70,17 @@ const SignInButton: Component = defineComponent({
     };
 
     return (): VNode => {
-      const slotContent: (() => VNode[]) | undefined = slots['default']
-        ? (): VNode[] => slots['default']!({isLoading: isLoading.value})
-        : undefined;
+      if (slots['default']) {
+        const nodes: VNode[] = slots['default']({isLoading: isLoading.value, signIn: handleSignIn});
+        return nodes.length === 1 ? nodes[0] : h(Fragment, null, nodes);
+      }
 
-      return h(
-        BaseSignInButton,
-        {
-          class: attrs.class,
-          isLoading: isLoading.value,
-          onClick: handleSignIn,
-          style: attrs.style,
-        },
-        slotContent,
-      );
+      return h(BaseSignInButton, {
+        class: attrs.class,
+        isLoading: isLoading.value,
+        onClick: handleSignIn,
+        style: attrs.style,
+      });
     };
   },
 });
diff --git a/packages/vue/src/components/actions/SignUpButton.ts b/packages/vue/src/components/actions/SignUpButton.ts
index 2af6e4a..50e6ff4 100644
--- a/packages/vue/src/components/actions/SignUpButton.ts
+++ b/packages/vue/src/components/actions/SignUpButton.ts
@@ -17,7 +17,7 @@
  */
 
 import {ThunderIDRuntimeError, navigate} from '@thunderid/browser';
-import {defineComponent, h, ref, type Component, type Ref, type SetupContext, type VNode} from 'vue';
+import {Fragment, defineComponent, h, ref, type Component, type Ref, type SetupContext, type VNode} from 'vue';
 import BaseSignUpButton from './BaseSignUpButton';
 import useThunderID from '../../composables/useThunderID';
 
@@ -57,20 +57,17 @@ const SignUpButton: Component = defineComponent({
     };
 
     return (): VNode => {
-      const slotContent: (() => VNode[]) | undefined = slots['default']
-        ? (): VNode[] => slots['default']!({isLoading: isLoading.value})
-        : undefined;
+      if (slots['default']) {
+        const nodes: VNode[] = slots['default']({isLoading: isLoading.value, signUp: handleSignUp});
+        return nodes.length === 1 ? nodes[0] : h(Fragment, null, nodes);
+      }
 
-      return h(
-        BaseSignUpButton,
-        {
-          class: attrs.class,
-          isLoading: isLoading.value,
-          onClick: handleSignUp,
-          style: attrs.style,
-        },
-        slotContent,
-      );
+      return h(BaseSignUpButton, {
+        class: attrs.class,
+        isLoading: isLoading.value,
+        onClick: handleSignUp,
+        style: attrs.style,
+      });
     };
   },
 });
diff --git a/packages/vue/src/index.ts b/packages/vue/src/index.ts
index a60fc75..1139685 100644
--- a/packages/vue/src/index.ts
+++ b/packages/vue/src/index.ts
@@ -44,14 +44,7 @@ export type {UseOAuthCallbackOptions, OAuthCallbackPayload} from './composables/
 export {default as ThunderIDVueClient} from './ThunderIDVueClient';
 
 // ── Keys ──
-export {
-  THUNDERID_KEY,
-  FLOW_KEY,
-  FLOW_META_KEY,
-  I18N_KEY,
-  THEME_KEY,
-  USER_KEY,
-} from './keys';
+export {THUNDERID_KEY, FLOW_KEY, FLOW_META_KEY, I18N_KEY, THEME_KEY, USER_KEY} from './keys';
 
 // ── Models / Types ──
 export type {ThunderIDVueConfig} from './models/config';
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 3c1fec5..8ef5d16 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -116,6 +116,9 @@ importers:
 
   .:
     devDependencies:
+      '@thunderid/eslint-plugin':
+        specifier: 'catalog:'
+        version: 0.0.2(@typescript-eslint/utils@8.61.1(eslint@9.39.4(jiti@2.7.0))(typescript@5.9.3))(eslint@9.39.4(jiti@2.7.0))(typescript@5.9.3)(vitest@4.1.8)(vue-eslint-parser@10.4.1(eslint@9.39.4(jiti@2.7.0)))
       eslint:
         specifier: 'catalog:'
         version: 9.39.4(jiti@2.7.0)
@@ -433,7 +436,7 @@ importers:
         version: 3.21.7
       '@nuxt/test-utils':
         specifier: 3.17.2
-        version: 3.17.2(@playwright/test@1.60.0)(@types/node@24.7.2)(@vue/test-utils@2.4.6)(jiti@2.7.0)(magicast@0.5.3)(playwright-core@1.60.0)(terser@5.48.0)(typescript@5.9.3)(vitest@4.1.8)(yaml@2.9.0)
+        version: 3.17.2(@playwright/test@1.60.0)(@types/node@24.7.2)(@vue/test-utils@2.4.6)(jiti@2.7.0)(jsdom@27.0.1)(magicast@0.5.3)(playwright-core@1.60.0)(terser@5.48.0)(typescript@5.9.3)(vitest@4.1.8)(yaml@2.9.0)
       '@thunderid/eslint-plugin':
         specifier: 'catalog:'
         version: 0.0.2(@typescript-eslint/utils@8.61.1(eslint@9.39.4(jiti@2.7.0))(typescript@5.9.3))(eslint@9.39.4(jiti@2.7.0))(typescript@5.9.3)(vitest@4.1.8)(vue-eslint-parser@10.4.1(eslint@9.39.4(jiti@2.7.0)))
@@ -673,6 +676,115 @@ importers:
         specifier: 3.5.30
         version: 3.5.30(typescript@5.9.3)
 
+  samples/browser/quickstart:
+    dependencies:
+      '@thunderid/browser':
+        specifier: workspace:*
+        version: link:../../../packages/browser
+    devDependencies:
+      vite:
+        specifier: ^6.3.5
+        version: 6.4.3(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
+
+  samples/express/quickstart:
+    dependencies:
+      '@thunderid/express':
+        specifier: workspace:*
+        version: link:../../../packages/express
+      cookie-parser:
+        specifier: ^1.4.7
+        version: 1.4.7
+      express:
+        specifier: ^4.21.2
+        version: 4.22.2
+
+  samples/nextjs/quickstart:
+    dependencies:
+      '@thunderid/nextjs':
+        specifier: workspace:*
+        version: link:../../../packages/nextjs
+      next:
+        specifier: ^15.3.3
+        version: 15.5.18(@playwright/test@1.60.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
+      react:
+        specifier: ^19.2.3
+        version: 19.2.3
+      react-dom:
+        specifier: ^19.2.3
+        version: 19.2.3(react@19.2.3)
+    devDependencies:
+      '@types/node':
+        specifier: ^24.7.2
+        version: 24.7.2
+      '@types/react':
+        specifier: ^19.2.14
+        version: 19.2.14
+      '@types/react-dom':
+        specifier: ^19.2.3
+        version: 19.2.3(@types/react@19.2.14)
+      typescript:
+        specifier: ^5.9.3
+        version: 5.9.3
+
+  samples/node/quickstart:
+    dependencies:
+      '@thunderid/node':
+        specifier: workspace:*
+        version: link:../../../packages/node
+
+  samples/nuxt/quickstart:
+    dependencies:
+      '@thunderid/nuxt':
+        specifier: workspace:*
+        version: link:../../../packages/nuxt
+      nuxt:
+        specifier: ^3.16.2
+        version: 3.21.7(@parcel/watcher@2.5.6)(@types/node@24.7.2)(@vue/compiler-sfc@3.5.38)(cac@6.7.14)(db0@0.3.4)(eslint@9.39.4(jiti@2.7.0))(ioredis@5.11.1)(magicast@0.5.3)(optionator@0.9.4)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup-plugin-visualizer@7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2))(rollup@4.62.2)(terser@5.48.0)(typescript@5.9.3)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(yaml@2.9.0)
+      vue:
+        specifier: ^3.5.13
+        version: 3.5.30(typescript@5.9.3)
+
+  samples/react/quickstart:
+    dependencies:
+      '@thunderid/react':
+        specifier: workspace:*
+        version: link:../../../packages/react
+      '@thunderid/react-router':
+        specifier: workspace:*
+        version: link:../../../packages/react-router
+      react:
+        specifier: ^19.2.3
+        version: 19.2.3
+      react-dom:
+        specifier: ^19.2.3
+        version: 19.2.3(react@19.2.3)
+      react-router:
+        specifier: ^7.6.2
+        version: 7.15.1(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
+    devDependencies:
+      '@vitejs/plugin-react':
+        specifier: ^4.5.2
+        version: 4.7.0(vite@6.4.3(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))
+      vite:
+        specifier: ^6.3.5
+        version: 6.4.3(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
+
+  samples/vue/quickstart:
+    dependencies:
+      '@thunderid/vue':
+        specifier: workspace:*
+        version: link:../../../packages/vue
+      vue:
+        specifier: ^3.5.13
+        version: 3.5.30(typescript@5.9.3)
+    devDependencies:
+      '@vitejs/plugin-vue':
+        specifier: ^5.2.3
+        version: 5.2.4(vite@6.4.3(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(vue@3.5.30(typescript@5.9.3))
+      vite:
+        specifier: ^6.3.5
+        version: 6.4.3(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
+
 packages:
 
   '@asamuzakjp/css-color@4.1.2':
@@ -800,6 +912,18 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
+  '@babel/plugin-transform-react-jsx-self@7.29.7':
+    resolution: {integrity: sha512-TL0hMc9xzy86VD31nUiwzd5otRAcyEPcsegCxolO0PvcXuH1v0kECe/UIznYFihpkvU5wg/jk4v0TTEFfm53fw==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
+  '@babel/plugin-transform-react-jsx-source@7.29.7':
+    resolution: {integrity: sha512-06IyK09H3wi4cGbhDBwp5gUGo0IKtnYa8tyTiephirPCK6fbobVGiXMMI5zLQ4aKEYP3wZ3ArU44o+8KMrSG/Q==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
   '@babel/plugin-transform-typescript@7.29.7':
     resolution: {integrity: sha512-jK52h8LaLc7JarhQV2ofeFMts4H7vnOXnqZNA6fYglBTZewRBE51KWt3BUltW1P+KoPsYkHoJeXePuz4zo2LMw==}
     engines: {node: '>=6.9.0'}
@@ -2557,6 +2681,9 @@ packages:
     cpu: [x64]
     os: [win32]
 
+  '@rolldown/pluginutils@1.0.0-beta.27':
+    resolution: {integrity: sha512-+d0F4MKMCbeVUJwG96uQ4SgAznZNSq93I3V+9NHA4OpvqG8mRCpGdKmK8l/dl02h2CCDHwW2FqilnTyDcAnqjA==}
+
   '@rolldown/pluginutils@1.0.0-beta.45':
     resolution: {integrity: sha512-Le9ulGCrD8ggInzWw/k2J8QcbPz7eGIOWqfJ2L+1R0Opm7n6J37s2hiDWlh6LJN0Lk9L5sUzMvRHKW7UxBZsQA==}
 
@@ -2878,6 +3005,18 @@ packages:
   '@types/aria-query@5.0.4':
     resolution: {integrity: sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==}
 
+  '@types/babel__core@7.20.5':
+    resolution: {integrity: sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==}
+
+  '@types/babel__generator@7.27.0':
+    resolution: {integrity: sha512-ufFd2Xi92OAVPYsy+P4n7/U7e68fex0+Ee8gSG9KX7eo084CWiQ4sdxktvdl0bOPupXtVJPY19zk6EwWqUQ8lg==}
+
+  '@types/babel__template@7.4.4':
+    resolution: {integrity: sha512-h/NUaSyG5EyxBIp8YRxo4RMe2/qQgvyowRwVMzhYhBCONbW8PUsg4lkFMrhgZhUe5z3L3MiLDuvyJ/CaPa2A8A==}
+
+  '@types/babel__traverse@7.28.0':
+    resolution: {integrity: sha512-8PvcXf70gTDZBgt9ptxJ8elBeBjcLOAcOtoO/mPJjtji1+CdGbHgm77om1GrsPxsiE+uXIpNSK64UYaIwQXd4Q==}
+
   '@types/body-parser@1.19.6':
     resolution: {integrity: sha512-HLFeCYgz89uk22N5Qg3dvGvsv46B8GLvKKo1zKG4NybA8U2DiEO3w9lqGg29t/tfLRJpJ6iQxnVw4OnB7MoM9g==}
 
@@ -3177,6 +3316,12 @@ packages:
     engines: {node: '>=20'}
     hasBin: true
 
+  '@vitejs/plugin-react@4.7.0':
+    resolution: {integrity: sha512-gUu9hwfWvvEDBBmgtAowQCojwZmJ5mcLn3aufeCsitijs3+f2NsrPtlAWIR6OPiqljl96GVCUbLe0HyqIpVaoA==}
+    engines: {node: ^14.18.0 || >=16.0.0}
+    peerDependencies:
+      vite: ^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0
+
   '@vitejs/plugin-vue-jsx@5.1.5':
     resolution: {integrity: sha512-jIAsvHOEtWpslLOI2MeElGFxH7M8pM83BU/Tor4RLyiwH0FM4nUW3xdvbw20EeU9wc5IspQwMq225K3CMnJEpA==}
     engines: {node: ^20.19.0 || >=22.12.0}
@@ -3184,6 +3329,13 @@ packages:
       vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
       vue: ^3.0.0
 
+  '@vitejs/plugin-vue@5.2.4':
+    resolution: {integrity: sha512-7Yx/SXSOcQq5HiiV3orevHUFn+pmMB4cgbEkDYgnkUWb0WfeQ/wa2yFv6D5ICiCQOVpjA7vYDXrC7AGO8yjDHA==}
+    engines: {node: ^18.0.0 || >=20.0.0}
+    peerDependencies:
+      vite: ^5.0.0 || ^6.0.0
+      vue: ^3.2.25
+
   '@vitejs/plugin-vue@6.0.7':
     resolution: {integrity: sha512-km+p+XdSz9Sxm5rqUbqcSfZYaAniKxWBj1KURl+Jr7UaPvvX7BmaWMdP69I5rrFDeQGyxAG7NXdc57vz+snhWg==}
     engines: {node: ^20.19.0 || >=22.12.0}
@@ -3389,6 +3541,10 @@ packages:
     resolution: {integrity: sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg==}
     engines: {node: '>=6.5'}
 
+  accepts@1.3.8:
+    resolution: {integrity: sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==}
+    engines: {node: '>= 0.6'}
+
   accepts@2.0.0:
     resolution: {integrity: sha512-5cvg6CtKwfgdmVqY1WIiXKc3Q1bkRqGLi+2W/6ao+6Y7gu/RCwRuAhGEzh5B4KlszSuTLgZYuqFqo5bImjNKng==}
     engines: {node: '>= 0.6'}
@@ -3472,6 +3628,9 @@ packages:
     resolution: {integrity: sha512-LHE+8BuR7RYGDKvnrmcuSq3tDcKv9OFEXQt/HpbZhY7V6h0zlUXutnAD82GiFx9rdieCMjkvtcsPqBwgUl1Iiw==}
     engines: {node: '>= 0.4'}
 
+  array-flatten@1.1.1:
+    resolution: {integrity: sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg==}
+
   array-includes@3.1.9:
     resolution: {integrity: sha512-FmeCCAenzH0KH381SPT5FZmiA/TmpndpcaShhfgEN9eCVjnFBqq3l1xrI42y8+PPLI6hypzou4GXw00WHmPBLQ==}
     engines: {node: '>= 0.4'}
@@ -3637,6 +3796,10 @@ packages:
   bl@4.1.0:
     resolution: {integrity: sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==}
 
+  body-parser@1.20.5:
+    resolution: {integrity: sha512-3grm+/2tUOvu2cjJkvsIxrv/wVpfXQW4PsQHYm7yk4vfpu7Ekl6nEsYBoJUL6qDwZUx8wUhQ8tR2qz+ad9c9OA==}
+    engines: {node: '>= 0.8', npm: 1.2.8000 || >= 1.4.16}
+
   body-parser@2.3.0:
     resolution: {integrity: sha512-2cGmJupaNgg+QUwVLAucDuWuoMZ6EX9iHDRswZ5lsNYEmwPaRknMPCLZz07yTzVq/83p4o/wzbDZbBrTvGGTIw==}
     engines: {node: '>=18'}
@@ -3823,6 +3986,10 @@ packages:
     resolution: {integrity: sha512-5IKcdX0nnYavi6G7TtOhwkYzyjfJlatbjMjuLSfE2kYT5pMDOilZ4OvMhi637CcDICTmz3wARPoyhqyX1Y+XvA==}
     engines: {node: ^14.18.0 || >=16.10.0}
 
+  content-disposition@0.5.4:
+    resolution: {integrity: sha512-FveZTNuGw04cxlAiWbzi6zTAL/lhehaWbTtgluJh4/E95DqMwTmha3KZN1aAWA8cFIhHzMZUvLevkw5Rqk+tSQ==}
+    engines: {node: '>= 0.6'}
+
   content-disposition@1.1.0:
     resolution: {integrity: sha512-5jRCH9Z/+DRP7rkvY83B+yGIGX96OYdJmzngqnw2SBSxqCFPd0w2km3s5iawpGX8krnwSGmF0FW5Nhr0Hfai3g==}
     engines: {node: '>=18'}
@@ -3850,6 +4017,16 @@ packages:
   cookie-es@3.1.1:
     resolution: {integrity: sha512-UaXxwISYJPTr9hwQxMFYZ7kNhSXboMXP+Z3TRX6f1/NyaGPfuNUZOWP1pUEb75B2HjfklIYLVRfWiFZJyC6Npg==}
 
+  cookie-parser@1.4.7:
+    resolution: {integrity: sha512-nGUvgXnotP3BsjiLX2ypbQnWoGUPIIfHQNZkkC668ntrzGWEZVW70HDEB1qnNGMicPje6EttlIgzo51YSwNQGw==}
+    engines: {node: '>= 0.8.0'}
+
+  cookie-signature@1.0.6:
+    resolution: {integrity: sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ==}
+
+  cookie-signature@1.0.7:
+    resolution: {integrity: sha512-NXdYc3dLr47pBkpUCHtKSwIOQXLVn8dZEuywboCOJY/osA0wFSLlSawr3KN8qXJEyX66FcONTH8EIlVuK0yyFA==}
+
   cookie-signature@1.2.2:
     resolution: {integrity: sha512-D76uU73ulSXrD1UXF4KE2TMxVVwhsnCgfAyTg9k8P6KGZjlXKrOLe4dJQKI3Bxi5wjesZoFXJWElNWBjPZMbhg==}
     engines: {node: '>=6.6.0'}
@@ -4004,6 +4181,14 @@ packages:
       sqlite3:
         optional: true
 
+  debug@2.6.9:
+    resolution: {integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+
   debug@4.4.3:
     resolution: {integrity: sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==}
     engines: {node: '>=6.0'}
@@ -4075,6 +4260,10 @@ packages:
   destr@2.0.5:
     resolution: {integrity: sha512-ugFTXCtDZunbzasqBxrK93Ik/DRYsO6S/fedkWEMKqt04xZ4csmnmwGDBAb07QWNaGMAmnTIemsYZCksjATwsA==}
 
+  destroy@1.2.0:
+    resolution: {integrity: sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg==}
+    engines: {node: '>= 0.8', npm: 1.2.8000 || >= 1.4.16}
+
   detect-libc@2.1.2:
     resolution: {integrity: sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==}
     engines: {node: '>=8'}
@@ -4443,6 +4632,10 @@ packages:
     resolution: {integrity: sha512-knvyeauYhqjOYvQ66MznSMs83wmHrCycNEN6Ao+2AeYEfxUIkuiVxdEa1qlGEPK+We3n0THiDciYSsCcgW/DoA==}
     engines: {node: '>=12.0.0'}
 
+  express@4.22.2:
+    resolution: {integrity: sha512-IuL+Elrou2ZvCFHs18/CIzy2Nzvo25nZ1/D2eIZlz7c+QUayAcYoiM2BthCjs+EBHVpjYjcuLDAiCWgeIX3X1Q==}
+    engines: {node: '>= 0.10.0'}
+
   express@5.2.1:
     resolution: {integrity: sha512-hIS4idWWai69NezIdRt2xFVofaF4j+6INOpJlVOLDO8zXGpUVEVzIYk12UUi2JzjEzWL3IOAxcTubgz9Po0yXw==}
     engines: {node: '>= 18'}
@@ -4519,6 +4712,10 @@ packages:
     resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==}
     engines: {node: '>=8'}
 
+  finalhandler@1.3.2:
+    resolution: {integrity: sha512-aA4RyPcd3badbdABGDuTXCMTtOneUCAYH/gxoYRTZlIJdF0YPWuGqiAsIrhNnnqdXGswYk6dGujem4w80UJFhg==}
+    engines: {node: '>= 0.8'}
+
   finalhandler@2.1.1:
     resolution: {integrity: sha512-S8KoZgRZN+a5rNwqTxlZZePjT/4cnm0ROV70LedRHZ0p8u9fRID0hJUZQpkKLzro8LfmC8sx23bY6tVNxv8pQA==}
     engines: {node: '>= 18.0.0'}
@@ -4572,6 +4769,10 @@ packages:
   fraction.js@5.3.4:
     resolution: {integrity: sha512-1X1NTtiJphryn/uLQz3whtY6jK3fTqoE3ohKs0tT+Ujr1W59oopxmoEh7Lu5p6vBaPbgoM0bzveAW4Qi5RyWDQ==}
 
+  fresh@0.5.2:
+    resolution: {integrity: sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==}
+    engines: {node: '>= 0.6'}
+
   fresh@2.0.0:
     resolution: {integrity: sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A==}
     engines: {node: '>= 0.8'}
@@ -4780,6 +4981,10 @@ packages:
     resolution: {integrity: sha512-AXcZb6vzzrFAUE61HnN4mpLqd/cSIwNQjtNWR0euPm6y0iqx3G4gOXaIDdtdDwZmhwe82LA6+zinmW4UBWVePQ==}
     engines: {node: '>=16.17.0'}
 
+  iconv-lite@0.4.24:
+    resolution: {integrity: sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==}
+    engines: {node: '>=0.10.0'}
+
   iconv-lite@0.6.3:
     resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==}
     engines: {node: '>=0.10.0'}
@@ -5236,6 +5441,10 @@ packages:
   mdn-data@2.27.1:
     resolution: {integrity: sha512-9Yubnt3e8A0OKwxYSXyhLymGW4sCufcLG6VdiDdUGVkPhpqLxlvP5vl1983gQjJl3tqbrM731mjaZaP68AgosQ==}
 
+  media-typer@0.3.0:
+    resolution: {integrity: sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==}
+    engines: {node: '>= 0.6'}
+
   media-typer@1.1.0:
     resolution: {integrity: sha512-aisnrDP4GNe06UcKFnV5bfMNPBUw4jsLGaWwWfnH3v02GnBuXX2MCVn5RbrWo0j3pczUilYblq7fQ7Nw2t5XKw==}
     engines: {node: '>= 0.8'}
@@ -5243,6 +5452,9 @@ packages:
   memory-cache@0.2.0:
     resolution: {integrity: sha512-OcjA+jzjOYzKmKS6IQVALHLVz+rNTMPoJvCztFaZxwG14wtAW7VRZjwTQu06vKCYOxh4jVnik7ya0SXTB0W+xA==}
 
+  merge-descriptors@1.0.3:
+    resolution: {integrity: sha512-gaNvAS7TZ897/rVaZ0nMtAyxNyi/pdbjbAwUpFQpN70GqnVfOiXpeUUMKRBmzXaSQ8DdTX4/0ms62r2K+hE6mQ==}
+
   merge-descriptors@2.0.0:
     resolution: {integrity: sha512-Snk314V5ayFLhp3fkUREub6WtjBfPdCPY1Ln8/8munuLuiYhsABgBVWsozAG+MWMbVEvcdcpbi9R7ww22l9Q3g==}
     engines: {node: '>=18'}
@@ -5254,6 +5466,10 @@ packages:
     resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
     engines: {node: '>= 8'}
 
+  methods@1.1.2:
+    resolution: {integrity: sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==}
+    engines: {node: '>= 0.6'}
+
   micromatch@4.0.8:
     resolution: {integrity: sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==}
     engines: {node: '>=8.6'}
@@ -5274,6 +5490,11 @@ packages:
     resolution: {integrity: sha512-Lbgzdk0h4juoQ9fCKXW4by0UJqj+nOOrI9MJ1sSj4nI8aI2eo1qmvQEie4VD1glsS250n15LsWsYtCugiStS5A==}
     engines: {node: '>=18'}
 
+  mime@1.6.0:
+    resolution: {integrity: sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==}
+    engines: {node: '>=4'}
+    hasBin: true
+
   mime@4.1.0:
     resolution: {integrity: sha512-X5ju04+cAzsojXKes0B/S4tcYtFAJ6tTMuSPBEn9CPGlrWr8Fiw7qYeLT0XyH80HSoAoqWCaz+MWKh22P7G1cw==}
     engines: {node: '>=16'}
@@ -5350,6 +5571,9 @@ packages:
     resolution: {integrity: sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ==}
     engines: {node: '>=10'}
 
+  ms@2.0.0:
+    resolution: {integrity: sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==}
+
   ms@2.1.3:
     resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
 
@@ -5377,6 +5601,10 @@ packages:
   natural-compare@1.4.0:
     resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
 
+  negotiator@0.6.3:
+    resolution: {integrity: sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==}
+    engines: {node: '>= 0.6'}
+
   negotiator@1.0.0:
     resolution: {integrity: sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg==}
     engines: {node: '>= 0.6'}
@@ -5660,6 +5888,9 @@ packages:
     resolution: {integrity: sha512-3O/iVVsJAPsOnpwWIeD+d6z/7PmqApyQePUtCndjatj/9I5LylHvt5qluFaBT3I5h3r1ejfR056c+FCv+NnNXg==}
     engines: {node: 18 || 20 || >=22}
 
+  path-to-regexp@0.1.13:
+    resolution: {integrity: sha512-A/AGNMFN3c8bOlvV9RreMdrv7jsmF9XIfDeCd87+I8RNg6s78BhJxMu69NEMHBSJFxKidViTEdruRwEk/WIKqA==}
+
   path-to-regexp@8.4.2:
     resolution: {integrity: sha512-qRcuIdP69NPm4qbACK+aDogI5CBDMi1jKe0ry5rSQJz8JVLsC7jV8XpiJjGRLLol3N+R5ihGYcrPLTno6pAdBA==}
 
@@ -5970,6 +6201,10 @@ packages:
     resolution: {integrity: sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==}
     engines: {node: '>= 0.6'}
 
+  raw-body@2.5.3:
+    resolution: {integrity: sha512-s4VSOf6yN0rvbRZGxs8Om5CWj6seneMwK3oDb4lWDH0UPhWcxwOWw5+qk24bxq87szX1ydrwylIOp2uG1ojUpA==}
+    engines: {node: '>= 0.8'}
+
   raw-body@3.0.2:
     resolution: {integrity: sha512-K5zQjDllxWkf7Z5xJdV0/B0WTNqx6vxG70zJE4N0kBs4LovmEYWJzQGxC9bS9RAKu3bgM40lrd5zoLJ12MQ5BA==}
     engines: {node: '>= 0.10'}
@@ -5988,6 +6223,10 @@ packages:
   react-is@17.0.2:
     resolution: {integrity: sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==}
 
+  react-refresh@0.17.0:
+    resolution: {integrity: sha512-z6F7K9bV85EfseRCp2bzrpyQ0Gkw1uLoCel9XBVWPg/TjRj94SkJzUTGfOa4bs7iJvBWtQG0Wq7wnI0syw3EBQ==}
+    engines: {node: '>=0.10.0'}
+
   react-router@7.15.1:
     resolution: {integrity: sha512-R8rl9HhgikFYoPJymnUtPXWbnDb3oget6lQnfIoupbt61aT9aOhRkDsY2XRhZRyX1Z/8a5sL74fXmFNm3NRK5A==}
     engines: {node: '>=20.0.0'}
@@ -6201,6 +6440,10 @@ packages:
     engines: {node: '>=10'}
     hasBin: true
 
+  send@0.19.2:
+    resolution: {integrity: sha512-VMbMxbDeehAxpOtWJXlcUS5E8iXh6QmN+BkRX1GARS3wRaXEEgzCcB10gTQazO42tpNIya8xIyNx8fll1OFPrg==}
+    engines: {node: '>= 0.8.0'}
+
   send@1.2.1:
     resolution: {integrity: sha512-1gnZf7DFcoIcajTjTwjwuDjzuz4PPcY2StKPlsGAQ1+YH20IRVrBaXSWmdjowTJ6u8Rc01PoYOGHXfP1mYcZNQ==}
     engines: {node: '>= 18'}
@@ -6222,6 +6465,10 @@ packages:
   serve-placeholder@2.0.2:
     resolution: {integrity: sha512-/TMG8SboeiQbZJWRlfTCqMs2DD3SZgWp0kDQePz9yUuCnDfDh/92gf7/PxGhzXTKBIPASIHxFcZndoNbp6QOLQ==}
 
+  serve-static@1.16.3:
+    resolution: {integrity: sha512-x0RTqQel6g5SY7Lg6ZreMmsOzncHFU7nhnRWkKgWuMTu5NN0DR5oruckMqRvacAN9d5w6ARnRBXl9xhDCgfMeA==}
+    engines: {node: '>= 0.8.0'}
+
   serve-static@2.2.1:
     resolution: {integrity: sha512-xRXBn0pPqQTVQiC8wyQrKs2MOlX24zQ0POGaj0kultvoOCstBQM5yvOhAVSUwOMjQtTvsPWoNCHfPGwaaQJhTw==}
     engines: {node: '>= 18'}
@@ -6613,6 +6860,10 @@ packages:
     resolution: {integrity: sha512-1URUxUqfHFM1c+zfSPsa3gnkO7Aq21qyH75SIduNYz4SzY964rn1X2vCMQaHSHhktiw+0kPa2iyb6PUpXqB6Vg==}
     engines: {node: '>=20'}
 
+  type-is@1.6.18:
+    resolution: {integrity: sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==}
+    engines: {node: '>= 0.6'}
+
   type-is@2.1.0:
     resolution: {integrity: sha512-faYHw0anBbc/kWF3zFTEnxSFOAGUX9GFbOBthvDdLsIlEoWOFOtS0zgCiQYwIskL9iGXZL3kAXD8OoZ4GmMATA==}
     engines: {node: '>= 18'}
@@ -6831,6 +7082,10 @@ packages:
   util-deprecate@1.0.2:
     resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
 
+  utils-merge@1.0.1:
+    resolution: {integrity: sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA==}
+    engines: {node: '>= 0.4.0'}
+
   uuid@11.1.1:
     resolution: {integrity: sha512-vIYxrBCC/N/K+Js3qSN88go7kIfNPssr/hHCesKCQNAjmgvYS2oqr69kIufEG+O4+PfezOH4EbIeHCfFov8ZgQ==}
     hasBin: true
@@ -7444,6 +7699,16 @@ snapshots:
       '@babel/core': 7.29.7
       '@babel/helper-plugin-utils': 7.29.7
 
+  '@babel/plugin-transform-react-jsx-self@7.29.7(@babel/core@7.29.7)':
+    dependencies:
+      '@babel/core': 7.29.7
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-react-jsx-source@7.29.7(@babel/core@7.29.7)':
+    dependencies:
+      '@babel/core': 7.29.7
+      '@babel/helper-plugin-utils': 7.29.7
+
   '@babel/plugin-transform-typescript@7.29.7(@babel/core@7.29.7)':
     dependencies:
       '@babel/core': 7.29.7
@@ -8500,6 +8765,74 @@ snapshots:
       - uploadthing
       - xml2js
 
+  '@nuxt/nitro-server@3.21.7(db0@0.3.4)(ioredis@5.11.1)(magicast@0.5.3)(nuxt@3.21.7(@parcel/watcher@2.5.6)(@types/node@24.7.2)(@vue/compiler-sfc@3.5.38)(cac@6.7.14)(db0@0.3.4)(eslint@9.39.4(jiti@2.7.0))(ioredis@5.11.1)(magicast@0.5.3)(optionator@0.9.4)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup-plugin-visualizer@7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2))(rollup@4.62.2)(terser@5.48.0)(typescript@5.9.3)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(yaml@2.9.0))(oxc-parser@0.132.0)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(typescript@5.9.3)':
+    dependencies:
+      '@nuxt/devalue': 2.0.2
+      '@nuxt/kit': 3.21.7(magicast@0.5.3)
+      '@unhead/vue': 2.1.15(vue@3.5.38(typescript@5.9.3))
+      '@vue/shared': 3.5.38
+      consola: 3.4.2
+      defu: 6.1.7
+      destr: 2.0.5
+      devalue: 5.8.1
+      errx: 0.1.0
+      escape-string-regexp: 5.0.0
+      exsolve: 1.0.8
+      h3: 1.15.11
+      impound: 1.1.5
+      klona: 2.0.6
+      mocked-exports: 0.1.1
+      nitropack: 2.13.4(oxc-parser@0.132.0)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))
+      nuxt: 3.21.7(@parcel/watcher@2.5.6)(@types/node@24.7.2)(@vue/compiler-sfc@3.5.38)(cac@6.7.14)(db0@0.3.4)(eslint@9.39.4(jiti@2.7.0))(ioredis@5.11.1)(magicast@0.5.3)(optionator@0.9.4)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup-plugin-visualizer@7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2))(rollup@4.62.2)(terser@5.48.0)(typescript@5.9.3)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(yaml@2.9.0)
+      ohash: 2.0.11
+      pathe: 2.0.3
+      pkg-types: 2.3.1
+      rou3: 0.8.1
+      std-env: 4.1.0
+      ufo: 1.6.4
+      unctx: 2.5.0
+      unstorage: 1.17.5(db0@0.3.4)(ioredis@5.11.1)
+      vue: 3.5.38(typescript@5.9.3)
+      vue-bundle-renderer: 2.2.0
+      vue-devtools-stub: 0.1.0
+    transitivePeerDependencies:
+      - '@azure/app-configuration'
+      - '@azure/cosmos'
+      - '@azure/data-tables'
+      - '@azure/identity'
+      - '@azure/keyvault-secrets'
+      - '@azure/storage-blob'
+      - '@capacitor/preferences'
+      - '@deno/kv'
+      - '@electric-sql/pglite'
+      - '@libsql/client'
+      - '@netlify/blobs'
+      - '@planetscale/database'
+      - '@upstash/redis'
+      - '@vercel/blob'
+      - '@vercel/functions'
+      - '@vercel/kv'
+      - aws4fetch
+      - bare-abort-controller
+      - bare-buffer
+      - better-sqlite3
+      - db0
+      - drizzle-orm
+      - encoding
+      - idb-keyval
+      - ioredis
+      - magicast
+      - mysql2
+      - oxc-parser
+      - react-native-b4a
+      - rolldown
+      - sqlite3
+      - srvx
+      - supports-color
+      - typescript
+      - uploadthing
+      - xml2js
+
   '@nuxt/schema@3.21.7':
     dependencies:
       '@vue/shared': 3.5.38
@@ -8517,7 +8850,7 @@ snapshots:
       rc9: 3.0.1
       std-env: 4.1.0
 
-  '@nuxt/test-utils@3.17.2(@playwright/test@1.60.0)(@types/node@24.7.2)(@vue/test-utils@2.4.6)(jiti@2.7.0)(magicast@0.5.3)(playwright-core@1.60.0)(terser@5.48.0)(typescript@5.9.3)(vitest@4.1.8)(yaml@2.9.0)':
+  '@nuxt/test-utils@3.17.2(@playwright/test@1.60.0)(@types/node@24.7.2)(@vue/test-utils@2.4.6)(jiti@2.7.0)(jsdom@27.0.1)(magicast@0.5.3)(playwright-core@1.60.0)(terser@5.48.0)(typescript@5.9.3)(vitest@4.1.8)(yaml@2.9.0)':
     dependencies:
       '@nuxt/kit': 3.21.7(magicast@0.5.3)
       '@nuxt/schema': 3.21.7
@@ -8543,13 +8876,14 @@ snapshots:
       ufo: 1.6.4
       unplugin: 2.3.11
       vite: 6.4.3(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
-      vitest-environment-nuxt: 1.0.1(@playwright/test@1.60.0)(@types/node@24.7.2)(@vue/test-utils@2.4.6)(jiti@2.7.0)(magicast@0.5.3)(playwright-core@1.60.0)(terser@5.48.0)(typescript@5.9.3)(vitest@4.1.8)(yaml@2.9.0)
+      vitest-environment-nuxt: 1.0.1(@playwright/test@1.60.0)(@types/node@24.7.2)(@vue/test-utils@2.4.6)(jiti@2.7.0)(jsdom@27.0.1)(magicast@0.5.3)(playwright-core@1.60.0)(terser@5.48.0)(typescript@5.9.3)(vitest@4.1.8)(yaml@2.9.0)
       vue: 3.5.30(typescript@5.9.3)
     optionalDependencies:
       '@playwright/test': 1.60.0
       '@vue/test-utils': 2.4.6
+      jsdom: 27.0.1
       playwright-core: 1.60.0
-      vitest: 4.1.8(@types/node@24.7.2)(@vitest/browser-playwright@4.1.8)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))
+      vitest: 4.1.8(@types/node@24.7.2)(@vitest/browser-playwright@4.1.8)(jsdom@27.0.1)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))
     transitivePeerDependencies:
       - '@types/node'
       - jiti
@@ -8628,6 +8962,69 @@ snapshots:
       - vue-tsc
       - yaml
 
+  '@nuxt/vite-builder@3.21.7(@types/node@24.7.2)(eslint@9.39.4(jiti@2.7.0))(magicast@0.5.3)(nuxt@3.21.7(@parcel/watcher@2.5.6)(@types/node@24.7.2)(@vue/compiler-sfc@3.5.38)(cac@6.7.14)(db0@0.3.4)(eslint@9.39.4(jiti@2.7.0))(ioredis@5.11.1)(magicast@0.5.3)(optionator@0.9.4)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup-plugin-visualizer@7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2))(rollup@4.62.2)(terser@5.48.0)(typescript@5.9.3)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(yaml@2.9.0))(optionator@0.9.4)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup-plugin-visualizer@7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2))(rollup@4.62.2)(terser@5.48.0)(typescript@5.9.3)(vue@3.5.38(typescript@5.9.3))(yaml@2.9.0)':
+    dependencies:
+      '@nuxt/kit': 3.21.7(magicast@0.5.3)
+      '@rollup/plugin-replace': 6.0.3(rollup@4.62.2)
+      '@vitejs/plugin-vue': 6.0.7(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(vue@3.5.38(typescript@5.9.3))
+      '@vitejs/plugin-vue-jsx': 5.1.5(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(vue@3.5.38(typescript@5.9.3))
+      autoprefixer: 10.5.0(postcss@8.5.15)
+      consola: 3.4.2
+      cssnano: 7.1.9(postcss@8.5.15)
+      defu: 6.1.7
+      escape-string-regexp: 5.0.0
+      exsolve: 1.0.8
+      externality: 1.0.2
+      get-port-please: 3.2.0
+      jiti: 2.7.0
+      knitwork: 1.3.0
+      magic-string: 0.30.21
+      mlly: 1.8.2
+      mocked-exports: 0.1.1
+      nuxt: 3.21.7(@parcel/watcher@2.5.6)(@types/node@24.7.2)(@vue/compiler-sfc@3.5.38)(cac@6.7.14)(db0@0.3.4)(eslint@9.39.4(jiti@2.7.0))(ioredis@5.11.1)(magicast@0.5.3)(optionator@0.9.4)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup-plugin-visualizer@7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2))(rollup@4.62.2)(terser@5.48.0)(typescript@5.9.3)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(yaml@2.9.0)
+      nypm: 0.6.7
+      ohash: 2.0.11
+      pathe: 2.0.3
+      perfect-debounce: 2.1.0
+      pkg-types: 2.3.1
+      postcss: 8.5.15
+      seroval: 1.5.4
+      std-env: 4.1.0
+      ufo: 1.6.4
+      unenv: 2.0.0-rc.24
+      vite: 7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
+      vite-node: 5.3.0(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
+      vite-plugin-checker: 0.13.0(eslint@9.39.4(jiti@2.7.0))(optionator@0.9.4)(typescript@5.9.3)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))
+      vue: 3.5.38(typescript@5.9.3)
+      vue-bundle-renderer: 2.2.0
+    optionalDependencies:
+      rolldown: 1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1)
+      rollup-plugin-visualizer: 7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2)
+    transitivePeerDependencies:
+      - '@biomejs/biome'
+      - '@types/node'
+      - eslint
+      - less
+      - lightningcss
+      - magicast
+      - meow
+      - optionator
+      - oxlint
+      - rollup
+      - sass
+      - sass-embedded
+      - stylelint
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+      - tsx
+      - typescript
+      - vls
+      - vti
+      - vue-tsc
+      - yaml
+
   '@nx/nx-darwin-arm64@22.7.5':
     optional: true
 
@@ -8999,6 +9396,8 @@ snapshots:
   '@rolldown/binding-win32-x64-msvc@1.0.0-beta.45':
     optional: true
 
+  '@rolldown/pluginutils@1.0.0-beta.27': {}
+
   '@rolldown/pluginutils@1.0.0-beta.45': {}
 
   '@rolldown/pluginutils@1.0.1': {}
@@ -9273,10 +9672,31 @@ snapshots:
 
   '@types/aria-query@5.0.4': {}
 
-  '@types/body-parser@1.19.6':
+  '@types/babel__core@7.20.5':
+    dependencies:
+      '@babel/parser': 7.29.7
+      '@babel/types': 7.29.7
+      '@types/babel__generator': 7.27.0
+      '@types/babel__template': 7.4.4
+      '@types/babel__traverse': 7.28.0
+
+  '@types/babel__generator@7.27.0':
+    dependencies:
+      '@babel/types': 7.29.7
+
+  '@types/babel__template@7.4.4':
+    dependencies:
+      '@babel/parser': 7.29.7
+      '@babel/types': 7.29.7
+
+  '@types/babel__traverse@7.28.0':
+    dependencies:
+      '@babel/types': 7.29.7
+
+  '@types/body-parser@1.19.6':
     dependencies:
       '@types/connect': 3.4.38
-      '@types/node': 22.15.3
+      '@types/node': 24.7.2
 
   '@types/chai@5.2.3':
     dependencies:
@@ -9285,7 +9705,7 @@ snapshots:
 
   '@types/connect@3.4.38':
     dependencies:
-      '@types/node': 22.15.3
+      '@types/node': 24.7.2
 
   '@types/cookie-parser@1.4.10(@types/express@5.0.6)':
     dependencies:
@@ -9299,7 +9719,7 @@ snapshots:
 
   '@types/express-serve-static-core@5.1.1':
     dependencies:
-      '@types/node': 22.15.3
+      '@types/node': 24.7.2
       '@types/qs': 6.15.1
       '@types/range-parser': 1.2.7
       '@types/send': 1.2.1
@@ -9342,12 +9762,12 @@ snapshots:
 
   '@types/send@1.2.1':
     dependencies:
-      '@types/node': 22.15.3
+      '@types/node': 24.7.2
 
   '@types/serve-static@2.2.0':
     dependencies:
       '@types/http-errors': 2.0.5
-      '@types/node': 22.15.3
+      '@types/node': 24.7.2
 
   '@types/trusted-types@2.0.7':
     optional: true
@@ -9382,8 +9802,8 @@ snapshots:
 
   '@typescript-eslint/project-service@8.57.2(typescript@5.9.3)':
     dependencies:
-      '@typescript-eslint/tsconfig-utils': 8.57.2(typescript@5.9.3)
-      '@typescript-eslint/types': 8.57.2
+      '@typescript-eslint/tsconfig-utils': 8.61.1(typescript@5.9.3)
+      '@typescript-eslint/types': 8.61.1
       debug: 4.4.3
       typescript: 5.9.3
     transitivePeerDependencies:
@@ -9589,6 +10009,18 @@ snapshots:
       - rollup
       - supports-color
 
+  '@vitejs/plugin-react@4.7.0(vite@6.4.3(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))':
+    dependencies:
+      '@babel/core': 7.29.7
+      '@babel/plugin-transform-react-jsx-self': 7.29.7(@babel/core@7.29.7)
+      '@babel/plugin-transform-react-jsx-source': 7.29.7(@babel/core@7.29.7)
+      '@rolldown/pluginutils': 1.0.0-beta.27
+      '@types/babel__core': 7.20.5
+      react-refresh: 0.17.0
+      vite: 6.4.3(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
+    transitivePeerDependencies:
+      - supports-color
+
   '@vitejs/plugin-vue-jsx@5.1.5(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(vue@3.5.38(typescript@5.9.3))':
     dependencies:
       '@babel/core': 7.29.7
@@ -9601,6 +10033,11 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@vitejs/plugin-vue@5.2.4(vite@6.4.3(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(vue@3.5.30(typescript@5.9.3))':
+    dependencies:
+      vite: 6.4.3(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
+      vue: 3.5.30(typescript@5.9.3)
+
   '@vitejs/plugin-vue@6.0.7(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(vue@3.5.38(typescript@5.9.3))':
     dependencies:
       '@rolldown/pluginutils': 1.0.1
@@ -9969,6 +10406,11 @@ snapshots:
     dependencies:
       event-target-shim: 5.0.1
 
+  accepts@1.3.8:
+    dependencies:
+      mime-types: 2.1.35
+      negotiator: 0.6.3
+
   accepts@2.0.0:
     dependencies:
       mime-types: 3.0.2
@@ -10053,6 +10495,8 @@ snapshots:
       call-bound: 1.0.4
       is-array-buffer: 3.0.5
 
+  array-flatten@1.1.1: {}
+
   array-includes@3.1.9:
     dependencies:
       call-bind: 1.0.9
@@ -10227,6 +10671,23 @@ snapshots:
       inherits: 2.0.4
       readable-stream: 3.6.2
 
+  body-parser@1.20.5:
+    dependencies:
+      bytes: 3.1.2
+      content-type: 1.0.5
+      debug: 2.6.9
+      depd: 2.0.0
+      destroy: 1.2.0
+      http-errors: 2.0.1
+      iconv-lite: 0.4.24
+      on-finished: 2.4.1
+      qs: 6.15.2
+      raw-body: 2.5.3
+      type-is: 1.6.18
+      unpipe: 1.0.0
+    transitivePeerDependencies:
+      - supports-color
+
   body-parser@2.3.0:
     dependencies:
       bytes: 3.1.2
@@ -10442,6 +10903,10 @@ snapshots:
 
   consola@3.4.2: {}
 
+  content-disposition@0.5.4:
+    dependencies:
+      safe-buffer: 5.2.1
+
   content-disposition@1.1.0: {}
 
   content-type@1.0.5: {}
@@ -10458,6 +10923,15 @@ snapshots:
 
   cookie-es@3.1.1: {}
 
+  cookie-parser@1.4.7:
+    dependencies:
+      cookie: 0.7.2
+      cookie-signature: 1.0.6
+
+  cookie-signature@1.0.6: {}
+
+  cookie-signature@1.0.7: {}
+
   cookie-signature@1.2.2: {}
 
   cookie@0.7.2: {}
@@ -10619,6 +11093,10 @@ snapshots:
 
   db0@0.3.4: {}
 
+  debug@2.6.9:
+    dependencies:
+      ms: 2.0.0
+
   debug@4.4.3:
     dependencies:
       ms: 2.1.3
@@ -10670,6 +11148,8 @@ snapshots:
 
   destr@2.0.5: {}
 
+  destroy@1.2.0: {}
+
   detect-libc@2.1.2: {}
 
   devalue@5.8.1: {}
@@ -11222,6 +11702,42 @@ snapshots:
 
   expect-type@1.3.0: {}
 
+  express@4.22.2:
+    dependencies:
+      accepts: 1.3.8
+      array-flatten: 1.1.1
+      body-parser: 1.20.5
+      content-disposition: 0.5.4
+      content-type: 1.0.5
+      cookie: 0.7.2
+      cookie-signature: 1.0.7
+      debug: 2.6.9
+      depd: 2.0.0
+      encodeurl: 2.0.0
+      escape-html: 1.0.3
+      etag: 1.8.1
+      finalhandler: 1.3.2
+      fresh: 0.5.2
+      http-errors: 2.0.1
+      merge-descriptors: 1.0.3
+      methods: 1.1.2
+      on-finished: 2.4.1
+      parseurl: 1.3.3
+      path-to-regexp: 0.1.13
+      proxy-addr: 2.0.7
+      qs: 6.15.2
+      range-parser: 1.2.1
+      safe-buffer: 5.2.1
+      send: 0.19.2
+      serve-static: 1.16.3
+      setprototypeof: 1.2.0
+      statuses: 2.0.2
+      type-is: 1.6.18
+      utils-merge: 1.0.1
+      vary: 1.1.2
+    transitivePeerDependencies:
+      - supports-color
+
   express@5.2.1:
     dependencies:
       accepts: 2.0.0
@@ -11320,6 +11836,18 @@ snapshots:
     dependencies:
       to-regex-range: 5.0.1
 
+  finalhandler@1.3.2:
+    dependencies:
+      debug: 2.6.9
+      encodeurl: 2.0.0
+      escape-html: 1.0.3
+      on-finished: 2.4.1
+      parseurl: 1.3.3
+      statuses: 2.0.2
+      unpipe: 1.0.0
+    transitivePeerDependencies:
+      - supports-color
+
   finalhandler@2.1.1:
     dependencies:
       debug: 4.4.3
@@ -11376,6 +11904,8 @@ snapshots:
 
   fraction.js@5.3.4: {}
 
+  fresh@0.5.2: {}
+
   fresh@2.0.0: {}
 
   fs-constants@1.0.0: {}
@@ -11592,6 +12122,10 @@ snapshots:
 
   human-signals@5.0.0: {}
 
+  iconv-lite@0.4.24:
+    dependencies:
+      safer-buffer: 2.1.2
+
   iconv-lite@0.6.3:
     dependencies:
       safer-buffer: 2.1.2
@@ -12056,16 +12590,22 @@ snapshots:
 
   mdn-data@2.27.1: {}
 
+  media-typer@0.3.0: {}
+
   media-typer@1.1.0: {}
 
   memory-cache@0.2.0: {}
 
+  merge-descriptors@1.0.3: {}
+
   merge-descriptors@2.0.0: {}
 
   merge-stream@2.0.0: {}
 
   merge2@1.4.1: {}
 
+  methods@1.1.2: {}
+
   micromatch@4.0.8:
     dependencies:
       braces: 3.0.3
@@ -12083,6 +12623,8 @@ snapshots:
     dependencies:
       mime-db: 1.54.0
 
+  mime@1.6.0: {}
+
   mime@4.1.0: {}
 
   mimic-fn@2.1.0: {}
@@ -12150,6 +12692,8 @@ snapshots:
 
   mrmime@2.0.1: {}
 
+  ms@2.0.0: {}
+
   ms@2.1.3: {}
 
   muggle-string@0.4.1: {}
@@ -12164,6 +12708,8 @@ snapshots:
 
   natural-compare@1.4.0: {}
 
+  negotiator@0.6.3: {}
+
   negotiator@1.0.0: {}
 
   next@15.5.18(@playwright/test@1.60.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3):
@@ -12295,6 +12841,111 @@ snapshots:
       - supports-color
       - uploadthing
 
+  nitropack@2.13.4(oxc-parser@0.132.0)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1)):
+    dependencies:
+      '@cloudflare/kv-asset-handler': 0.4.2
+      '@rollup/plugin-alias': 6.0.0(rollup@4.62.2)
+      '@rollup/plugin-commonjs': 29.0.3(rollup@4.62.2)
+      '@rollup/plugin-inject': 5.0.5(rollup@4.62.2)
+      '@rollup/plugin-json': 6.1.0(rollup@4.62.2)
+      '@rollup/plugin-node-resolve': 16.0.3(rollup@4.62.2)
+      '@rollup/plugin-replace': 6.0.3(rollup@4.62.2)
+      '@rollup/plugin-terser': 1.0.0(rollup@4.62.2)
+      '@vercel/nft': 1.10.2(rollup@4.62.2)
+      archiver: 7.0.1
+      c12: 3.3.4(magicast@0.5.3)
+      chokidar: 5.0.0
+      citty: 0.2.2
+      compatx: 0.2.0
+      confbox: 0.2.4
+      consola: 3.4.2
+      cookie-es: 2.0.1
+      croner: 10.0.1
+      crossws: 0.3.5
+      db0: 0.3.4
+      defu: 6.1.7
+      destr: 2.0.5
+      dot-prop: 10.1.0
+      esbuild: 0.28.1
+      escape-string-regexp: 5.0.0
+      etag: 1.8.1
+      exsolve: 1.0.8
+      globby: 16.2.0
+      gzip-size: 7.0.0
+      h3: 1.15.11
+      hookable: 5.5.3
+      httpxy: 0.5.3
+      ioredis: 5.11.1
+      jiti: 2.7.0
+      klona: 2.0.6
+      knitwork: 1.3.0
+      listhen: 1.10.0(srvx@0.11.17)
+      magic-string: 0.30.21
+      magicast: 0.5.3
+      mime: 4.1.0
+      mlly: 1.8.2
+      node-fetch-native: 1.6.7
+      node-mock-http: 1.0.4
+      ofetch: 1.5.1
+      ohash: 2.0.11
+      pathe: 2.0.3
+      perfect-debounce: 2.1.0
+      pkg-types: 2.3.1
+      pretty-bytes: 7.1.0
+      radix3: 1.1.2
+      rollup: 4.62.2
+      rollup-plugin-visualizer: 7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2)
+      scule: 1.3.0
+      semver: 7.8.5
+      serve-placeholder: 2.0.2
+      serve-static: 2.2.1
+      source-map: 0.7.6
+      std-env: 4.1.0
+      ufo: 1.6.4
+      ultrahtml: 1.6.0
+      uncrypto: 0.1.3
+      unctx: 2.5.0
+      unenv: 2.0.0-rc.24
+      unimport: 6.3.0(oxc-parser@0.132.0)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))
+      unplugin-utils: 0.3.1
+      unstorage: 1.17.5(db0@0.3.4)(ioredis@5.11.1)
+      untyped: 2.0.0
+      unwasm: 0.5.3
+      youch: 4.1.1
+      youch-core: 0.3.3
+    transitivePeerDependencies:
+      - '@azure/app-configuration'
+      - '@azure/cosmos'
+      - '@azure/data-tables'
+      - '@azure/identity'
+      - '@azure/keyvault-secrets'
+      - '@azure/storage-blob'
+      - '@capacitor/preferences'
+      - '@deno/kv'
+      - '@electric-sql/pglite'
+      - '@libsql/client'
+      - '@netlify/blobs'
+      - '@planetscale/database'
+      - '@upstash/redis'
+      - '@vercel/blob'
+      - '@vercel/functions'
+      - '@vercel/kv'
+      - aws4fetch
+      - bare-abort-controller
+      - bare-buffer
+      - better-sqlite3
+      - drizzle-orm
+      - encoding
+      - idb-keyval
+      - mysql2
+      - oxc-parser
+      - react-native-b4a
+      - rolldown
+      - sqlite3
+      - srvx
+      - supports-color
+      - uploadthing
+
   node-addon-api@7.1.1: {}
 
   node-exports-info@1.6.0:
@@ -12471,6 +13122,132 @@ snapshots:
       - xml2js
       - yaml
 
+  nuxt@3.21.7(@parcel/watcher@2.5.6)(@types/node@24.7.2)(@vue/compiler-sfc@3.5.38)(cac@6.7.14)(db0@0.3.4)(eslint@9.39.4(jiti@2.7.0))(ioredis@5.11.1)(magicast@0.5.3)(optionator@0.9.4)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup-plugin-visualizer@7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2))(rollup@4.62.2)(terser@5.48.0)(typescript@5.9.3)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(yaml@2.9.0):
+    dependencies:
+      '@dxup/nuxt': 0.4.1(magicast@0.5.3)(typescript@5.9.3)
+      '@nuxt/cli': 3.36.0(@nuxt/schema@3.21.7)(cac@6.7.14)(magicast@0.5.3)
+      '@nuxt/devtools': 3.2.4(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(vue@3.5.38(typescript@5.9.3))
+      '@nuxt/kit': 3.21.7(magicast@0.5.3)
+      '@nuxt/nitro-server': 3.21.7(db0@0.3.4)(ioredis@5.11.1)(magicast@0.5.3)(nuxt@3.21.7(@parcel/watcher@2.5.6)(@types/node@24.7.2)(@vue/compiler-sfc@3.5.38)(cac@6.7.14)(db0@0.3.4)(eslint@9.39.4(jiti@2.7.0))(ioredis@5.11.1)(magicast@0.5.3)(optionator@0.9.4)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup-plugin-visualizer@7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2))(rollup@4.62.2)(terser@5.48.0)(typescript@5.9.3)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(yaml@2.9.0))(oxc-parser@0.132.0)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(typescript@5.9.3)
+      '@nuxt/schema': 3.21.7
+      '@nuxt/telemetry': 2.8.0(@nuxt/kit@3.21.7(magicast@0.5.3))
+      '@nuxt/vite-builder': 3.21.7(@types/node@24.7.2)(eslint@9.39.4(jiti@2.7.0))(magicast@0.5.3)(nuxt@3.21.7(@parcel/watcher@2.5.6)(@types/node@24.7.2)(@vue/compiler-sfc@3.5.38)(cac@6.7.14)(db0@0.3.4)(eslint@9.39.4(jiti@2.7.0))(ioredis@5.11.1)(magicast@0.5.3)(optionator@0.9.4)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup-plugin-visualizer@7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2))(rollup@4.62.2)(terser@5.48.0)(typescript@5.9.3)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(yaml@2.9.0))(optionator@0.9.4)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup-plugin-visualizer@7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2))(rollup@4.62.2)(terser@5.48.0)(typescript@5.9.3)(vue@3.5.38(typescript@5.9.3))(yaml@2.9.0)
+      '@unhead/vue': 2.1.15(vue@3.5.38(typescript@5.9.3))
+      '@vue/shared': 3.5.38
+      c12: 3.3.4(magicast@0.5.3)
+      chokidar: 5.0.0
+      compatx: 0.2.0
+      consola: 3.4.2
+      cookie-es: 2.0.1
+      defu: 6.1.7
+      destr: 2.0.5
+      devalue: 5.8.1
+      errx: 0.1.0
+      escape-string-regexp: 5.0.0
+      exsolve: 1.0.8
+      h3: 1.15.11
+      hookable: 5.5.3
+      ignore: 7.0.5
+      impound: 1.1.5
+      jiti: 2.7.0
+      klona: 2.0.6
+      knitwork: 1.3.0
+      magic-string: 0.30.21
+      mlly: 1.8.2
+      nanotar: 0.3.0
+      nypm: 0.6.7
+      ofetch: 1.5.1
+      ohash: 2.0.11
+      on-change: 6.0.2
+      oxc-minify: 0.132.0
+      oxc-parser: 0.132.0
+      oxc-transform: 0.132.0
+      oxc-walker: 1.0.0(oxc-parser@0.132.0)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))
+      pathe: 2.0.3
+      perfect-debounce: 2.1.0
+      pkg-types: 2.3.1
+      rou3: 0.8.1
+      scule: 1.3.0
+      semver: 7.8.5
+      std-env: 4.1.0
+      tinyglobby: 0.2.17
+      ufo: 1.6.4
+      ultrahtml: 1.6.0
+      uncrypto: 0.1.3
+      unctx: 2.5.0
+      unimport: 6.3.0(oxc-parser@0.132.0)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))
+      unplugin: 3.0.0
+      unplugin-vue-router: 0.19.2(@vue/compiler-sfc@3.5.38)(vue-router@4.6.4(vue@3.5.38(typescript@5.9.3)))(vue@3.5.38(typescript@5.9.3))
+      untyped: 2.0.0
+      vue: 3.5.38(typescript@5.9.3)
+      vue-router: 4.6.4(vue@3.5.38(typescript@5.9.3))
+    optionalDependencies:
+      '@parcel/watcher': 2.5.6
+      '@types/node': 24.7.2
+    transitivePeerDependencies:
+      - '@azure/app-configuration'
+      - '@azure/cosmos'
+      - '@azure/data-tables'
+      - '@azure/identity'
+      - '@azure/keyvault-secrets'
+      - '@azure/storage-blob'
+      - '@biomejs/biome'
+      - '@capacitor/preferences'
+      - '@deno/kv'
+      - '@electric-sql/pglite'
+      - '@libsql/client'
+      - '@netlify/blobs'
+      - '@planetscale/database'
+      - '@upstash/redis'
+      - '@vercel/blob'
+      - '@vercel/functions'
+      - '@vercel/kv'
+      - '@vitejs/devtools'
+      - '@vue/compiler-sfc'
+      - aws4fetch
+      - bare-abort-controller
+      - bare-buffer
+      - better-sqlite3
+      - bufferutil
+      - cac
+      - commander
+      - db0
+      - drizzle-orm
+      - encoding
+      - eslint
+      - idb-keyval
+      - ioredis
+      - less
+      - lightningcss
+      - magicast
+      - meow
+      - mysql2
+      - optionator
+      - oxlint
+      - react-native-b4a
+      - rolldown
+      - rollup
+      - rollup-plugin-visualizer
+      - sass
+      - sass-embedded
+      - sqlite3
+      - srvx
+      - stylelint
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+      - tsx
+      - typescript
+      - uploadthing
+      - utf-8-validate
+      - vite
+      - vls
+      - vti
+      - vue-tsc
+      - xml2js
+      - yaml
+
   nx@22.7.5:
     dependencies:
       '@emnapi/core': 1.4.5
@@ -12788,6 +13565,13 @@ snapshots:
       oxc-parser: 0.132.0
       rolldown: 1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.10.0)
 
+  oxc-walker@1.0.0(oxc-parser@0.132.0)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1)):
+    dependencies:
+      magic-regexp: 0.11.0
+    optionalDependencies:
+      oxc-parser: 0.132.0
+      rolldown: 1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1)
+
   p-limit@3.1.0:
     dependencies:
       yocto-queue: 0.1.0
@@ -12835,6 +13619,8 @@ snapshots:
       lru-cache: 11.5.1
       minipass: 7.1.3
 
+  path-to-regexp@0.1.13: {}
+
   path-to-regexp@8.4.2: {}
 
   path-type@4.0.0: {}
@@ -13114,6 +13900,13 @@ snapshots:
 
   range-parser@1.2.1: {}
 
+  raw-body@2.5.3:
+    dependencies:
+      bytes: 3.1.2
+      http-errors: 2.0.1
+      iconv-lite: 0.4.24
+      unpipe: 1.0.0
+
   raw-body@3.0.2:
     dependencies:
       bytes: 3.1.2
@@ -13135,6 +13928,8 @@ snapshots:
 
   react-is@17.0.2: {}
 
+  react-refresh@0.17.0: {}
+
   react-router@7.15.1(react-dom@19.2.3(react@19.2.3))(react@19.2.3):
     dependencies:
       cookie: 1.1.1
@@ -13317,6 +14112,16 @@ snapshots:
       rolldown: 1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.10.0)
       rollup: 4.62.2
 
+  rollup-plugin-visualizer@7.0.1(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1))(rollup@4.62.2):
+    dependencies:
+      open: 11.0.0
+      picomatch: 4.0.4
+      source-map: 0.7.6
+      yargs: 18.0.0
+    optionalDependencies:
+      rolldown: 1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1)
+      rollup: 4.62.2
+
   rollup@4.62.2:
     dependencies:
       '@types/estree': 1.0.9
@@ -13417,6 +14222,24 @@ snapshots:
 
   semver@7.8.5: {}
 
+  send@0.19.2:
+    dependencies:
+      debug: 2.6.9
+      depd: 2.0.0
+      destroy: 1.2.0
+      encodeurl: 2.0.0
+      escape-html: 1.0.3
+      etag: 1.8.1
+      fresh: 0.5.2
+      http-errors: 2.0.1
+      mime: 1.6.0
+      ms: 2.1.3
+      on-finished: 2.4.1
+      range-parser: 1.2.1
+      statuses: 2.0.2
+    transitivePeerDependencies:
+      - supports-color
+
   send@1.2.1:
     dependencies:
       debug: 4.4.3
@@ -13445,6 +14268,15 @@ snapshots:
     dependencies:
       defu: 6.1.5
 
+  serve-static@1.16.3:
+    dependencies:
+      encodeurl: 2.0.0
+      escape-html: 1.0.3
+      parseurl: 1.3.3
+      send: 0.19.2
+    transitivePeerDependencies:
+      - supports-color
+
   serve-static@2.2.1:
     dependencies:
       encodeurl: 2.0.0
@@ -13886,6 +14718,11 @@ snapshots:
     dependencies:
       tagged-tag: 1.0.0
 
+  type-is@1.6.18:
+    dependencies:
+      media-typer: 0.3.0
+      mime-types: 2.1.35
+
   type-is@2.1.0:
     dependencies:
       content-type: 2.0.0
@@ -14030,6 +14867,26 @@ snapshots:
       oxc-parser: 0.132.0
       rolldown: 1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.10.0)
 
+  unimport@6.3.0(oxc-parser@0.132.0)(rolldown@1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1)):
+    dependencies:
+      acorn: 8.17.0
+      escape-string-regexp: 5.0.0
+      estree-walker: 3.0.3
+      local-pkg: 1.2.1
+      magic-string: 0.30.21
+      mlly: 1.8.2
+      pathe: 2.0.3
+      picomatch: 4.0.4
+      pkg-types: 2.3.1
+      scule: 1.3.0
+      strip-literal: 3.1.0
+      tinyglobby: 0.2.17
+      unplugin: 3.0.0
+      unplugin-utils: 0.3.1
+    optionalDependencies:
+      oxc-parser: 0.132.0
+      rolldown: 1.0.0-beta.45(@emnapi/core@1.10.0)(@emnapi/runtime@1.11.1)
+
   unpipe@1.0.0: {}
 
   unplugin-utils@0.3.1:
@@ -14162,6 +15019,8 @@ snapshots:
 
   util-deprecate@1.0.2: {}
 
+  utils-merge@1.0.1: {}
+
   uuid@11.1.1: {}
 
   vary@1.1.2: {}
@@ -14308,9 +15167,9 @@ snapshots:
       terser: 5.48.0
       yaml: 2.9.0
 
-  vitest-environment-nuxt@1.0.1(@playwright/test@1.60.0)(@types/node@24.7.2)(@vue/test-utils@2.4.6)(jiti@2.7.0)(magicast@0.5.3)(playwright-core@1.60.0)(terser@5.48.0)(typescript@5.9.3)(vitest@4.1.8)(yaml@2.9.0):
+  vitest-environment-nuxt@1.0.1(@playwright/test@1.60.0)(@types/node@24.7.2)(@vue/test-utils@2.4.6)(jiti@2.7.0)(jsdom@27.0.1)(magicast@0.5.3)(playwright-core@1.60.0)(terser@5.48.0)(typescript@5.9.3)(vitest@4.1.8)(yaml@2.9.0):
     dependencies:
-      '@nuxt/test-utils': 3.17.2(@playwright/test@1.60.0)(@types/node@24.7.2)(@vue/test-utils@2.4.6)(jiti@2.7.0)(magicast@0.5.3)(playwright-core@1.60.0)(terser@5.48.0)(typescript@5.9.3)(vitest@4.1.8)(yaml@2.9.0)
+      '@nuxt/test-utils': 3.17.2(@playwright/test@1.60.0)(@types/node@24.7.2)(@vue/test-utils@2.4.6)(jiti@2.7.0)(jsdom@27.0.1)(magicast@0.5.3)(playwright-core@1.60.0)(terser@5.48.0)(typescript@5.9.3)(vitest@4.1.8)(yaml@2.9.0)
     transitivePeerDependencies:
       - '@cucumber/cucumber'
       - '@jest/globals'
@@ -14394,35 +15253,6 @@ snapshots:
     transitivePeerDependencies:
       - msw
 
-  vitest@4.1.8(@types/node@24.7.2)(@vitest/browser-playwright@4.1.8)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)):
-    dependencies:
-      '@vitest/expect': 4.1.8
-      '@vitest/mocker': 4.1.8(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))
-      '@vitest/pretty-format': 4.1.8
-      '@vitest/runner': 4.1.8
-      '@vitest/snapshot': 4.1.8
-      '@vitest/spy': 4.1.8
-      '@vitest/utils': 4.1.8
-      es-module-lexer: 2.1.0
-      expect-type: 1.3.0
-      magic-string: 0.30.21
-      obug: 2.1.3
-      pathe: 2.0.3
-      picomatch: 4.0.4
-      std-env: 4.1.0
-      tinybench: 2.9.0
-      tinyexec: 1.2.4
-      tinyglobby: 0.2.17
-      tinyrainbow: 3.1.0
-      vite: 7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
-      why-is-node-running: 2.3.0
-    optionalDependencies:
-      '@types/node': 24.7.2
-      '@vitest/browser-playwright': 4.1.8(playwright@1.60.0)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(vitest@4.1.8)
-    transitivePeerDependencies:
-      - msw
-    optional: true
-
   vscode-uri@3.1.0: {}
 
   vue-bundle-renderer@2.2.0:
@@ -14450,6 +15280,11 @@ snapshots:
       '@vue/devtools-api': 6.6.4
       vue: 3.5.30(typescript@5.9.3)
 
+  vue-router@4.6.4(vue@3.5.38(typescript@5.9.3)):
+    dependencies:
+      '@vue/devtools-api': 6.6.4
+      vue: 3.5.38(typescript@5.9.3)
+
   vue-router@5.1.0(@vue/compiler-sfc@3.5.38)(vite@7.3.5(@types/node@24.7.2)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))(vue@3.5.30(typescript@5.9.3)):
     dependencies:
       '@babel/generator': 8.0.0
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index b2a30d1..fe5269d 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -1,5 +1,6 @@
 packages:
   - packages/**
+  - samples/**
 
 minimumReleaseAgeExclude:
   # JUSTIFICATION: Temporary exclusion due to recent release. TODO: Remove after the time passes.
diff --git a/samples/browser/quickstart/.env.example b/samples/browser/quickstart/.env.example
new file mode 100644
index 0000000..bd72417
--- /dev/null
+++ b/samples/browser/quickstart/.env.example
@@ -0,0 +1,2 @@
+VITE_THUNDERID_CLIENT_ID=your-client-id-here
+VITE_THUNDERID_BASE_URL=https://localhost:8090
diff --git a/samples/browser/quickstart/README.md b/samples/browser/quickstart/README.md
new file mode 100644
index 0000000..44a37b5
--- /dev/null
+++ b/samples/browser/quickstart/README.md
@@ -0,0 +1,35 @@
+# ThunderID Browser Quickstart
+
+A minimal Vite + vanilla JS app demonstrating sign-in and sign-out with the ThunderID JavaScript SDK (`@thunderid/browser`).
+
+## Prerequisites
+
+- Node.js 18+
+- A running ThunderID instance (default: `https://localhost:8090`)
+- A configured application with an authorized redirect URI set to your app's origin (e.g. `http://localhost:5173`)
+
+## Getting started
+
+1. Copy the environment file and fill in your values:
+   ```sh
+   cp .env.example .env
+   ```
+
+2. Edit `.env` with your ThunderID application credentials:
+   ```
+   VITE_THUNDERID_CLIENT_ID=<your-client-id>
+   VITE_THUNDERID_BASE_URL=https://localhost:8090
+   ```
+
+3. Install dependencies and start the dev server:
+   ```sh
+   pnpm install
+   pnpm dev
+   ```
+
+Open [http://localhost:5173](http://localhost:5173) in your browser.
+
+## Learn more
+
+- [ThunderID Docs](https://thunderid.dev/docs)
+- [`@thunderid/browser` SDK reference](https://thunderid.dev/docs/sdks/javascript/browser)
diff --git a/samples/browser/quickstart/index.html b/samples/browser/quickstart/index.html
new file mode 100644
index 0000000..8e93376
--- /dev/null
+++ b/samples/browser/quickstart/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>ThunderID JavaScript Quickstart</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.js"></script>
+  </body>
+</html>
diff --git a/samples/browser/quickstart/package.json b/samples/browser/quickstart/package.json
new file mode 100644
index 0000000..fad4066
--- /dev/null
+++ b/samples/browser/quickstart/package.json
@@ -0,0 +1,17 @@
+{
+  "name": "@thunderid/browser-quickstart",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@thunderid/browser": "workspace:*"
+  },
+  "devDependencies": {
+    "vite": "^6.3.5"
+  }
+}
diff --git a/samples/browser/quickstart/src/auth.js b/samples/browser/quickstart/src/auth.js
new file mode 100644
index 0000000..698ae11
--- /dev/null
+++ b/samples/browser/quickstart/src/auth.js
@@ -0,0 +1,12 @@
+import { ThunderIDBrowserClient } from '@thunderid/browser'
+
+const auth = new ThunderIDBrowserClient()
+
+await auth.initialize({
+  clientId: import.meta.env.VITE_THUNDERID_CLIENT_ID,
+  baseUrl: import.meta.env.VITE_THUNDERID_BASE_URL,
+  afterSignInUrl: window.location.origin,
+  afterSignOutUrl: window.location.origin,
+})
+
+export default auth
diff --git a/samples/browser/quickstart/src/components/nav.js b/samples/browser/quickstart/src/components/nav.js
new file mode 100644
index 0000000..0953522
--- /dev/null
+++ b/samples/browser/quickstart/src/components/nav.js
@@ -0,0 +1,163 @@
+const NAV_MARK = `<svg width="19" height="24" viewBox="0 0 207 257" fill="none">
+  <path d="M55.4763 26.4391L58.8866 0H0V26.4391H55.4763Z" fill="#05213F" id="mark-top"/>
+  <path d="M39.8438 147.407L49.5455 72.2839H4.9909e-05V256.743H60.5602L80.048 147.407H39.8438Z" fill="#3688FF"/>
+  <path d="M192.42 59.361C182.782 40.2307 168.929 25.5705 150.903 15.3381C145.501 12.2662 139.761 9.6605 133.703 7.5208L115.401 103.702H159.757L76.2987 256.743H83.3735C109.449 256.743 131.69 251.574 150.14 241.236C168.569 230.897 182.634 216.131 192.356 196.959C202.058 177.765 206.909 154.8 206.909 128.043C206.909 101.286 202.079 78.5123 192.441 59.3821L192.42 59.361Z" fill="#3688FF"/>
+</svg>`
+
+const ICON_MOON = `<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/></svg>`
+const ICON_SUN = `<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"/><line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/><line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/></svg>`
+const ICON_KEY = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><circle cx="7.5" cy="15.5" r="5.5"/><path d="M21 2l-9.6 9.6"/><path d="M15.5 7.5l3 3L22 7l-3-3"/></svg>`
+const ICON_USER = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="8" r="4"/><path d="M4 20c0-4 3.6-7 8-7s8 3 8 7"/></svg>`
+const ICON_CHEVRON_LEFT = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"/></svg>`
+const ICON_CHEVRON_DOWN = `<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>`
+
+function escapeHtml(str) {
+  if (str == null) return ''
+  return String(str)
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;')
+}
+
+function getInitials(user) {
+  const given = user?.given_name || ''
+  const family = user?.family_name || ''
+  if (given && family) return (given[0] + family[0]).toUpperCase()
+  const name = user?.name || user?.username || user?.email || '?'
+  const parts = name.trim().split(/\s+/)
+  if (parts.length >= 2) return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase()
+  return name.slice(0, 2).toUpperCase()
+}
+
+export function renderSignedOutNav({ isDark }) {
+  return `
+    <nav class="nav">
+      <a href="/" class="nav-logo">
+        ${NAV_MARK}
+        <div class="wordmark">
+          <span class="wordmark-name">ThunderID</span>
+          <span class="wordmark-sub">Quickstart</span>
+        </div>
+      </a>
+      <div class="nav-actions">
+        <button class="btn-ghost" id="sign-in-btn">Sign in</button>
+        <button class="btn-primary" id="get-started-btn">Get started</button>
+        <button class="dark-toggle" id="dark-toggle" aria-label="Toggle dark mode">
+          ${isDark ? ICON_SUN : ICON_MOON}
+        </button>
+      </div>
+    </nav>`
+}
+
+export function renderSignedInNav({ user, isDark, currentPage }) {
+  const initials = escapeHtml(getInitials(user))
+  const name = escapeHtml(user?.given_name || user?.name || user?.username || 'User')
+  const email = escapeHtml(user?.email || '')
+
+  return `
+    <nav class="nav">
+      <a href="/" class="nav-logo" id="nav-logo-btn">
+        ${NAV_MARK}
+        <div class="wordmark">
+          <span class="wordmark-name">ThunderID</span>
+          <span class="wordmark-sub">Quickstart</span>
+        </div>
+      </a>
+      <div class="nav-actions">
+        ${currentPage !== 'home' ? `
+          <button class="nav-back-btn" id="nav-back-btn">
+            ${ICON_CHEVRON_LEFT} Home
+          </button>` : ''}
+        <button class="dark-toggle" id="dark-toggle" aria-label="Toggle dark mode">
+          ${isDark ? ICON_SUN : ICON_MOON}
+        </button>
+        <div class="ud-wrapper" id="ud-wrapper">
+          <button class="ud-trigger" id="ud-trigger" aria-haspopup="true">
+            <span class="ud-avatar">${initials}</span>
+            <span class="ud-name">${name}</span>
+            ${ICON_CHEVRON_DOWN}
+          </button>
+          <div class="ud-menu" id="ud-menu">
+            <div class="ud-header">
+              <div class="ud-header-name">${name}</div>
+              ${email ? `<div class="ud-header-email">${email}</div>` : ''}
+            </div>
+            <div class="ud-divider"></div>
+            <button class="ud-item" id="ud-profile">
+              ${ICON_USER} Profile
+            </button>
+            <button class="ud-item" id="ud-token-debug">
+              ${ICON_KEY} Token debug
+            </button>
+            <div class="ud-divider"></div>
+            <button class="ud-item ud-item--signout" id="ud-sign-out">Sign out</button>
+          </div>
+        </div>
+      </div>
+    </nav>`
+}
+
+export function attachNavHandlers({ isDark, setIsDark, navigateTo, auth }) {
+  document.getElementById('dark-toggle')?.addEventListener('click', () => {
+    const next = !isDark()
+    setIsDark(next)
+    document.documentElement.classList.toggle('dark', next)
+    const dt = document.getElementById('dark-toggle')
+    if (dt) dt.innerHTML = next ? ICON_SUN : ICON_MOON
+    document.querySelectorAll('#mark-top, #hero-mark-top').forEach(el =>
+      el.setAttribute('fill', next ? '#E8F4FF' : '#05213F')
+    )
+  })
+
+  document.getElementById('nav-logo-btn')?.addEventListener('click', (e) => {
+    e.preventDefault()
+    navigateTo('home')
+  })
+
+  document.getElementById('nav-back-btn')?.addEventListener('click', () => {
+    navigateTo('home')
+  })
+
+  const trigger = document.getElementById('ud-trigger')
+  const menu = document.getElementById('ud-menu')
+  const wrapper = document.getElementById('ud-wrapper')
+  if (trigger && menu) {
+    trigger.addEventListener('click', (e) => {
+      e.stopPropagation()
+      menu.classList.toggle('ud-menu--open')
+    })
+    document.addEventListener('click', (e) => {
+      if (!wrapper?.contains(e.target)) menu.classList.remove('ud-menu--open')
+    }, { once: true })
+  }
+
+  document.getElementById('ud-profile')?.addEventListener('click', () => {
+    menu?.classList.remove('ud-menu--open')
+    navigateTo('profile')
+  })
+
+  document.getElementById('ud-token-debug')?.addEventListener('click', () => {
+    menu?.classList.remove('ud-menu--open')
+    navigateTo('token')
+  })
+
+  document.getElementById('ud-sign-out')?.addEventListener('click', () => {
+    auth.signOut()
+  })
+}
+
+export function attachSignedOutNavHandlers({ auth }) {
+  document.getElementById('sign-in-btn')?.addEventListener('click', () => auth.signIn())
+  document.getElementById('get-started-btn')?.addEventListener('click', () => auth.signIn())
+  document.getElementById('dark-toggle')?.addEventListener('click', () => {
+    const next = !document.documentElement.classList.contains('dark')
+    document.documentElement.classList.toggle('dark', next)
+    const dt = document.getElementById('dark-toggle')
+    if (dt) dt.innerHTML = next ? ICON_SUN : ICON_MOON
+    document.querySelectorAll('#mark-top').forEach(el =>
+      el.setAttribute('fill', next ? '#E8F4FF' : '#05213F')
+    )
+  })
+}
diff --git a/samples/browser/quickstart/src/main.js b/samples/browser/quickstart/src/main.js
new file mode 100644
index 0000000..0f2f643
--- /dev/null
+++ b/samples/browser/quickstart/src/main.js
@@ -0,0 +1,78 @@
+import './style.css'
+import auth from './auth.js'
+import { renderSignedOutNav, renderSignedInNav, attachNavHandlers, attachSignedOutNavHandlers } from './components/nav.js'
+import { renderSignedOut, renderHome, startCountdown, attachSignedOutHandlers } from './pages/home.js'
+import { renderProfile } from './pages/profile.js'
+import { renderTokenDebug, attachTokenHandlers } from './pages/token.js'
+
+let isDark = false
+let currentPage = 'home'
+let user = null
+let idToken = null
+let rawToken = null
+let timer = null
+
+function navigateTo(page) {
+  if (timer) { clearInterval(timer); timer = null }
+  currentPage = page
+  renderSignedInPage()
+}
+
+function renderSignedInPage() {
+  const app = document.getElementById('app')
+  if (!app) return
+
+  let content
+  if (currentPage === 'token') {
+    content = renderTokenDebug({ rawToken })
+  } else if (currentPage === 'profile') {
+    content = renderProfile({ user })
+  } else {
+    content = renderHome({ user, idToken })
+  }
+
+  app.innerHTML = renderSignedInNav({ user, isDark, currentPage }) + content
+
+  attachNavHandlers({
+    isDark: () => isDark,
+    setIsDark: (v) => { isDark = v },
+    navigateTo,
+    auth,
+  })
+
+  if (currentPage === 'token') {
+    attachTokenHandlers({ rawToken })
+  } else if (currentPage === 'home') {
+    timer = startCountdown({ idToken })
+  }
+}
+
+async function renderApp() {
+  const app = document.getElementById('app')
+  if (!app) return
+
+  if (timer) { clearInterval(timer); timer = null }
+
+  await auth.signIn({ callOnlyOnRedirect: true })
+
+  const signedIn = await auth.isSignedIn()
+
+  if (signedIn) {
+    user = await auth.getUser()
+    try { idToken = await auth.getDecodedIdToken() } catch { idToken = null }
+    try { rawToken = await auth.getAccessToken() } catch { rawToken = null }
+    currentPage = 'home'
+    renderSignedInPage()
+  } else {
+    user = null
+    idToken = null
+    rawToken = null
+    currentPage = 'home'
+
+    app.innerHTML = renderSignedOutNav({ isDark }) + renderSignedOut()
+    attachSignedOutNavHandlers({ auth })
+    attachSignedOutHandlers({ auth })
+  }
+}
+
+renderApp()
diff --git a/samples/browser/quickstart/src/pages/home.js b/samples/browser/quickstart/src/pages/home.js
new file mode 100644
index 0000000..0167717
--- /dev/null
+++ b/samples/browser/quickstart/src/pages/home.js
@@ -0,0 +1,216 @@
+const HERO_MARK = `<svg width="32" height="40" viewBox="0 0 207 257" fill="none">
+  <path d="M55.4763 26.4391L58.8866 0H0V26.4391H55.4763Z" fill="#05213F" id="hero-mark-top"/>
+  <path d="M39.8438 147.407L49.5455 72.2839H4.9909e-05V256.743H60.5602L80.048 147.407H39.8438Z" fill="#3688FF"/>
+  <path d="M192.42 59.361C182.782 40.2307 168.929 25.5705 150.903 15.3381C145.501 12.2662 139.761 9.6605 133.703 7.5208L115.401 103.702H159.757L76.2987 256.743H83.3735C109.449 256.743 131.69 251.574 150.14 241.236C168.569 230.897 182.634 216.131 192.356 196.959C202.058 177.765 206.909 154.8 206.909 128.043C206.909 101.286 202.079 78.5123 192.441 59.3821L192.42 59.361Z" fill="#3688FF"/>
+</svg>`
+
+const ICON_CLOCK = `<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>`
+const ICON_TIMER = `<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><path d="M10 2h4"/><path d="M12 14v-4"/><path d="M4 13a8 8 0 0 1 8-7 8 8 0 1 1-5.3 14L4 17.6"/><path d="M9 17H4v5"/></svg>`
+const ICON_BUILDING = `<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18"/><path d="M9 21V9"/></svg>`
+const ICON_ARROW = `<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M7 17L17 7"/><path d="M7 7h10v10"/></svg>`
+
+const NEXT_STEPS = [
+  {
+    n: '01',
+    title: 'Explore use cases',
+    body: 'See what you can build — auth flows for web, mobile, APIs, and agents.',
+    cta: 'Browse use cases',
+    href: 'https://thunderid.dev/docs/next/use-cases/overview/',
+  },
+  {
+    n: '02',
+    title: 'Learn about flows',
+    body: 'Understand how authorization code, PKCE, client credentials, and device flows work.',
+    cta: 'Read guide',
+    href: 'https://thunderid.dev/docs/next/guides/guides/flows/what-are-flows/',
+  },
+  {
+    n: '03',
+    title: 'Style your experience',
+    body: 'Customize the login UI, branding, and email templates to match your product.',
+    cta: 'Design guide',
+    href: 'https://thunderid.dev/docs/next/guides/guides/design/overview/',
+  },
+  {
+    n: '04',
+    title: 'Explore SDK APIs',
+    body: 'Full Browser SDK reference — client methods, PKCE configuration, and token management.',
+    cta: 'SDK reference',
+    href: 'https://thunderid.dev/docs/next/sdks/browser/overview/',
+  },
+]
+
+function escapeHtml(str) {
+  if (str == null) return ''
+  return String(str)
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;')
+}
+
+function getInitials(user) {
+  const given = user?.given_name || ''
+  const family = user?.family_name || ''
+  if (given && family) return (given[0] + family[0]).toUpperCase()
+  const name = user?.name || user?.username || user?.email || '?'
+  const parts = name.trim().split(/\s+/)
+  if (parts.length >= 2) return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase()
+  return name.slice(0, 2).toUpperCase()
+}
+
+function greeting(name) {
+  const h = new Date().getHours()
+  const tod = h < 12 ? 'morning' : h < 17 ? 'afternoon' : 'evening'
+  return `Good ${tod}, ${name}.`
+}
+
+function formatTime(unixSeconds) {
+  if (!unixSeconds) return '—'
+  return new Date(unixSeconds * 1000).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })
+}
+
+export function formatCountdown(secsLeft) {
+  if (secsLeft <= 0) return { text: 'Expired', color: '#d95757' }
+  if (secsLeft < 300) {
+    const m = Math.floor(secsLeft / 60), s = secsLeft % 60
+    return { text: `${m}m ${s}s`, color: '#e88b3a' }
+  }
+  if (secsLeft < 3600) {
+    const m = Math.floor(secsLeft / 60), s = secsLeft % 60
+    return { text: `${m}m ${s}s`, color: '#2fbd6b' }
+  }
+  const hr = Math.floor(secsLeft / 3600), m = Math.floor((secsLeft % 3600) / 60)
+  return { text: `${hr}h ${m}m`, color: '#2fbd6b' }
+}
+
+export function renderSignedOut() {
+  return `
+    <section class="hero">
+      <div class="hero-inner">
+        <div class="hero-mark">${HERO_MARK}</div>
+        <div class="hero-badge">
+          <span class="hero-badge-line"></span>
+          <span>v1.0 · Open source</span>
+          <span class="hero-badge-line"></span>
+        </div>
+        <h1 class="hero-title">Auth for the Modern Dev</h1>
+        <p class="hero-subtitle">
+          ThunderID gives you OAuth 2.0, PKCE, MFA, and JWT out of the box.
+          Clone the Quickstart and ship auth before lunch.
+        </p>
+        <div class="hero-ctas">
+          <button class="btn-primary btn-lg" id="hero-get-started-btn">Get started</button>
+          <button class="btn-outline btn-lg" id="hero-sign-in-btn">Sign in</button>
+        </div>
+        <hr class="hero-divider">
+        <div class="hero-stats">
+          <div class="stat">
+            <span class="stat-value">OAuth 2.0</span>
+            <span class="stat-label">Authorization standard</span>
+          </div>
+          <div class="stat">
+            <span class="stat-value">&lt; 5 min</span>
+            <span class="stat-label">Integration time</span>
+          </div>
+          <div class="stat">
+            <span class="stat-value">MIT</span>
+            <span class="stat-label">License</span>
+          </div>
+        </div>
+      </div>
+    </section>`
+}
+
+export function attachSignedOutHandlers({ auth }) {
+  document.getElementById('hero-get-started-btn')?.addEventListener('click', () => auth.signIn())
+  document.getElementById('hero-sign-in-btn')?.addEventListener('click', () => auth.signIn())
+}
+
+export function renderHome({ user, idToken }) {
+  const now = Math.floor(Date.now() / 1000)
+  const givenName = user?.given_name || user?.name || user?.username || 'there'
+  const email = user?.email || ''
+  const initials = escapeHtml(getInitials(user))
+
+  const authTime = idToken?.auth_time
+  const exp = idToken?.exp
+  const secsLeft = exp ? Math.max(0, exp - now) : null
+  const countdown = secsLeft !== null ? formatCountdown(secsLeft) : null
+  const orgName = escapeHtml(idToken?.org_name || idToken?.org_handle || 'Default')
+
+  return `
+    <main class="home-main">
+      <div class="home-greeting">
+        <div class="home-avatar-initials">${initials}</div>
+        <div class="home-greeting-text">
+          <h1 class="home-greeting-name">${escapeHtml(greeting(givenName))}</h1>
+          <div class="home-greeting-meta">
+            ${email ? `<span>${escapeHtml(email)}</span><span class="home-dot"></span>` : ''}
+            <span class="home-session-active">
+              <span class="home-session-dot"></span>
+              Session active
+            </span>
+          </div>
+        </div>
+      </div>
+
+      <div class="home-stats">
+        <div class="home-stat">
+          <div class="home-stat-icon">${ICON_CLOCK}</div>
+          <div>
+            <div class="home-stat-value">${formatTime(authTime)}</div>
+            <div class="home-stat-label">Signed in at</div>
+          </div>
+        </div>
+        <div class="home-stat home-stat--bordered">
+          <div class="home-stat-icon">${ICON_TIMER}</div>
+          <div>
+            <div
+              class="home-stat-value home-stat-value--mono"
+              id="countdown-value"
+              ${countdown ? `style="color:${countdown.color}"` : ''}
+            >${countdown ? countdown.text : '—'}</div>
+            <div class="home-stat-label">Session expires in</div>
+          </div>
+        </div>
+        <div class="home-stat home-stat--bordered">
+          <div class="home-stat-icon">${ICON_BUILDING}</div>
+          <div>
+            <div class="home-stat-value">${orgName}</div>
+            <div class="home-stat-label">Organisation</div>
+          </div>
+        </div>
+      </div>
+
+      <div class="home-next-label">What's next</div>
+      <div class="home-next-list">
+        ${NEXT_STEPS.map(step => `
+          <a href="${step.href}" target="_blank" rel="noopener noreferrer" class="home-next-item">
+            <span class="home-next-n">${step.n}</span>
+            <div class="home-next-body">
+              <div class="home-next-title">${step.title}</div>
+              <div class="home-next-desc">${step.body}</div>
+            </div>
+            <span class="home-next-cta">${step.cta} ${ICON_ARROW}</span>
+          </a>`).join('')}
+      </div>
+    </main>`
+}
+
+export function startCountdown({ idToken }) {
+  const timer = setInterval(() => {
+    const el = document.getElementById('countdown-value')
+    if (!el) { clearInterval(timer); return }
+    const now = Math.floor(Date.now() / 1000)
+    const exp = idToken?.exp
+    const secsLeft = exp ? Math.max(0, exp - now) : null
+    if (secsLeft !== null) {
+      const cd = formatCountdown(secsLeft)
+      el.textContent = cd.text
+      el.style.color = cd.color
+    }
+  }, 1000)
+  return timer
+}
diff --git a/samples/browser/quickstart/src/pages/profile.js b/samples/browser/quickstart/src/pages/profile.js
new file mode 100644
index 0000000..e2f1263
--- /dev/null
+++ b/samples/browser/quickstart/src/pages/profile.js
@@ -0,0 +1,45 @@
+function escapeHtml(str) {
+  if (str == null) return ''
+  return String(str)
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;')
+}
+
+function row(label, value) {
+  if (!value) return ''
+  return `
+    <div class="profile-row">
+      <div class="profile-label">${label}</div>
+      <div class="profile-value">${escapeHtml(value)}</div>
+    </div>`
+}
+
+export function renderProfile({ user }) {
+  const displayName = user?.name || [user?.given_name, user?.family_name].filter(Boolean).join(' ') || user?.username || '—'
+  const picture = user?.picture
+
+  return `
+    <main class="profile-main">
+      <div class="profile-header">
+        ${picture
+          ? `<img src="${escapeHtml(picture)}" alt="${escapeHtml(displayName)}" class="profile-avatar-img" />`
+          : `<div class="profile-avatar-initials">${escapeHtml(displayName.slice(0, 2).toUpperCase())}</div>`}
+        <div>
+          <h1 class="profile-name">${escapeHtml(displayName)}</h1>
+          ${user?.email ? `<p class="profile-email">${escapeHtml(user.email)}</p>` : ''}
+        </div>
+      </div>
+
+      <div class="profile-section-label">Account details</div>
+      <div class="profile-fields">
+        ${row('First name', user?.given_name)}
+        ${row('Last name', user?.family_name)}
+        ${row('Username', user?.username)}
+        ${row('Email', user?.email)}
+        ${row('User ID', user?.sub || user?.id)}
+      </div>
+    </main>`
+}
diff --git a/samples/browser/quickstart/src/pages/token.js b/samples/browser/quickstart/src/pages/token.js
new file mode 100644
index 0000000..9c65551
--- /dev/null
+++ b/samples/browser/quickstart/src/pages/token.js
@@ -0,0 +1,118 @@
+const ICON_COPY = `<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>`
+
+function escapeHtml(str) {
+  if (str == null) return ''
+  return String(str)
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;')
+}
+
+function decodeJwtPart(part) {
+  try {
+    const base64 = part.replace(/-/g, '+').replace(/_/g, '/')
+    const padded = base64.padEnd(base64.length + (4 - (base64.length % 4)) % 4, '=')
+    return JSON.parse(atob(padded))
+  } catch {
+    return null
+  }
+}
+
+export function renderTokenDebug({ rawToken }) {
+  const now = Math.floor(Date.now() / 1000)
+  const parts = rawToken ? rawToken.split('.') : []
+  const jwtHeader = parts[0] ? decodeJwtPart(parts[0]) : null
+  const jwtPayload = parts[1] ? decodeJwtPart(parts[1]) : null
+
+  const exp = jwtPayload?.exp
+  const expiresIn = exp ? exp - now : null
+  const expired = expiresIn !== null && expiresIn <= 0
+  const minsLeft = expiresIn !== null ? Math.abs(Math.floor(expiresIn / 60)) : null
+
+  const issuer = jwtPayload?.iss
+  const audience = Array.isArray(jwtPayload?.aud) ? jwtPayload.aud.join(', ') : jwtPayload?.aud
+  const scopes = jwtPayload?.scope
+
+  return `
+    <main class="token-main">
+      <div class="token-header">
+        <div>
+          <h1 class="token-title">Token debug</h1>
+          <p class="token-subtitle">Inspect your access token and decoded claims.</p>
+        </div>
+        ${expiresIn !== null ? `
+          <div class="token-badge ${expired ? 'token-badge--expired' : 'token-badge--valid'}">
+            <span class="token-badge-dot"></span>
+            <span>${expired ? 'Expired' : `Valid · expires in ${minsLeft} min`}</span>
+          </div>` : ''}
+      </div>
+
+      ${rawToken ? `
+        <div class="token-raw-section">
+          <div class="token-raw-label-row">
+            <span class="token-section-label">Access token</span>
+            <button class="token-copy-btn" id="copy-btn">${ICON_COPY} Copy</button>
+          </div>
+          <code class="token-raw">
+            <span class="token-part--header">${escapeHtml(parts[0] || '')}</span>
+            <span class="token-dot">.</span>
+            <span class="token-part--payload">${escapeHtml(parts[1] || '')}</span>
+            <span class="token-dot">.</span>
+            <span class="token-part--signature">${escapeHtml(parts[2] || '')}</span>
+          </code>
+        </div>` : `
+        <div class="token-raw-section">
+          <div class="token-raw-label-row">
+            <span class="token-section-label">Access token</span>
+          </div>
+          <code class="token-raw token-raw--loading">Loading…</code>
+        </div>`}
+
+      <div class="token-decoded-grid">
+        <div class="token-code-box">
+          <div class="token-code-box-header token-code-box-header--header">JWT Header</div>
+          <pre class="token-code-pre">${jwtHeader ? escapeHtml(JSON.stringify(jwtHeader, null, 2)) : '…'}</pre>
+        </div>
+        <div class="token-code-box">
+          <div class="token-code-box-header token-code-box-header--payload">JWT Payload</div>
+          <pre class="token-code-pre">${jwtPayload ? escapeHtml(JSON.stringify(jwtPayload, null, 2)) : '…'}</pre>
+        </div>
+      </div>
+
+      ${issuer || audience || scopes ? `
+        <div class="token-meta-row">
+          ${issuer ? `
+            <div class="token-meta-item">
+              <div class="token-meta-label">Issuer</div>
+              <div class="token-meta-value">${escapeHtml(issuer)}</div>
+            </div>` : ''}
+          ${audience ? `
+            <div class="token-meta-item">
+              <div class="token-meta-label">Audience</div>
+              <div class="token-meta-value">${escapeHtml(audience)}</div>
+            </div>` : ''}
+          ${scopes ? `
+            <div class="token-meta-item">
+              <div class="token-meta-label">Scopes</div>
+              <div class="token-meta-value">${escapeHtml(scopes)}</div>
+            </div>` : ''}
+        </div>` : ''}
+    </main>`
+}
+
+export function attachTokenHandlers({ rawToken }) {
+  document.getElementById('copy-btn')?.addEventListener('click', async () => {
+    if (!rawToken || !navigator.clipboard) return
+    await navigator.clipboard.writeText(rawToken)
+    const btn = document.getElementById('copy-btn')
+    if (btn) {
+      btn.innerHTML = `${ICON_COPY} Copied!`
+      setTimeout(() => {
+        const b = document.getElementById('copy-btn')
+        if (b) b.innerHTML = `${ICON_COPY} Copy`
+      }, 1500)
+    }
+  })
+}
diff --git a/samples/browser/quickstart/src/style.css b/samples/browser/quickstart/src/style.css
new file mode 100644
index 0000000..47d0e99
--- /dev/null
+++ b/samples/browser/quickstart/src/style.css
@@ -0,0 +1,1039 @@
+*, *::before, *::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+:root {
+  --bg: #F7F9FC;
+  --card: #ffffff;
+  --border: #DDE3EC;
+  --text: #05213F;
+  --muted: #5A7085;
+  --blue: #3688FF;
+  --blue-hover: #2270e8;
+  --blue-subtle: rgba(54, 136, 255, 0.08);
+  --shadow-sm: 0 1px 3px rgba(5, 33, 63, 0.08);
+  --shadow-md: 0 4px 16px rgba(5, 33, 63, 0.10);
+  --radius: 10px;
+  --radius-sm: 6px;
+}
+
+.dark {
+  --bg: #080f1c;
+  --card: #0f1a2d;
+  --border: rgba(255, 255, 255, 0.09);
+  --text: #E0EAFF;
+  --muted: rgba(224, 234, 255, 0.48);
+  --blue-subtle: rgba(54, 136, 255, 0.14);
+  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
+  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
+}
+
+html {
+  color-scheme: light;
+}
+
+html.dark {
+  color-scheme: dark;
+}
+
+body {
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+  background: var(--bg);
+  color: var(--text);
+  min-height: 100vh;
+  line-height: 1.5;
+  transition: background 0.2s ease, color 0.2s ease;
+}
+
+/* Nav */
+.nav {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 24px;
+  height: 60px;
+  border-bottom: 1px solid var(--border);
+  background: var(--card);
+  position: sticky;
+  top: 0;
+  z-index: 100;
+  box-shadow: var(--shadow-sm);
+}
+
+.nav-logo {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  text-decoration: none;
+  color: inherit;
+}
+
+.wordmark {
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+}
+
+.wordmark-name {
+  font-size: 14px;
+  font-weight: 700;
+  letter-spacing: -0.03em;
+  color: var(--text);
+  line-height: 1;
+}
+
+.wordmark-sub {
+  font-size: 8.5px;
+  font-weight: 700;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: var(--blue);
+  line-height: 1;
+}
+
+.nav-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+/* Hero */
+.hero {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  padding: 96px 32px 80px;
+  max-width: 560px;
+  margin: 0 auto;
+}
+
+.hero-mark {
+  margin-bottom: 28px;
+  opacity: 0.9;
+}
+
+.hero-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 10px;
+  font-weight: 600;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: var(--muted);
+  margin-bottom: 24px;
+}
+
+.hero-badge-line {
+  display: block;
+  width: 24px;
+  height: 1px;
+  background: var(--border);
+  flex-shrink: 0;
+}
+
+.hero-title {
+  font-size: 42px;
+  font-weight: 700;
+  letter-spacing: -0.05em;
+  line-height: 1.1;
+  color: var(--text);
+  margin-bottom: 20px;
+}
+
+.hero-subtitle {
+  font-size: 16px;
+  color: var(--muted);
+  line-height: 1.8;
+  letter-spacing: -0.01em;
+  max-width: 420px;
+  margin-bottom: 36px;
+}
+
+.hero-ctas {
+  display: flex;
+  gap: 12px;
+  flex-wrap: wrap;
+  justify-content: center;
+  margin-bottom: 48px;
+}
+
+.hero-divider {
+  width: 100%;
+  border: none;
+  border-top: 1px solid var(--border);
+  margin-bottom: 36px;
+}
+
+.hero-stats {
+  display: flex;
+  gap: 0;
+  width: 100%;
+  max-width: 480px;
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  overflow: hidden;
+  background: var(--card);
+  box-shadow: var(--shadow-sm);
+}
+
+.stat {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 20px 12px;
+  border-right: 1px solid var(--border);
+}
+
+.stat:last-child {
+  border-right: none;
+}
+
+.stat-value {
+  font-size: 18px;
+  font-weight: 700;
+  color: var(--blue);
+  letter-spacing: -0.3px;
+  line-height: 1;
+  margin-bottom: 4px;
+}
+
+.stat-label {
+  font-size: 11px;
+  color: var(--muted);
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  font-weight: 500;
+}
+
+/* Buttons */
+.btn-primary {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  padding: 9px 18px;
+  font-size: 14px;
+  font-weight: 600;
+  color: #ffffff;
+  background: var(--blue);
+  border: 1px solid transparent;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.1s ease;
+  text-decoration: none;
+  white-space: nowrap;
+}
+
+.btn-primary:hover {
+  background: var(--blue-hover);
+  box-shadow: 0 2px 8px rgba(54, 136, 255, 0.35);
+}
+
+.btn-primary:active {
+  transform: translateY(1px);
+}
+
+.btn-primary.btn-lg {
+  padding: 12px 28px;
+  font-size: 15px;
+  border-radius: var(--radius);
+}
+
+.btn-outline {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  padding: 9px 18px;
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--text);
+  background: transparent;
+  border: 1.5px solid rgba(54, 136, 255, 0.4);
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  transition: border-color 0.15s ease, background 0.15s ease;
+  text-decoration: none;
+  white-space: nowrap;
+}
+
+.btn-outline:hover {
+  border-color: var(--blue);
+  color: var(--blue);
+  background: var(--blue-subtle);
+}
+
+.btn-outline.btn-lg {
+  padding: 12px 28px;
+  font-size: 15px;
+  border-radius: var(--radius);
+}
+
+.btn-ghost {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  padding: 7px 14px;
+  font-size: 14px;
+  font-weight: 500;
+  color: var(--muted);
+  background: transparent;
+  border: none;
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  transition: background 0.15s ease, color 0.15s ease;
+  text-decoration: none;
+  white-space: nowrap;
+}
+
+.btn-ghost:hover {
+  background: var(--blue-subtle);
+  color: var(--text);
+}
+
+.dark-toggle {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  padding: 0;
+  background: transparent;
+  border: none;
+  border-radius: var(--radius-sm);
+  color: var(--muted);
+  cursor: pointer;
+  transition: color 0.15s ease, background 0.15s ease;
+}
+
+.dark-toggle:hover {
+  color: var(--text);
+  background: var(--blue-subtle);
+}
+
+/* User card */
+.user-card {
+  position: relative;
+  background: var(--card);
+  border: 1px solid var(--border);
+  border-radius: 16px;
+  padding: 40px 48px;
+  box-shadow: var(--shadow-md);
+  text-align: left;
+  min-width: 320px;
+  max-width: 460px;
+  width: 100%;
+  margin-top: 24px;
+}
+
+.user-avatar {
+  width: 64px;
+  height: 64px;
+  border-radius: 50%;
+  background: var(--blue);
+  color: #ffffff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 22px;
+  font-weight: 700;
+  letter-spacing: -0.5px;
+  margin-bottom: 20px;
+  box-shadow: 0 4px 12px rgba(54, 136, 255, 0.3);
+}
+
+.user-details {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.user-name {
+  font-size: 22px;
+  font-weight: 700;
+  letter-spacing: -0.4px;
+  color: var(--text);
+  margin-bottom: 4px;
+}
+
+.user-field {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.user-field-label {
+  font-size: 11px;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.07em;
+  color: var(--muted);
+}
+
+.user-field-value {
+  font-size: 14px;
+  color: var(--text);
+  font-weight: 500;
+}
+
+.user-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  margin-top: 24px;
+  font-size: 12px;
+  font-weight: 600;
+  color: #16a34a;
+  background: #f0fdf4;
+  border: 1px solid #bbf7d0;
+  padding: 4px 10px;
+  border-radius: 100px;
+}
+
+.dark .user-badge {
+  color: #4ade80;
+  background: rgba(74, 222, 128, 0.1);
+  border-color: rgba(74, 222, 128, 0.25);
+}
+
+/* Nav back button */
+.nav-back-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  height: 32px;
+  padding: 0 10px;
+  border-radius: 6px;
+  border: none;
+  background: transparent;
+  color: var(--muted);
+  font-size: 13px;
+  font-family: inherit;
+  letter-spacing: -0.01em;
+  cursor: pointer;
+  transition: background 0.15s ease, color 0.15s ease;
+}
+
+.nav-back-btn:hover {
+  background: var(--border);
+  color: var(--text);
+}
+
+/* User dropdown */
+.ud-wrapper {
+  position: relative;
+}
+
+.ud-trigger {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  padding: 4px 8px 4px 4px;
+  border-radius: 24px;
+  border: 1px solid var(--border);
+  background: transparent;
+  color: var(--text);
+  font-size: 13px;
+  font-weight: 600;
+  cursor: pointer;
+  font-family: inherit;
+  transition: background 0.15s ease, border-color 0.15s ease;
+}
+
+.ud-trigger:hover {
+  background: var(--blue-subtle);
+  border-color: rgba(54, 136, 255, 0.3);
+}
+
+.ud-avatar {
+  width: 28px;
+  height: 28px;
+  border-radius: 50%;
+  background: var(--blue);
+  color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 11px;
+  font-weight: 700;
+  flex-shrink: 0;
+}
+
+.ud-name {
+  max-width: 120px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ud-menu {
+  display: none;
+  position: absolute;
+  right: 0;
+  top: calc(100% + 6px);
+  min-width: 200px;
+  background: var(--card);
+  border: 1px solid var(--border);
+  border-radius: 10px;
+  box-shadow: var(--shadow-md);
+  overflow: hidden;
+  z-index: 200;
+}
+
+.ud-menu.ud-menu--open {
+  display: block;
+}
+
+.ud-header {
+  padding: 12px 14px;
+}
+
+.ud-header-name {
+  font-size: 13px;
+  font-weight: 600;
+  color: var(--text);
+}
+
+.ud-header-email {
+  font-size: 12px;
+  color: var(--muted);
+  margin-top: 2px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ud-divider {
+  height: 1px;
+  background: var(--border);
+}
+
+.ud-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  padding: 10px 14px;
+  border: none;
+  background: transparent;
+  color: var(--text);
+  font-size: 13px;
+  font-weight: 500;
+  cursor: pointer;
+  text-align: left;
+  font-family: inherit;
+  transition: background 0.15s ease;
+}
+
+.ud-item:hover {
+  background: var(--blue-subtle);
+}
+
+.ud-item--signout {
+  color: #dc2626;
+}
+
+.ud-item--signout:hover {
+  background: rgba(220, 38, 38, 0.06);
+}
+
+/* Signed-in home page */
+.home-main {
+  width: 100%;
+  max-width: 900px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+.home-avatar-initials {
+  width: 52px;
+  height: 52px;
+  border-radius: 50%;
+  background: var(--blue);
+  color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 18px;
+  font-weight: 700;
+  letter-spacing: -0.3px;
+  flex-shrink: 0;
+  box-shadow: 0 4px 12px rgba(54, 136, 255, 0.3);
+}
+
+.home-greeting {
+  display: flex;
+  align-items: flex-start;
+  gap: 16px;
+  margin-bottom: 36px;
+}
+
+.home-greeting-text {
+  min-width: 0;
+}
+
+.home-greeting-name {
+  margin: 0 0 6px;
+  font-size: 26px;
+  font-weight: 700;
+  color: var(--text);
+  letter-spacing: -0.04em;
+}
+
+.home-greeting-meta {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 13px;
+  color: var(--muted);
+  letter-spacing: -0.01em;
+  flex-wrap: wrap;
+}
+
+.home-dot {
+  display: inline-block;
+  width: 3px;
+  height: 3px;
+  border-radius: 50%;
+  background: var(--border);
+  flex-shrink: 0;
+}
+
+.home-session-active {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  color: #2fbd6b;
+}
+
+.home-session-dot {
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: #2fbd6b;
+  flex-shrink: 0;
+}
+
+.home-stats {
+  display: flex;
+  gap: 0;
+  padding: 20px 0;
+  border-top: 1px solid var(--border);
+  border-bottom: 1px solid var(--border);
+  margin-bottom: 52px;
+}
+
+.home-stat {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-width: 0;
+}
+
+.home-stat--bordered {
+  padding-left: 32px;
+  border-left: 1px solid var(--border);
+}
+
+.home-stat-icon {
+  width: 32px;
+  height: 32px;
+  border-radius: 8px;
+  background: rgba(54, 136, 255, 0.1);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: #3688FF;
+}
+
+.home-stat-value {
+  font-size: 14px;
+  font-weight: 700;
+  color: var(--text);
+  letter-spacing: -0.02em;
+}
+
+.home-stat-value--mono {
+  font-family: monospace;
+  letter-spacing: 0.01em;
+}
+
+.home-stat-label {
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--muted);
+  text-transform: uppercase;
+  letter-spacing: 0.07em;
+  margin-top: 2px;
+}
+
+.home-next-label {
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--muted);
+  margin-bottom: 20px;
+}
+
+.home-next-list {
+  display: flex;
+  flex-direction: column;
+}
+
+.home-next-item {
+  display: grid;
+  grid-template-columns: 28px 1fr auto;
+  gap: 16px;
+  align-items: start;
+  padding: 20px 0;
+  border-top: 1px solid var(--border);
+  text-decoration: none;
+  color: inherit;
+  cursor: pointer;
+  transition: background 0.2s ease;
+  border-radius: 4px;
+}
+
+.home-next-item:hover .home-next-cta {
+  opacity: 1;
+}
+
+.home-next-n {
+  font-size: 11px;
+  font-weight: 700;
+  color: #3688FF;
+  letter-spacing: 0.05em;
+  padding-top: 2px;
+  font-variant-numeric: tabular-nums;
+}
+
+.home-next-body {
+  min-width: 0;
+}
+
+.home-next-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--text);
+  letter-spacing: -0.02em;
+  margin-bottom: 4px;
+}
+
+.home-next-desc {
+  font-size: 13px;
+  color: var(--muted);
+  line-height: 1.6;
+  letter-spacing: -0.01em;
+}
+
+.home-next-cta {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 13px;
+  font-weight: 600;
+  color: #3688FF;
+  white-space: nowrap;
+  opacity: 0.7;
+  transition: opacity 0.2s ease;
+  padding-top: 2px;
+}
+
+/* Profile page */
+.profile-main {
+  width: 100%;
+  max-width: 780px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+.profile-header {
+  display: flex;
+  align-items: center;
+  gap: 20px;
+  margin-bottom: 36px;
+}
+
+.profile-avatar-img {
+  width: 64px;
+  height: 64px;
+  border-radius: 50%;
+  object-fit: cover;
+}
+
+.profile-avatar-initials {
+  width: 64px;
+  height: 64px;
+  border-radius: 50%;
+  background: rgba(54, 136, 255, 0.12);
+  color: var(--blue);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 22px;
+  font-weight: 700;
+  flex-shrink: 0;
+}
+
+.profile-name {
+  font-size: 22px;
+  font-weight: 700;
+  color: var(--text);
+  letter-spacing: -0.03em;
+  margin: 0 0 4px;
+}
+
+.profile-email {
+  font-size: 13px;
+  color: var(--muted);
+  margin: 0;
+}
+
+.profile-section-label {
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--muted);
+  margin-bottom: 16px;
+}
+
+.profile-fields {
+  display: flex;
+  flex-direction: column;
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  overflow: hidden;
+}
+
+.profile-row {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  padding: 14px 20px;
+  border-bottom: 1px solid var(--border);
+}
+
+.profile-row:last-child {
+  border-bottom: none;
+}
+
+.profile-label {
+  font-size: 12px;
+  font-weight: 600;
+  color: var(--muted);
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  min-width: 110px;
+  flex-shrink: 0;
+}
+
+.profile-value {
+  font-size: 13px;
+  color: var(--text);
+  font-family: var(--font-mono, monospace);
+  word-break: break-all;
+}
+
+/* Token debug page */
+.token-main {
+  width: 100%;
+  max-width: 780px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+.token-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16px;
+  margin-bottom: 36px;
+  flex-wrap: wrap;
+}
+
+.token-title {
+  margin: 0 0 5px;
+  font-size: 22px;
+  font-weight: 700;
+  letter-spacing: -0.04em;
+  color: var(--text);
+}
+
+.token-subtitle {
+  margin: 0;
+  font-size: 13px;
+  color: var(--muted);
+  letter-spacing: -0.01em;
+}
+
+.token-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 7px;
+  padding: 6px 12px;
+  border-radius: 6px;
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: -0.01em;
+  flex-shrink: 0;
+}
+
+.token-badge--expired {
+  background: rgba(220, 38, 38, 0.08);
+  border: 1px solid rgba(220, 38, 38, 0.22);
+  color: #dc2626;
+}
+
+.token-badge--valid {
+  background: rgba(47, 189, 107, 0.08);
+  border: 1px solid rgba(47, 189, 107, 0.22);
+  color: #2fbd6b;
+}
+
+.token-badge-dot {
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: currentColor;
+  flex-shrink: 0;
+}
+
+.token-raw-section {
+  margin-bottom: 20px;
+}
+
+.token-raw-label-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 8px;
+}
+
+.token-section-label {
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--muted);
+}
+
+.token-copy-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  padding: 4px 10px;
+  border-radius: 5px;
+  background: transparent;
+  border: 1px solid var(--border);
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--muted);
+  cursor: pointer;
+  font-family: inherit;
+  letter-spacing: -0.01em;
+  transition: border-color 0.15s ease, color 0.15s ease;
+}
+
+.token-copy-btn:hover {
+  border-color: #3688FF;
+  color: #3688FF;
+}
+
+.token-raw {
+  display: block;
+  font-size: 11px;
+  font-family: monospace;
+  word-break: break-all;
+  line-height: 1.8;
+  background: #0b1120;
+  padding: 14px 16px;
+  border-radius: 8px;
+  overflow-x: auto;
+}
+
+.token-raw--loading {
+  color: rgba(255, 255, 255, 0.3);
+}
+
+.token-part--header   { color: #ff7b72; }
+.token-part--payload  { color: #79c0ff; }
+.token-part--signature { color: #3fb950; }
+.token-dot { color: rgba(255, 255, 255, 0.2); }
+
+.token-decoded-grid {
+  display: grid;
+  grid-template-columns: 1fr 1.7fr;
+  gap: 12px;
+  margin-bottom: 20px;
+}
+
+.token-code-box {
+  background: #0b1120;
+  border-radius: 10px;
+  overflow: hidden;
+}
+
+.token-code-box-header {
+  padding: 9px 14px;
+  font-size: 10px;
+  font-weight: 700;
+  letter-spacing: 0.09em;
+  text-transform: uppercase;
+}
+
+.token-code-box-header--header {
+  color: #ff7b72;
+  border-bottom: 1px solid rgba(255, 123, 114, 0.15);
+}
+
+.token-code-box-header--payload {
+  color: #79c0ff;
+  border-bottom: 1px solid rgba(121, 192, 255, 0.15);
+}
+
+.token-code-pre {
+  margin: 0;
+  padding: 14px;
+  font-size: 11.5px;
+  line-height: 1.8;
+  font-family: monospace;
+  color: #c9d1d9;
+  overflow-x: auto;
+  max-height: 220px;
+}
+
+.token-meta-row {
+  display: flex;
+  gap: 32px;
+  padding-top: 20px;
+  border-top: 1px solid var(--border);
+  flex-wrap: wrap;
+}
+
+.token-meta-label {
+  font-size: 10px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--muted);
+  margin-bottom: 5px;
+}
+
+.token-meta-value {
+  font-size: 12px;
+  font-family: monospace;
+  color: var(--text);
+  letter-spacing: -0.01em;
+}
diff --git a/samples/browser/quickstart/vite.config.js b/samples/browser/quickstart/vite.config.js
new file mode 100644
index 0000000..0515e7a
--- /dev/null
+++ b/samples/browser/quickstart/vite.config.js
@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite'
+
+export default defineConfig({
+  build: {
+    target: 'esnext',
+  },
+})
diff --git a/samples/express/quickstart/.env.example b/samples/express/quickstart/.env.example
new file mode 100644
index 0000000..afb9813
--- /dev/null
+++ b/samples/express/quickstart/.env.example
@@ -0,0 +1,3 @@
+THUNDERID_CLIENT_ID=your-client-id-here
+THUNDERID_CLIENT_SECRET=your-client-secret-here
+THUNDERID_BASE_URL=https://localhost:8090
diff --git a/samples/express/quickstart/README.md b/samples/express/quickstart/README.md
new file mode 100644
index 0000000..4d47c29
--- /dev/null
+++ b/samples/express/quickstart/README.md
@@ -0,0 +1,38 @@
+# ThunderID Express Quickstart
+
+A minimal Express.js app demonstrating sign-in, sign-out, and route protection with the ThunderID JavaScript SDK (`@thunderid/express`).
+
+## Prerequisites
+
+- Node.js 18+
+- A running ThunderID instance (default: `https://localhost:8090`)
+- A configured application with `http://localhost:3000/login` added as an authorized redirect URI
+
+## Getting started
+
+1. Copy the environment file and fill in your values:
+   ```sh
+   cp .env.example .env
+   ```
+
+2. Edit `.env` with your ThunderID application credentials:
+   ```
+   THUNDERID_CLIENT_ID=<your-client-id>
+   THUNDERID_CLIENT_SECRET=<your-client-secret>
+   THUNDERID_BASE_URL=https://localhost:8090
+   ```
+
+3. Install dependencies and start the server:
+   ```sh
+   pnpm install
+   pnpm start
+   ```
+
+Open [http://localhost:3000](http://localhost:3000) in your browser.
+
+> **Note:** Ensure `http://localhost:3000/login` is registered as an authorized redirect URI in your ThunderID application settings.
+
+## Learn more
+
+- [ThunderID Docs](https://thunderid.dev/docs)
+- [`@thunderid/express` SDK reference](https://thunderid.dev/docs/sdks/javascript/express)
diff --git a/samples/express/quickstart/index.js b/samples/express/quickstart/index.js
new file mode 100644
index 0000000..35dcc23
--- /dev/null
+++ b/samples/express/quickstart/index.js
@@ -0,0 +1,69 @@
+const express = require('express');
+const cookieParser = require('cookie-parser');
+const { thunderID, handleSignIn, handleSignOut, protect } = require('@thunderid/express');
+
+const app = express();
+const port = 3000;
+
+app.use(cookieParser());
+app.use(express.json());
+
+app.use(
+  thunderID({
+    baseUrl: process.env.THUNDERID_BASE_URL || 'https://localhost:8090',
+    clientId: process.env.THUNDERID_CLIENT_ID,
+    clientSecret: process.env.THUNDERID_CLIENT_SECRET,
+    afterSignInUrl: 'http://localhost:3000/login',
+    afterSignOutUrl: 'http://localhost:3000/logout',
+  }),
+);
+
+app.get('/', (_req, res) => {
+  res.send('<a href="/protected">Protected page</a> | <a href="/profile">Profile</a> | <a href="/login">Sign in</a>');
+});
+
+app.get('/login', handleSignIn());
+app.get('/logout', handleSignOut());
+
+app.get(
+  '/protected',
+  protect((res) => res.redirect('/login')),
+  (_req, res) => {
+    res.send('You are signed in. <a href="/profile">View profile</a> | <a href="/logout">Sign out</a>');
+  },
+);
+
+app.get('/profile', protect((res) => res.redirect('/login')), async (req, res) => {
+  const user = await req.thunderIDAuth.getUserFromRequest(req);
+  const esc = (s) => s == null ? '' : String(s).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
+  const displayName = esc(user.name || [user.given_name, user.family_name].filter(Boolean).join(' ') || user.username);
+  const row = (label, val) => val ? `<tr><th>${label}</th><td>${esc(val)}</td></tr>` : '';
+  res.send(`<!DOCTYPE html>
+<html lang="en"><head><meta charset="UTF-8"><title>Profile</title>
+<style>body{font-family:system-ui,sans-serif;max-width:560px;margin:60px auto;padding:0 24px;color:#05213f}
+h1{font-size:22px;font-weight:700;margin:0 0 4px}p.email{font-size:14px;color:#5a7085;margin:0 0 32px}
+table{width:100%;border-collapse:collapse}th,td{padding:12px 16px;text-align:left;font-size:14px;border-bottom:1px solid #dde3ec}
+th{width:140px;font-weight:600;color:#5a7085;text-transform:uppercase;font-size:11px;letter-spacing:.06em}
+td{font-family:monospace;word-break:break-all}a{color:#3688ff;text-decoration:none}a:hover{text-decoration:underline}</style>
+</head><body>
+<h1>${displayName}</h1>
+${user.email ? `<p class="email">${esc(user.email)}</p>` : ''}
+<table>
+${row('First name', user.given_name)}
+${row('Last name', user.family_name)}
+${row('Username', user.username)}
+${row('Email', user.email)}
+${row('User ID', user.sub || user.id)}
+</table>
+<p style="margin-top:32px"><a href="/">← Home</a> · <a href="/logout">Sign out</a></p>
+</body></html>`);
+});
+
+app.get('/me', protect(), async (req, res) => {
+  const user = await req.thunderIDAuth.getUserFromRequest(req);
+  res.json(user);
+});
+
+app.listen(port, () => {
+  console.log(`Server running on http://localhost:${port}`);
+});
diff --git a/samples/express/quickstart/package.json b/samples/express/quickstart/package.json
new file mode 100644
index 0000000..7101013
--- /dev/null
+++ b/samples/express/quickstart/package.json
@@ -0,0 +1,14 @@
+{
+  "name": "@thunderid/express-quickstart",
+  "private": true,
+  "version": "0.0.0",
+  "scripts": {
+    "start": "node index.js",
+    "dev": "node --watch index.js"
+  },
+  "dependencies": {
+    "@thunderid/express": "workspace:*",
+    "cookie-parser": "^1.4.7",
+    "express": "^4.21.2"
+  }
+}
diff --git a/samples/nextjs/quickstart/.env.example b/samples/nextjs/quickstart/.env.example
new file mode 100644
index 0000000..b542468
--- /dev/null
+++ b/samples/nextjs/quickstart/.env.example
@@ -0,0 +1,4 @@
+NEXT_PUBLIC_THUNDERID_BASE_URL=https://localhost:8090
+NEXT_PUBLIC_THUNDERID_CLIENT_ID=your-client-id-here
+THUNDERID_CLIENT_SECRET=your-client-secret-here
+THUNDERID_SECRET=generate-with-openssl-rand-base64-32
diff --git a/samples/nextjs/quickstart/README.md b/samples/nextjs/quickstart/README.md
new file mode 100644
index 0000000..2aef767
--- /dev/null
+++ b/samples/nextjs/quickstart/README.md
@@ -0,0 +1,40 @@
+# ThunderID Next.js Quickstart
+
+A minimal Next.js 15 App Router application demonstrating ThunderID authentication with OAuth 2.0, PKCE, and JWT out of the box.
+
+## Prerequisites
+
+- Node.js 18+
+- pnpm
+- A ThunderID application (create one at [thunderid.dev](https://thunderid.dev))
+
+## Getting started
+
+1. Copy the example environment file:
+
+   ```bash
+   cp .env.example .env.local
+   ```
+
+2. Fill in your ThunderID credentials in `.env.local`:
+
+   ```
+   NEXT_PUBLIC_THUNDERID_BASE_URL=https://localhost:8090
+   NEXT_PUBLIC_THUNDERID_CLIENT_ID=<your-client-id>
+   THUNDERID_CLIENT_SECRET=<your-client-secret>
+   THUNDERID_SECRET=<run: openssl rand -base64 32>
+   ```
+
+3. In your ThunderID application settings, add the following as an authorized redirect URL:
+
+   ```
+   http://localhost:3000
+   ```
+
+4. Start the development server:
+
+   ```bash
+   pnpm dev
+   ```
+
+   The app is now running at [http://localhost:3000](http://localhost:3000).
diff --git a/samples/nextjs/quickstart/app/actions.ts b/samples/nextjs/quickstart/app/actions.ts
new file mode 100644
index 0000000..6a72ed3
--- /dev/null
+++ b/samples/nextjs/quickstart/app/actions.ts
@@ -0,0 +1,19 @@
+'use server'
+
+import { thunderid } from '@thunderid/nextjs/server'
+
+/**
+ * Fetch the raw access token JWT for the current session.
+ * Tokens are kept server-side — this Server Action is the only way a
+ * client component can retrieve them without exposing the session cookie.
+ */
+export async function fetchAccessToken(): Promise<string | undefined> {
+  try {
+    const sdk = await thunderid()
+    const sessionId = await sdk.getSessionId()
+    if (!sessionId) return undefined
+    return await sdk.getAccessToken(sessionId)
+  } catch {
+    return undefined
+  }
+}
diff --git a/samples/nextjs/quickstart/app/components/HeroCtas.tsx b/samples/nextjs/quickstart/app/components/HeroCtas.tsx
new file mode 100644
index 0000000..df5e65f
--- /dev/null
+++ b/samples/nextjs/quickstart/app/components/HeroCtas.tsx
@@ -0,0 +1,23 @@
+'use client'
+import { SignInButton, SignUpButton } from '@thunderid/nextjs'
+
+export default function HeroCtas() {
+  return (
+    <div className="hero-ctas">
+      <SignUpButton>
+        {({ signUp, isLoading }) => (
+          <button className="btn-primary" onClick={() => { void signUp?.() }} disabled={isLoading}>
+            {isLoading ? 'Signing up…' : 'Get started'}
+          </button>
+        )}
+      </SignUpButton>
+      <SignInButton>
+        {({ signIn, isLoading }) => (
+          <button className="btn-outline" onClick={() => { void signIn?.() }} disabled={isLoading}>
+            {isLoading ? 'Signing in…' : 'Sign in'}
+          </button>
+        )}
+      </SignInButton>
+    </div>
+  )
+}
diff --git a/samples/nextjs/quickstart/app/components/Nav.tsx b/samples/nextjs/quickstart/app/components/Nav.tsx
new file mode 100644
index 0000000..9e0b1aa
--- /dev/null
+++ b/samples/nextjs/quickstart/app/components/Nav.tsx
@@ -0,0 +1,119 @@
+'use client'
+import { usePathname } from 'next/navigation'
+import Link from 'next/link'
+import { SignedIn, SignedOut, SignInButton, SignUpButton, UserDropdown } from '@thunderid/nextjs'
+import { useState } from 'react'
+import ThunderMark from './ThunderMark'
+
+function MoonIcon() {
+  return (
+    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round">
+      <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/>
+    </svg>
+  )
+}
+
+function SunIcon() {
+  return (
+    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round">
+      <circle cx="12" cy="12" r="5"/>
+      <line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/>
+      <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/>
+      <line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/>
+      <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/>
+    </svg>
+  )
+}
+
+function ChevronLeftIcon() {
+  return (
+    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <polyline points="15 18 9 12 15 6" />
+    </svg>
+  )
+}
+
+function KeyIcon() {
+  return (
+    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <circle cx="7.5" cy="15.5" r="5.5" />
+      <path d="M21 2l-9.6 9.6" />
+      <path d="M15.5 7.5l3 3L22 7l-3-3" />
+    </svg>
+  )
+}
+
+function UserIcon() {
+  return (
+    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <circle cx="12" cy="8" r="4" />
+      <path d="M4 20c0-4 3.6-7 8-7s8 3 8 7" />
+    </svg>
+  )
+}
+
+export default function Nav() {
+  const [dark, setDark] = useState(false)
+  const pathname = usePathname()
+  const isHome = pathname === '/'
+
+  const toggle = () => {
+    const next = !dark
+    setDark(next)
+    document.documentElement.classList.toggle('dark', next)
+  }
+
+  const menuItems = [
+    {
+      label: <span style={{ display: 'flex', alignItems: 'center', gap: 8 }}><UserIcon />Profile</span>,
+      href: '/profile',
+    },
+    {
+      label: <span style={{ display: 'flex', alignItems: 'center', gap: 8 }}><KeyIcon />Token debug</span>,
+      href: '/token',
+    },
+  ]
+
+  return (
+    <nav className="nav">
+      <Link href="/" className="nav-logo">
+        <ThunderMark height={24} darkMode={dark} />
+        <div className="wordmark">
+          <span className="wordmark-name">ThunderID</span>
+          <span className="wordmark-sub">Quickstart</span>
+        </div>
+      </Link>
+      <div style={{ flex: 1 }} />
+      <div className="nav-actions">
+        {!isHome && (
+          <Link href="/" className="nav-back-btn">
+            <ChevronLeftIcon />
+            Home
+          </Link>
+        )}
+        <button className="dark-toggle" onClick={toggle} aria-label={dark ? 'Light mode' : 'Dark mode'}>
+          {dark ? <SunIcon /> : <MoonIcon />}
+        </button>
+        <SignedIn>
+          <UserDropdown showTriggerLabel menuItems={menuItems} />
+        </SignedIn>
+        <SignedOut>
+          <SignInButton>
+            {({ signIn, isLoading }) => (
+              <button className="btn-ghost" onClick={() => { void signIn?.() }} disabled={isLoading}>
+                {isLoading ? 'Signing in…' : 'Sign in'}
+              </button>
+            )}
+          </SignInButton>
+          <SignUpButton>
+            {({ signUp, isLoading }) => (
+              <button className="btn-primary" onClick={() => { void signUp?.() }} disabled={isLoading}>
+                {isLoading ? 'Signing up…' : 'Sign up'}
+              </button>
+            )}
+          </SignUpButton>
+        </SignedOut>
+      </div>
+    </nav>
+  )
+}
diff --git a/samples/nextjs/quickstart/app/components/ThunderMark.tsx b/samples/nextjs/quickstart/app/components/ThunderMark.tsx
new file mode 100644
index 0000000..d8cf0ab
--- /dev/null
+++ b/samples/nextjs/quickstart/app/components/ThunderMark.tsx
@@ -0,0 +1,36 @@
+export default function ThunderMark({
+  height = 40,
+  className,
+  darkMode = false,
+}: {
+  height?: number
+  className?: string
+  darkMode?: boolean
+}) {
+  const width = Math.round((height / 257) * 207)
+
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 207 257"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      aria-label="ThunderID"
+    >
+      <path
+        d="M55.4763 26.4391L58.8866 0H0V26.4391H55.4763Z"
+        fill={darkMode ? '#E8F4FF' : '#05213F'}
+      />
+      <path
+        d="M39.8438 147.407L49.5455 72.2839H4.9909e-05V256.743H60.5602L80.048 147.407H39.8438Z"
+        fill="#3688FF"
+      />
+      <path
+        d="M192.42 59.361C182.782 40.2307 168.929 25.5705 150.903 15.3381C145.501 12.2662 139.761 9.6605 133.703 7.5208L115.401 103.702H159.757L76.2987 256.743H83.3735C109.449 256.743 131.69 251.574 150.14 241.236C168.569 230.897 182.634 216.131 192.356 196.959C202.058 177.765 206.909 154.8 206.909 128.043C206.909 101.286 202.079 78.5123 192.441 59.3821L192.42 59.361Z"
+        fill="#3688FF"
+      />
+    </svg>
+  )
+}
diff --git a/samples/nextjs/quickstart/app/globals.css b/samples/nextjs/quickstart/app/globals.css
new file mode 100644
index 0000000..b5f71b8
--- /dev/null
+++ b/samples/nextjs/quickstart/app/globals.css
@@ -0,0 +1,889 @@
+/* ── Reset ── */
+*,
+::before,
+::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+/* ── Design tokens ── */
+:root {
+  --color-bg: #f7f9fc;
+  --color-card: #ffffff;
+  --color-border: #dde3ec;
+  --color-text: #05213f;
+  --color-text-muted: #5a7085;
+  --color-muted: #5a7085;
+  --color-primary: #3688ff;
+  --color-primary-hover: #1f72f0;
+  --color-nav-bg: rgba(247, 249, 252, 0.92);
+  --color-nav-border: #dde3ec;
+  --shadow-card: 0 1px 3px 0 rgba(5, 33, 63, 0.06),
+    0 4px 12px 0 rgba(5, 33, 63, 0.08);
+  --font-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
+    sans-serif;
+  --radius-card: 12px;
+  --radius-btn: 8px;
+}
+
+/* ── Dark mode ── */
+.dark,
+html.dark {
+  --color-bg: #080f1c;
+  --color-card: #0f1a2d;
+  --color-border: rgba(255, 255, 255, 0.09);
+  --color-text: #E0EAFF;
+  --color-text-muted: rgba(224, 234, 255, 0.48);
+  --color-muted: rgba(224, 234, 255, 0.48);
+  --color-nav-bg: rgba(8, 15, 28, 0.92);
+}
+
+/* ── Base ── */
+html,
+body {
+  height: 100%;
+}
+
+body {
+  font-family: var(--font-sans);
+  background: var(--color-bg);
+  color: var(--color-text);
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  line-height: 1.5;
+}
+
+/* ── App shell ── */
+.app {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: var(--color-bg);
+  color: var(--color-text);
+  transition: background 0.2s, color 0.2s;
+}
+
+/* ── Navigation ── */
+.nav {
+  position: fixed;
+  inset-block-start: 0;
+  inset-inline: 0;
+  height: 52px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 24px;
+  background: var(--color-nav-bg);
+  border-bottom: 1px solid var(--color-nav-border);
+  z-index: 100;
+  transition: background 0.2s, border-color 0.2s;
+}
+
+.nav-brand {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  text-decoration: none;
+  color: var(--color-text);
+}
+
+.nav-logo {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  text-decoration: none;
+  color: var(--color-text);
+}
+
+.nav-wordmark {
+  font-size: 15px;
+  font-weight: 700;
+  letter-spacing: -0.02em;
+  color: var(--color-text);
+}
+
+.wordmark {
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+}
+
+.wordmark-name {
+  font-size: 14px;
+  font-weight: 700;
+  letter-spacing: -0.03em;
+  color: var(--color-text);
+  line-height: 1;
+}
+
+.wordmark-sub {
+  font-size: 8.5px;
+  font-weight: 700;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: var(--color-primary);
+  line-height: 1;
+}
+
+.nav-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.dark-toggle {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  padding: 0;
+  background: transparent;
+  border: none;
+  border-radius: var(--radius-btn);
+  color: var(--color-text-muted);
+  cursor: pointer;
+  transition: color 0.15s, background 0.15s;
+}
+
+.dark-toggle:hover {
+  color: var(--color-text);
+  background: rgba(54, 136, 255, 0.06);
+}
+
+/* ── Buttons ── */
+button {
+  font-family: var(--font-sans);
+  cursor: pointer;
+  border: none;
+  border-radius: var(--radius-btn);
+  font-weight: 600;
+  transition: background 0.15s, color 0.15s, border-color 0.15s, opacity 0.15s;
+  line-height: 1;
+  white-space: nowrap;
+}
+
+button:focus-visible {
+  outline: 2px solid var(--color-primary);
+  outline-offset: 2px;
+}
+
+.btn-primary,
+.btn-outline,
+.btn-ghost {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 46px;
+  padding: 0 24px;
+  font-size: 15px;
+  text-decoration: none;
+}
+
+.btn-primary {
+  background: var(--color-primary);
+  color: #ffffff;
+  border: 1.5px solid var(--color-primary);
+}
+
+.btn-primary:hover {
+  opacity: 0.88;
+}
+
+.btn-outline {
+  background: transparent;
+  color: var(--color-primary);
+  border: 1.5px solid rgba(54, 136, 255, 0.4);
+}
+
+.btn-outline:hover {
+  background: rgba(54, 136, 255, 0.08);
+}
+
+.btn-ghost {
+  background: transparent;
+  color: var(--color-muted);
+  border: none;
+}
+
+.btn-ghost:hover {
+  color: var(--color-text);
+  background: rgba(0, 0, 0, 0.04);
+}
+
+/* Nav-sized buttons */
+.nav .btn-primary,
+.nav .btn-outline,
+.nav .btn-ghost {
+  height: 36px;
+  padding: 0 16px;
+  font-size: 14px;
+}
+
+/* ── Hero section ── */
+.hero {
+  flex: 1;
+  padding: 96px 32px 80px;
+  min-height: 100vh;
+}
+
+.hero-inner {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  gap: 20px;
+  max-width: 560px;
+  width: 100%;
+  margin: 0 auto;
+}
+
+.hero-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 10px;
+  font-weight: 600;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: var(--color-text-muted);
+}
+
+.hero-badge-line {
+  display: block;
+  width: 24px;
+  height: 1px;
+  background: var(--color-border);
+  flex-shrink: 0;
+}
+
+.hero-title {
+  font-size: 42px;
+  font-weight: 700;
+  letter-spacing: -0.05em;
+  color: var(--color-text);
+  line-height: 1.1;
+}
+
+.hero-subtitle {
+  font-size: 16px;
+  color: var(--color-text-muted);
+  max-width: 420px;
+  line-height: 1.8;
+  letter-spacing: -0.01em;
+}
+
+.hero-ctas {
+  display: flex;
+  gap: 12px;
+  flex-wrap: wrap;
+  justify-content: center;
+  margin-top: 4px;
+}
+
+.hero-divider {
+  width: 100%;
+  border: none;
+  border-top: 1px solid var(--color-border);
+  margin: 8px 0;
+}
+
+/* ── Stats row ── */
+.hero-stats {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  width: 100%;
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-card);
+  overflow: hidden;
+}
+
+.hero-stat {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+  padding: 20px 16px;
+  position: relative;
+}
+
+.hero-stat + .hero-stat::before {
+  content: '';
+  position: absolute;
+  left: 0;
+  top: 20%;
+  height: 60%;
+  width: 1px;
+  background: var(--color-border);
+}
+
+.hero-stat-value {
+  font-size: 15px;
+  font-weight: 700;
+  color: var(--color-text);
+  letter-spacing: -0.02em;
+}
+
+.hero-stat-label {
+  font-size: 12px;
+  color: var(--color-text-muted);
+}
+
+/* ── User / welcome card ── */
+.user-card {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 16px;
+  background: var(--color-card);
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-card);
+  padding: 32px;
+  max-width: 480px;
+  width: 100%;
+  box-shadow: var(--shadow-card);
+}
+
+.user-avatar {
+  width: 48px;
+  height: 48px;
+  border-radius: 50%;
+  background: var(--color-primary);
+  color: #ffffff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 17px;
+  font-weight: 700;
+  letter-spacing: 0.02em;
+  flex-shrink: 0;
+}
+
+.user-welcome {
+  font-size: 1.375rem;
+  font-weight: 700;
+  letter-spacing: -0.02em;
+  color: var(--color-text);
+  text-align: center;
+}
+
+.user-details {
+  display: flex;
+  flex-direction: column;
+  gap: 0;
+  width: 100%;
+  border: 1px solid var(--color-border);
+  border-radius: 8px;
+  overflow: hidden;
+}
+
+.user-detail-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 10px 16px;
+  gap: 16px;
+}
+
+.user-detail-row + .user-detail-row {
+  border-top: 1px solid var(--color-border);
+}
+
+.user-detail-row dt {
+  font-size: 13px;
+  color: var(--color-text-muted);
+  font-weight: 500;
+  flex-shrink: 0;
+}
+
+.user-detail-row dd {
+  font-size: 13px;
+  color: var(--color-text);
+  font-weight: 500;
+  text-align: right;
+  word-break: break-all;
+}
+
+/* ── Signed-in home shell ── */
+.home-shell {
+  min-height: calc(100vh - 52px);
+  margin-top: 52px;
+}
+
+/* ── Signed-in home page ── */
+.home-main {
+  width: 100%;
+  max-width: 900px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+/* Greeting */
+.home-greeting {
+  display: flex;
+  align-items: flex-start;
+  gap: 16px;
+  margin-bottom: 36px;
+}
+
+.home-avatar {
+  width: 52px;
+  height: 52px;
+  border-radius: 50%;
+  background: var(--color-primary);
+  color: #ffffff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 18px;
+  font-weight: 700;
+  letter-spacing: 0.02em;
+  flex-shrink: 0;
+}
+
+.home-greeting-text {
+  min-width: 0;
+}
+
+.home-greeting-name {
+  margin: 0 0 6px;
+  font-size: 26px;
+  font-weight: 700;
+  color: var(--color-text);
+  letter-spacing: -0.04em;
+}
+
+.home-greeting-meta {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 13px;
+  color: var(--color-muted);
+  letter-spacing: -0.01em;
+  flex-wrap: wrap;
+}
+
+.home-dot {
+  display: inline-block;
+  width: 3px;
+  height: 3px;
+  border-radius: 50%;
+  background: var(--color-border);
+  flex-shrink: 0;
+}
+
+.home-session-active {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  color: #2fbd6b;
+}
+
+.home-session-dot {
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: #2fbd6b;
+  flex-shrink: 0;
+}
+
+/* Session stats row */
+.home-stats {
+  display: flex;
+  gap: 0;
+  padding: 20px 0;
+  border-top: 1px solid var(--color-border);
+  border-bottom: 1px solid var(--color-border);
+  margin-bottom: 52px;
+}
+
+.home-stat {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-width: 0;
+}
+
+.home-stat--bordered {
+  padding-left: 32px;
+  border-left: 1px solid var(--color-border);
+}
+
+.home-stat-icon {
+  width: 32px;
+  height: 32px;
+  border-radius: 8px;
+  background: rgba(54, 136, 255, 0.1);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: #3688ff;
+}
+
+.home-stat-value {
+  font-size: 14px;
+  font-weight: 700;
+  color: var(--color-text);
+  letter-spacing: -0.02em;
+}
+
+.home-stat-value--mono {
+  font-family: monospace;
+  letter-spacing: 0.01em;
+}
+
+.home-stat-label {
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--color-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.07em;
+  margin-top: 2px;
+}
+
+/* What's next */
+.home-next-label {
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-muted);
+  margin-bottom: 20px;
+}
+
+.home-next-list {
+  display: flex;
+  flex-direction: column;
+}
+
+.home-next-item {
+  display: grid;
+  grid-template-columns: 28px 1fr auto;
+  gap: 16px;
+  align-items: start;
+  padding: 20px 0;
+  border-top: 1px solid var(--color-border);
+  text-decoration: none;
+  color: inherit;
+  cursor: pointer;
+  transition: background 0.2s;
+  border-radius: 4px;
+}
+
+.home-next-item:hover .home-next-cta {
+  opacity: 1;
+}
+
+.home-next-n {
+  font-size: 11px;
+  font-weight: 700;
+  color: #3688ff;
+  letter-spacing: 0.05em;
+  padding-top: 2px;
+  font-variant-numeric: tabular-nums;
+}
+
+.home-next-body {
+  min-width: 0;
+}
+
+.home-next-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--color-text);
+  letter-spacing: -0.02em;
+  margin-bottom: 4px;
+}
+
+.home-next-desc {
+  font-size: 13px;
+  color: var(--color-muted);
+  line-height: 1.6;
+  letter-spacing: -0.01em;
+}
+
+.home-next-cta {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 13px;
+  font-weight: 600;
+  color: #3688ff;
+  white-space: nowrap;
+  opacity: 0.7;
+  transition: opacity 0.2s;
+  padding-top: 2px;
+}
+
+/* ── Nav back button ── */
+.nav-back-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  height: 32px;
+  padding: 0 10px;
+  border-radius: 6px;
+  border: none;
+  background: transparent;
+  color: var(--color-muted);
+  font-size: 13px;
+  font-family: var(--font-sans);
+  letter-spacing: -0.01em;
+  cursor: pointer;
+  transition: background 0.2s, color 0.2s;
+}
+
+.nav-back-btn:hover {
+  background: var(--color-border);
+  color: var(--color-text);
+}
+
+/* ── Profile page ── */
+.profile-main {
+  width: 100%;
+  max-width: 780px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+/* ── Token debug page ── */
+.token-main {
+  width: 100%;
+  max-width: 780px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+.token-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16px;
+  margin-bottom: 36px;
+  flex-wrap: wrap;
+}
+
+.token-title {
+  margin: 0 0 5px;
+  font-size: 22px;
+  font-weight: 700;
+  letter-spacing: -0.04em;
+  color: var(--color-text);
+}
+
+.token-subtitle {
+  margin: 0;
+  font-size: 13px;
+  color: var(--color-muted);
+  letter-spacing: -0.01em;
+}
+
+.token-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 7px;
+  padding: 6px 12px;
+  border-radius: 6px;
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: -0.01em;
+  flex-shrink: 0;
+}
+
+.token-badge--expired {
+  background: rgba(220, 38, 38, 0.08);
+  border: 1px solid rgba(220, 38, 38, 0.22);
+  color: #dc2626;
+}
+
+.token-badge--valid {
+  background: rgba(47, 189, 107, 0.08);
+  border: 1px solid rgba(47, 189, 107, 0.22);
+  color: #2fbd6b;
+}
+
+.token-badge-dot {
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: currentColor;
+  flex-shrink: 0;
+}
+
+/* Raw token section */
+.token-raw-section {
+  margin-bottom: 20px;
+}
+
+.token-raw-label-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 8px;
+}
+
+.token-section-label {
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-muted);
+}
+
+.token-copy-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  padding: 4px 10px;
+  border-radius: 5px;
+  background: transparent;
+  border: 1px solid var(--color-border);
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--color-muted);
+  cursor: pointer;
+  font-family: var(--font-sans);
+  letter-spacing: -0.01em;
+  transition: border-color 0.2s, color 0.2s;
+}
+
+.token-copy-btn:hover {
+  border-color: #3688ff;
+  color: #3688ff;
+}
+
+.token-raw {
+  display: block;
+  font-size: 11px;
+  font-family: monospace;
+  word-break: break-all;
+  line-height: 1.8;
+  background: #0b1120;
+  padding: 14px 16px;
+  border-radius: 8px;
+  overflow-x: auto;
+}
+
+.token-raw--loading {
+  color: rgba(255, 255, 255, 0.3);
+}
+
+.token-part--header   { color: #ff7b72; }
+.token-part--payload  { color: #79c0ff; }
+.token-part--signature { color: #3fb950; }
+
+.token-dot {
+  color: rgba(255, 255, 255, 0.2);
+}
+
+/* Decoded grid */
+.token-decoded-grid {
+  display: grid;
+  grid-template-columns: 1fr 1.7fr;
+  gap: 12px;
+  margin-bottom: 20px;
+}
+
+.token-code-box {
+  background: #0b1120;
+  border-radius: 10px;
+  overflow: hidden;
+}
+
+.token-code-box-header {
+  padding: 9px 14px;
+  font-size: 10px;
+  font-weight: 700;
+  letter-spacing: 0.09em;
+  text-transform: uppercase;
+}
+
+.token-code-box-header--header {
+  color: #ff7b72;
+  border-bottom: 1px solid rgba(255, 123, 114, 0.15);
+}
+
+.token-code-box-header--payload {
+  color: #79c0ff;
+  border-bottom: 1px solid rgba(121, 192, 255, 0.15);
+}
+
+.token-code-pre {
+  margin: 0;
+  padding: 14px;
+  font-size: 11.5px;
+  line-height: 1.8;
+  font-family: monospace;
+  color: #c9d1d9;
+  overflow-x: auto;
+  max-height: 220px;
+}
+
+/* Meta row */
+.token-meta-row {
+  display: flex;
+  gap: 32px;
+  padding-top: 20px;
+  border-top: 1px solid var(--color-border);
+  flex-wrap: wrap;
+}
+
+.token-meta-label {
+  font-size: 10px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-muted);
+  margin-bottom: 5px;
+}
+
+.token-meta-value {
+  font-size: 12px;
+  font-family: monospace;
+  color: var(--color-text);
+  letter-spacing: -0.01em;
+}
+
+/* ── Responsive ── */
+@media (max-width: 480px) {
+  .nav {
+    padding: 0 16px;
+  }
+
+  .nav-wordmark {
+    display: none;
+  }
+
+  .hero {
+    padding: 80px 16px 32px;
+  }
+
+  .hero-title {
+    font-size: 2rem;
+  }
+
+  .hero-stats {
+    grid-template-columns: 1fr;
+  }
+
+  .hero-stat + .hero-stat::before {
+    top: 0;
+    left: 20%;
+    width: 60%;
+    height: 1px;
+  }
+
+  .hero-ctas {
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .user-card {
+    padding: 24px 16px;
+  }
+}
diff --git a/samples/nextjs/quickstart/app/layout.tsx b/samples/nextjs/quickstart/app/layout.tsx
new file mode 100644
index 0000000..1504fde
--- /dev/null
+++ b/samples/nextjs/quickstart/app/layout.tsx
@@ -0,0 +1,26 @@
+import type { Metadata } from 'next'
+import { ThunderIDProvider } from '@thunderid/nextjs/server'
+import './globals.css'
+
+export const dynamic = 'force-dynamic'
+
+export const metadata: Metadata = {
+  title: 'ThunderID Next.js Quickstart',
+  description: 'ThunderID authentication with Next.js',
+}
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <html lang="en">
+      <body>
+        <ThunderIDProvider>
+          {children}
+        </ThunderIDProvider>
+      </body>
+    </html>
+  )
+}
diff --git a/samples/nextjs/quickstart/app/not-found.tsx b/samples/nextjs/quickstart/app/not-found.tsx
new file mode 100644
index 0000000..53bd47d
--- /dev/null
+++ b/samples/nextjs/quickstart/app/not-found.tsx
@@ -0,0 +1,13 @@
+import Link from 'next/link'
+
+export default function NotFound() {
+  return (
+    <div className="app">
+      <main style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', minHeight: '60vh', gap: '1rem', textAlign: 'center' }}>
+        <h2 style={{ fontSize: '1.5rem', fontWeight: 600 }}>Page not found</h2>
+        <p style={{ color: 'var(--color-muted, #888)' }}>The page you&apos;re looking for doesn&apos;t exist.</p>
+        <Link href="/" style={{ color: 'var(--color-accent, #0070f3)', textDecoration: 'none' }}>Return home</Link>
+      </main>
+    </div>
+  )
+}
diff --git a/samples/nextjs/quickstart/app/page.tsx b/samples/nextjs/quickstart/app/page.tsx
new file mode 100644
index 0000000..bf6e80c
--- /dev/null
+++ b/samples/nextjs/quickstart/app/page.tsx
@@ -0,0 +1,266 @@
+'use client'
+import { SignedIn, SignedOut, User, useThunderID } from '@thunderid/nextjs'
+import { useState, useEffect } from 'react'
+import { fetchAccessToken } from './actions'
+import HeroCtas from './components/HeroCtas'
+import Nav from './components/Nav'
+import ThunderMark from './components/ThunderMark'
+
+function greeting(name: string): string {
+  const h = new Date().getHours()
+  const tod = h < 12 ? 'morning' : h < 17 ? 'afternoon' : 'evening'
+  return `Good ${tod}, ${name}.`
+}
+
+function formatTime(unixSeconds: number | undefined): string {
+  if (!unixSeconds) return '—'
+  return new Date(unixSeconds * 1000).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })
+}
+
+function formatCountdown(secsLeft: number): { text: string; color: string } {
+  if (secsLeft <= 0) return { text: 'Expired', color: '#d95757' }
+  if (secsLeft < 300) {
+    const m = Math.floor(secsLeft / 60), s = secsLeft % 60
+    return { text: `${m}m ${s}s`, color: '#e88b3a' }
+  }
+  if (secsLeft < 3600) {
+    const m = Math.floor(secsLeft / 60), s = secsLeft % 60
+    return { text: `${m}m ${s}s`, color: '#2fbd6b' }
+  }
+  const hr = Math.floor(secsLeft / 3600), m = Math.floor((secsLeft % 3600) / 60)
+  return { text: `${hr}h ${m}m`, color: '#2fbd6b' }
+}
+
+const NEXT_STEPS = [
+  {
+    n: '01',
+    title: 'Explore use cases',
+    body: 'See what you can build — auth flows for web, mobile, APIs, and agents.',
+    cta: 'Browse use cases',
+    href: 'https://thunderid.dev/docs/next/use-cases/overview/',
+  },
+  {
+    n: '02',
+    title: 'Learn about flows',
+    body: 'Understand how authorization code, PKCE, client credentials, and device flows work.',
+    cta: 'Read guide',
+    href: 'https://thunderid.dev/docs/next/guides/guides/flows/what-are-flows/',
+  },
+  {
+    n: '03',
+    title: 'Style your experience',
+    body: 'Customize the login UI, branding, and email templates to match your product.',
+    cta: 'Design guide',
+    href: 'https://thunderid.dev/docs/next/guides/guides/design/overview/',
+  },
+  {
+    n: '04',
+    title: 'Explore SDK APIs',
+    body: 'Full Next.js SDK reference — hooks, components, and configuration options.',
+    cta: 'SDK reference',
+    href: 'https://thunderid.dev/docs/next/sdks/nextjs/overview/',
+  },
+]
+
+function ClockIcon() {
+  return (
+    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <circle cx="12" cy="12" r="10" /><polyline points="12 6 12 12 16 14" />
+    </svg>
+  )
+}
+
+function TimerIcon() {
+  return (
+    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <path d="M10 2h4" /><path d="M12 14v-4" />
+      <path d="M4 13a8 8 0 0 1 8-7 8 8 0 1 1-5.3 14L4 17.6" />
+      <path d="M9 17H4v5" />
+    </svg>
+  )
+}
+
+function BuildingIcon() {
+  return (
+    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <rect x="3" y="3" width="18" height="18" rx="2" />
+      <path d="M3 9h18" /><path d="M9 21V9" />
+    </svg>
+  )
+}
+
+function ArrowIcon() {
+  return (
+    <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <path d="M7 17L17 7" /><path d="M7 7h10v10" />
+    </svg>
+  )
+}
+
+function HomeContent() {
+  const { organizationHandle } = useThunderID()
+  const [accessToken, setAccessToken] = useState<string | null>(null)
+  const [now, setNow] = useState(Math.floor(Date.now() / 1000))
+
+  useEffect(() => {
+    void fetchAccessToken().then((t) => { if (t) setAccessToken(t) })
+  }, [])
+
+  useEffect(() => {
+    const id = setInterval(() => setNow(Math.floor(Date.now() / 1000)), 1000)
+    return () => clearInterval(id)
+  }, [])
+
+  const jwtPayload = accessToken ? (() => {
+    try {
+      const part = accessToken.split('.')[1] ?? ''
+      const base64 = part.replace(/-/g, '+').replace(/_/g, '/')
+      const padded = base64.padEnd(base64.length + (4 - (base64.length % 4)) % 4, '=')
+      return JSON.parse(atob(padded)) as Record<string, unknown>
+    } catch { return null }
+  })() : null
+
+  const authTime = jwtPayload?.auth_time as number | undefined
+  const exp = jwtPayload?.exp as number | undefined
+  const secsLeft = exp ? Math.max(0, exp - now) : null
+  const countdown = secsLeft !== null ? formatCountdown(secsLeft) : null
+
+  return (
+    <User>
+      {(user: { firstName?: string; lastName?: string; email?: string } | null) => {
+        const givenName = user?.firstName ?? user?.email?.split('@')[0] ?? 'there'
+        const email = user?.email
+        const ouName = organizationHandle ?? 'Default'
+        const initials = user
+          ? (`${(user.firstName?.[0] ?? '').toUpperCase()}${(user.lastName?.[0] ?? '').toUpperCase()}` ||
+              user.email?.[0]?.toUpperCase()) ?? '?'
+          : ''
+
+        return (
+          <main className="home-main">
+            <div className="home-greeting">
+              <div className="home-avatar" aria-hidden="true">{initials}</div>
+              <div className="home-greeting-text">
+                <h1 className="home-greeting-name">{greeting(givenName)}</h1>
+                <div className="home-greeting-meta">
+                  {email && <span>{email}</span>}
+                  {email && <span className="home-dot" />}
+                  <span className="home-session-active">
+                    <span className="home-session-dot" />
+                    Session active
+                  </span>
+                </div>
+              </div>
+            </div>
+
+            <div className="home-stats">
+              <div className="home-stat">
+                <div className="home-stat-icon"><ClockIcon /></div>
+                <div>
+                  <div className="home-stat-value">{formatTime(authTime)}</div>
+                  <div className="home-stat-label">Signed in at</div>
+                </div>
+              </div>
+              <div className="home-stat home-stat--bordered">
+                <div className="home-stat-icon"><TimerIcon /></div>
+                <div>
+                  <div
+                    className="home-stat-value home-stat-value--mono"
+                    style={countdown ? { color: countdown.color } : undefined}
+                  >
+                    {countdown ? countdown.text : '—'}
+                  </div>
+                  <div className="home-stat-label">Session expires in</div>
+                </div>
+              </div>
+              <div className="home-stat home-stat--bordered">
+                <div className="home-stat-icon"><BuildingIcon /></div>
+                <div>
+                  <div className="home-stat-value">{ouName}</div>
+                  <div className="home-stat-label">Organisation</div>
+                </div>
+              </div>
+            </div>
+
+            <div className="home-next-label">What&apos;s next</div>
+            <div className="home-next-list">
+              {NEXT_STEPS.map((step) => (
+                <a
+                  key={step.n}
+                  href={step.href}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="home-next-item"
+                >
+                  <span className="home-next-n">{step.n}</span>
+                  <div className="home-next-body">
+                    <div className="home-next-title">{step.title}</div>
+                    <div className="home-next-desc">{step.body}</div>
+                  </div>
+                  <span className="home-next-cta">
+                    {step.cta}
+                    <ArrowIcon />
+                  </span>
+                </a>
+              ))}
+            </div>
+          </main>
+        )
+      }}
+    </User>
+  )
+}
+
+export default function HomePage() {
+  return (
+    <div className="app">
+      <Nav />
+
+      <SignedOut>
+        <section className="hero">
+          <div className="hero-inner">
+            <ThunderMark height={40} />
+
+            <div className="hero-badge">
+              <span className="hero-badge-line" />
+              <span>v1.0 · Open source</span>
+              <span className="hero-badge-line" />
+            </div>
+
+            <h1 className="hero-title">Auth for the Modern Dev</h1>
+
+            <p className="hero-subtitle">
+              ThunderID gives you OAuth&nbsp;2.0, PKCE, MFA, and JWT out of
+              the box. Clone the Quickstart and ship auth before lunch.
+            </p>
+
+            <HeroCtas />
+
+            <hr className="hero-divider" />
+
+            <div className="hero-stats">
+              <div className="hero-stat">
+                <span className="hero-stat-value">OAuth 2.0</span>
+                <span className="hero-stat-label">Authorization standard</span>
+              </div>
+              <div className="hero-stat">
+                <span className="hero-stat-value">&lt;&nbsp;5 min</span>
+                <span className="hero-stat-label">Integration time</span>
+              </div>
+              <div className="hero-stat">
+                <span className="hero-stat-value">MIT</span>
+                <span className="hero-stat-label">License</span>
+              </div>
+            </div>
+          </div>
+        </section>
+      </SignedOut>
+
+      <SignedIn>
+        <div className="home-shell">
+          <HomeContent />
+        </div>
+      </SignedIn>
+    </div>
+  )
+}
diff --git a/samples/nextjs/quickstart/app/profile/page.tsx b/samples/nextjs/quickstart/app/profile/page.tsx
new file mode 100644
index 0000000..e05d1a2
--- /dev/null
+++ b/samples/nextjs/quickstart/app/profile/page.tsx
@@ -0,0 +1,14 @@
+'use client'
+import { UserProfile } from '@thunderid/nextjs'
+import Nav from '../components/Nav'
+
+export default function ProfilePage() {
+  return (
+    <div className="app">
+      <Nav />
+      <main className="profile-main">
+        <UserProfile />
+      </main>
+    </div>
+  )
+}
diff --git a/samples/nextjs/quickstart/app/token/page.tsx b/samples/nextjs/quickstart/app/token/page.tsx
new file mode 100644
index 0000000..9d7f741
--- /dev/null
+++ b/samples/nextjs/quickstart/app/token/page.tsx
@@ -0,0 +1,143 @@
+'use client'
+import { useState, useEffect } from 'react'
+import { fetchAccessToken } from '../actions'
+import Nav from '../components/Nav'
+
+function decodeJwtPart(part: string): Record<string, unknown> | null {
+  try {
+    const base64 = part.replace(/-/g, '+').replace(/_/g, '/')
+    const padded = base64.padEnd(base64.length + (4 - (base64.length % 4)) % 4, '=')
+    return JSON.parse(atob(padded)) as Record<string, unknown>
+  } catch {
+    return null
+  }
+}
+
+function CopyIcon() {
+  return (
+    <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <rect x="9" y="9" width="13" height="13" rx="2" />
+      <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" />
+    </svg>
+  )
+}
+
+export default function TokenDebugPage() {
+  const [rawToken, setRawToken] = useState<string | null>(null)
+  const [copied, setCopied] = useState(false)
+  const [now, setNow] = useState(Math.floor(Date.now() / 1000))
+
+  useEffect(() => {
+    void fetchAccessToken().then((t) => { if (t) setRawToken(t) })
+  }, [])
+
+  useEffect(() => {
+    const id = setInterval(() => setNow(Math.floor(Date.now() / 1000)), 1000)
+    return () => clearInterval(id)
+  }, [])
+
+  const parts = rawToken ? rawToken.split('.') : []
+  const jwtHeader = parts[0] ? decodeJwtPart(parts[0]) : null
+  const jwtPayload = parts[1] ? decodeJwtPart(parts[1]) : null
+
+  const exp = jwtPayload?.exp as number | undefined
+  const expiresIn = exp ? exp - now : null
+  const expired = expiresIn !== null && expiresIn <= 0
+  const minsLeft = expiresIn !== null ? Math.abs(Math.floor(expiresIn / 60)) : null
+
+  const handleCopy = () => {
+    if (rawToken && navigator.clipboard) {
+      void navigator.clipboard.writeText(rawToken)
+      setCopied(true)
+      setTimeout(() => setCopied(false), 1500)
+    }
+  }
+
+  const issuer = jwtPayload?.iss as string | undefined
+  const audience = Array.isArray(jwtPayload?.aud) ? (jwtPayload.aud as string[]).join(', ') : jwtPayload?.aud as string | undefined
+  const scopes = jwtPayload?.scope as string | undefined
+
+  return (
+    <div className="app">
+      <Nav />
+      <main className="token-main">
+        <div className="token-header">
+          <div>
+            <h1 className="token-title">Token debug</h1>
+            <p className="token-subtitle">Inspect your access token and decoded claims.</p>
+          </div>
+          {expiresIn !== null && (
+            <div className={`token-badge ${expired ? 'token-badge--expired' : 'token-badge--valid'}`}>
+              <span className="token-badge-dot" />
+              <span>{expired ? 'Expired' : `Valid · expires in ${minsLeft} min`}</span>
+            </div>
+          )}
+        </div>
+
+        {rawToken ? (
+          <div className="token-raw-section">
+            <div className="token-raw-label-row">
+              <span className="token-section-label">Access token</span>
+              <button className="token-copy-btn" onClick={handleCopy}>
+                <CopyIcon />
+                {copied ? 'Copied!' : 'Copy'}
+              </button>
+            </div>
+            <code className="token-raw">
+              <span className="token-part--header">{parts[0]}</span>
+              <span className="token-dot">.</span>
+              <span className="token-part--payload">{parts[1]}</span>
+              <span className="token-dot">.</span>
+              <span className="token-part--signature">{parts[2]}</span>
+            </code>
+          </div>
+        ) : (
+          <div className="token-raw-section">
+            <div className="token-raw-label-row">
+              <span className="token-section-label">Access token</span>
+            </div>
+            <code className="token-raw token-raw--loading">Loading…</code>
+          </div>
+        )}
+
+        <div className="token-decoded-grid">
+          <div className="token-code-box">
+            <div className="token-code-box-header token-code-box-header--header">JWT Header</div>
+            <pre className="token-code-pre">
+              {jwtHeader ? JSON.stringify(jwtHeader, null, 2) : '…'}
+            </pre>
+          </div>
+          <div className="token-code-box">
+            <div className="token-code-box-header token-code-box-header--payload">JWT Payload</div>
+            <pre className="token-code-pre">
+              {jwtPayload ? JSON.stringify(jwtPayload, null, 2) : '…'}
+            </pre>
+          </div>
+        </div>
+
+        {(issuer ?? audience ?? scopes) && (
+          <div className="token-meta-row">
+            {issuer && (
+              <div className="token-meta-item">
+                <div className="token-meta-label">Issuer</div>
+                <div className="token-meta-value">{issuer}</div>
+              </div>
+            )}
+            {audience && (
+              <div className="token-meta-item">
+                <div className="token-meta-label">Audience</div>
+                <div className="token-meta-value">{audience}</div>
+              </div>
+            )}
+            {scopes && (
+              <div className="token-meta-item">
+                <div className="token-meta-label">Scopes</div>
+                <div className="token-meta-value">{scopes}</div>
+              </div>
+            )}
+          </div>
+        )}
+      </main>
+    </div>
+  )
+}
diff --git a/samples/nextjs/quickstart/next-env.d.ts b/samples/nextjs/quickstart/next-env.d.ts
new file mode 100644
index 0000000..830fb59
--- /dev/null
+++ b/samples/nextjs/quickstart/next-env.d.ts
@@ -0,0 +1,6 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+/// <reference path="./.next/types/routes.d.ts" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
diff --git a/samples/nextjs/quickstart/next.config.ts b/samples/nextjs/quickstart/next.config.ts
new file mode 100644
index 0000000..e4f5738
--- /dev/null
+++ b/samples/nextjs/quickstart/next.config.ts
@@ -0,0 +1,5 @@
+import type { NextConfig } from 'next'
+
+const nextConfig: NextConfig = {}
+
+export default nextConfig
diff --git a/samples/nextjs/quickstart/package.json b/samples/nextjs/quickstart/package.json
new file mode 100644
index 0000000..8a0a616
--- /dev/null
+++ b/samples/nextjs/quickstart/package.json
@@ -0,0 +1,22 @@
+{
+  "name": "@thunderid/nextjs-quickstart",
+  "private": true,
+  "version": "0.0.0",
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start"
+  },
+  "dependencies": {
+    "@thunderid/nextjs": "workspace:*",
+    "next": "^15.3.3",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3"
+  },
+  "devDependencies": {
+    "@types/node": "^24.7.2",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "typescript": "^5.9.3"
+  }
+}
diff --git a/samples/nextjs/quickstart/proxy.ts b/samples/nextjs/quickstart/proxy.ts
new file mode 100644
index 0000000..bada0be
--- /dev/null
+++ b/samples/nextjs/quickstart/proxy.ts
@@ -0,0 +1,13 @@
+import {thunderIDProxy, createRouteMatcher} from '@thunderid/nextjs/server'
+
+const isProtectedRoute = createRouteMatcher(['/dashboard(.*)'])
+
+export default thunderIDProxy(async (thunderid, request) => {
+  if (isProtectedRoute(request)) {
+    await thunderid.protectRoute()
+  }
+})
+
+export const config = {
+  matcher: ['/((?!_next/static|_next/image|favicon.ico).*)'],
+}
diff --git a/samples/nextjs/quickstart/tsconfig.json b/samples/nextjs/quickstart/tsconfig.json
new file mode 100644
index 0000000..fba2bf3
--- /dev/null
+++ b/samples/nextjs/quickstart/tsconfig.json
@@ -0,0 +1,21 @@
+{
+  "compilerOptions": {
+    "target": "ES2017",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "plugins": [{ "name": "next" }],
+    "paths": { "@/*": ["./src/*"] }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
+}
diff --git a/samples/node/quickstart/.env.example b/samples/node/quickstart/.env.example
new file mode 100644
index 0000000..afb9813
--- /dev/null
+++ b/samples/node/quickstart/.env.example
@@ -0,0 +1,3 @@
+THUNDERID_CLIENT_ID=your-client-id-here
+THUNDERID_CLIENT_SECRET=your-client-secret-here
+THUNDERID_BASE_URL=https://localhost:8090
diff --git a/samples/node/quickstart/README.md b/samples/node/quickstart/README.md
new file mode 100644
index 0000000..7804d38
--- /dev/null
+++ b/samples/node/quickstart/README.md
@@ -0,0 +1,38 @@
+# ThunderID Node.js Quickstart
+
+A minimal plain Node.js HTTP server demonstrating sign-in and sign-out with the ThunderID JavaScript SDK (`@thunderid/node`). No framework dependencies — just the built-in `http` module.
+
+## Prerequisites
+
+- Node.js 18+
+- A running ThunderID instance (default: `https://localhost:8090`)
+- A configured application with `http://localhost:3000/callback` added as an authorized redirect URI
+
+## Getting started
+
+1. Copy the environment file and fill in your values:
+   ```sh
+   cp .env.example .env
+   ```
+
+2. Edit `.env` with your ThunderID application credentials:
+   ```
+   THUNDERID_CLIENT_ID=<your-client-id>
+   THUNDERID_CLIENT_SECRET=<your-client-secret>
+   THUNDERID_BASE_URL=https://localhost:8090
+   ```
+
+3. Install dependencies and start the server:
+   ```sh
+   pnpm install
+   pnpm start
+   ```
+
+Open [http://localhost:3000](http://localhost:3000) in your browser.
+
+> **Note:** Ensure `http://localhost:3000/callback` is registered as an authorized redirect URI in your ThunderID application settings.
+
+## Learn more
+
+- [ThunderID Docs](https://thunderid.dev/docs)
+- [`@thunderid/node` SDK reference](https://thunderid.dev/docs/sdks/javascript/node)
diff --git a/samples/node/quickstart/index.js b/samples/node/quickstart/index.js
new file mode 100644
index 0000000..75aca67
--- /dev/null
+++ b/samples/node/quickstart/index.js
@@ -0,0 +1,129 @@
+const http = require('http');
+const { URL } = require('url');
+const { randomUUID } = require('crypto');
+const { ThunderIDNodeClient } = require('@thunderid/node');
+
+const PORT = 3000;
+const SESSION_COOKIE = 'tid_session';
+
+const auth = new ThunderIDNodeClient();
+
+function getSessionId(req) {
+  const cookieHeader = req.headers.cookie ?? '';
+  for (const part of cookieHeader.split(';')) {
+    const [name, value] = part.trim().split('=');
+    if (name === SESSION_COOKIE) return decodeURIComponent(value);
+  }
+  return null;
+}
+
+async function main() {
+  await auth.initialize({
+    clientId: process.env.THUNDERID_CLIENT_ID,
+    clientSecret: process.env.THUNDERID_CLIENT_SECRET,
+    baseUrl: process.env.THUNDERID_BASE_URL || 'https://localhost:8090',
+    afterSignInUrl: 'http://localhost:3000/callback',
+    afterSignOutUrl: 'http://localhost:3000',
+  });
+
+  const server = http.createServer(async (req, res) => {
+    const url = new URL(req.url, `http://localhost:${PORT}`);
+
+    try {
+      if (url.pathname === '/') {
+        const sessionId = getSessionId(req);
+        const signedIn = sessionId && (await auth.isSignedIn(sessionId));
+        res.writeHead(200, { 'Content-Type': 'text/html' });
+        res.end(signedIn
+          ? '<a href="/profile">View profile</a> | <a href="/logout">Sign out</a>'
+          : '<a href="/login">Sign in</a>'
+        );
+
+      } else if (url.pathname === '/profile') {
+        const sessionId = getSessionId(req);
+        if (!sessionId || !(await auth.isSignedIn(sessionId))) {
+          res.writeHead(302, { Location: '/login' });
+          return res.end();
+        }
+        const user = await auth.getUser(sessionId);
+        const esc = (s) => s == null ? '' : String(s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;');
+        const displayName = esc(user.name || [user.given_name, user.family_name].filter(Boolean).join(' ') || user.username);
+        const row = (label, val) => val ? `<tr><th>${label}</th><td>${esc(val)}</td></tr>` : '';
+        res.writeHead(200, { 'Content-Type': 'text/html' });
+        res.end(`<!DOCTYPE html>
+<html lang="en"><head><meta charset="UTF-8"><title>Profile</title>
+<style>body{font-family:system-ui,sans-serif;max-width:560px;margin:60px auto;padding:0 24px;color:#05213f}
+h1{font-size:22px;font-weight:700;margin:0 0 4px}p.email{font-size:14px;color:#5a7085;margin:0 0 32px}
+table{width:100%;border-collapse:collapse}th,td{padding:12px 16px;text-align:left;font-size:14px;border-bottom:1px solid #dde3ec}
+th{width:140px;font-weight:600;color:#5a7085;text-transform:uppercase;font-size:11px;letter-spacing:.06em}
+td{font-family:monospace;word-break:break-all}a{color:#3688ff;text-decoration:none}a:hover{text-decoration:underline}</style>
+</head><body>
+<h1>${displayName}</h1>
+${user.email ? `<p class="email">${esc(user.email)}</p>` : ''}
+<table>
+${row('First name', user.given_name)}
+${row('Last name', user.family_name)}
+${row('Username', user.username)}
+${row('Email', user.email)}
+${row('User ID', user.sub || user.id)}
+</table>
+<p style="margin-top:32px"><a href="/">← Home</a> · <a href="/logout">Sign out</a></p>
+</body></html>`);
+
+      } else if (url.pathname === '/login') {
+        let sessionId = getSessionId(req);
+        const extraHeaders = {};
+        if (!sessionId) {
+          sessionId = randomUUID();
+          extraHeaders['Set-Cookie'] =
+            `${SESSION_COOKIE}=${sessionId}; HttpOnly; SameSite=Lax; Path=/`;
+        }
+        await auth.signIn((authUrl) => {
+          res.writeHead(302, { ...extraHeaders, Location: authUrl });
+          res.end();
+        }, sessionId);
+
+      } else if (url.pathname === '/callback') {
+        const code = url.searchParams.get('code');
+        const state = url.searchParams.get('state');
+        const sessionState = url.searchParams.get('session_state');
+        const sessionId = getSessionId(req);
+
+        if (!sessionId || !code || !state) {
+          res.writeHead(400);
+          return res.end('Bad request');
+        }
+
+        await auth.signIn(() => {}, sessionId, code, sessionState, state);
+        res.writeHead(302, { Location: '/profile' });
+        res.end();
+
+      } else if (url.pathname === '/logout') {
+        const sessionId = getSessionId(req);
+        if (!sessionId) {
+          res.writeHead(302, { Location: '/' });
+          return res.end();
+        }
+        const signOutUrl = await auth.signOut(sessionId);
+        res.writeHead(302, {
+          Location: signOutUrl,
+          'Set-Cookie': `${SESSION_COOKIE}=; HttpOnly; SameSite=Lax; Path=/; Max-Age=0`,
+        });
+        res.end();
+
+      } else {
+        res.writeHead(404);
+        res.end('Not found');
+      }
+    } catch {
+      res.writeHead(500);
+      res.end('Internal server error');
+    }
+  });
+
+  server.listen(PORT, () => {
+    console.log(`Server running on http://localhost:${PORT}`);
+  });
+}
+
+main();
diff --git a/samples/node/quickstart/package.json b/samples/node/quickstart/package.json
new file mode 100644
index 0000000..0acbabf
--- /dev/null
+++ b/samples/node/quickstart/package.json
@@ -0,0 +1,12 @@
+{
+  "name": "@thunderid/node-quickstart",
+  "private": true,
+  "version": "0.0.0",
+  "scripts": {
+    "start": "node index.js",
+    "dev": "node --watch index.js"
+  },
+  "dependencies": {
+    "@thunderid/node": "workspace:*"
+  }
+}
diff --git a/samples/nuxt/quickstart/.env.example b/samples/nuxt/quickstart/.env.example
new file mode 100644
index 0000000..82bd380
--- /dev/null
+++ b/samples/nuxt/quickstart/.env.example
@@ -0,0 +1,4 @@
+NUXT_PUBLIC_THUNDERID_BASE_URL=https://localhost:8090
+NUXT_PUBLIC_THUNDERID_CLIENT_ID=your-client-id-here
+THUNDERID_CLIENT_SECRET=your-client-secret-here
+THUNDERID_SESSION_SECRET=generate-with-openssl-rand-base64-32
diff --git a/samples/nuxt/quickstart/README.md b/samples/nuxt/quickstart/README.md
new file mode 100644
index 0000000..27401a9
--- /dev/null
+++ b/samples/nuxt/quickstart/README.md
@@ -0,0 +1,40 @@
+# ThunderID Nuxt Quickstart
+
+A minimal Nuxt 3 application demonstrating ThunderID authentication with OAuth 2.0, PKCE, and JWT out of the box.
+
+## Prerequisites
+
+- Node.js 18+
+- pnpm
+- A ThunderID application (create one at [thunderid.dev](https://thunderid.dev))
+
+## Getting started
+
+1. Copy the example environment file:
+
+   ```bash
+   cp .env.example .env
+   ```
+
+2. Fill in your ThunderID credentials in `.env`:
+
+   ```
+   NUXT_PUBLIC_THUNDERID_BASE_URL=https://localhost:8090
+   NUXT_PUBLIC_THUNDERID_CLIENT_ID=<your-client-id>
+   THUNDERID_CLIENT_SECRET=<your-client-secret>
+   THUNDERID_SESSION_SECRET=<run: openssl rand -base64 32>
+   ```
+
+3. In your ThunderID application settings, add the following as an authorized redirect URL:
+
+   ```
+   http://localhost:3000/api/auth/callback
+   ```
+
+4. Start the development server:
+
+   ```bash
+   pnpm dev
+   ```
+
+   The app is now running at [http://localhost:3000](http://localhost:3000).
diff --git a/samples/nuxt/quickstart/app.vue b/samples/nuxt/quickstart/app.vue
new file mode 100644
index 0000000..9cd418f
--- /dev/null
+++ b/samples/nuxt/quickstart/app.vue
@@ -0,0 +1,5 @@
+<template>
+  <ThunderIDRoot>
+    <NuxtPage />
+  </ThunderIDRoot>
+</template>
diff --git a/samples/nuxt/quickstart/assets/styles.css b/samples/nuxt/quickstart/assets/styles.css
new file mode 100644
index 0000000..88fd782
--- /dev/null
+++ b/samples/nuxt/quickstart/assets/styles.css
@@ -0,0 +1,745 @@
+*,
+::before,
+::after {
+  box-sizing: border-box;
+}
+
+/* ── Design tokens ── */
+.app {
+  --color-bg: #f7f9fc;
+  --color-card: #ffffff;
+  --color-border: #dde3ec;
+  --color-text: #05213f;
+  --color-text-muted: #5a7085;
+  --color-primary: #3688ff;
+  --color-primary-hover: #1f72f0;
+  --color-nav-bg: rgba(247, 249, 252, 0.92);
+  --color-nav-border: #dde3ec;
+  --shadow-card: 0 1px 3px 0 rgba(5, 33, 63, 0.06), 0 4px 12px 0 rgba(5, 33, 63, 0.08);
+  --font-sans: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+  --radius-card: 12px;
+  --radius-btn: 8px;
+
+  font-family: var(--font-sans);
+  background: var(--color-bg);
+  color: var(--color-text);
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  transition: background 0.2s, color 0.2s;
+}
+
+/* ── Dark mode ── */
+.app.dark {
+  --color-bg: #080f1c;
+  --color-card: #0f1a2d;
+  --color-border: rgba(255, 255, 255, 0.09);
+  --color-text: #E0EAFF;
+  --color-text-muted: rgba(224, 234, 255, 0.48);
+  --color-nav-bg: rgba(8, 15, 28, 0.92);
+}
+
+/* ── Navigation ── */
+.nav {
+  position: fixed;
+  inset-block-start: 0;
+  inset-inline: 0;
+  height: 52px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 24px;
+  background: var(--color-nav-bg);
+  border-bottom: 1px solid var(--color-nav-border);
+  z-index: 100;
+  transition: background 0.2s, border-color 0.2s;
+}
+
+.nav-logo {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  text-decoration: none;
+  color: var(--color-text);
+}
+
+.wordmark {
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+}
+
+.wordmark-name {
+  font-size: 14px;
+  font-weight: 700;
+  letter-spacing: -0.03em;
+  color: var(--color-text);
+  line-height: 1;
+}
+
+.wordmark-sub {
+  font-size: 8.5px;
+  font-weight: 700;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: var(--color-primary);
+  line-height: 1;
+}
+
+.dark-toggle {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  padding: 0;
+  background: transparent;
+  border: none;
+  border-radius: var(--radius-btn);
+  color: var(--color-text-muted);
+  cursor: pointer;
+  transition: color 0.15s, background 0.15s;
+}
+
+.dark-toggle:hover {
+  color: var(--color-text);
+  background: rgba(54, 136, 255, 0.06);
+}
+
+.nav-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+/* ── Nav back button ── */
+.nav-back-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  height: 32px;
+  padding: 0 10px;
+  border-radius: 6px;
+  border: none;
+  background: transparent;
+  color: var(--color-text-muted);
+  font-size: 13px;
+  font-family: var(--font-sans);
+  letter-spacing: -0.01em;
+  cursor: pointer;
+  text-decoration: none;
+  transition: background 0.2s, color 0.2s;
+}
+
+.nav-back-btn:hover {
+  background: var(--color-border);
+  color: var(--color-text);
+}
+
+/* ── Buttons ── */
+button {
+  font-family: var(--font-sans);
+  cursor: pointer;
+  border: none;
+  border-radius: var(--radius-btn);
+  font-weight: 500;
+  transition: background 0.15s, color 0.15s, border-color 0.15s, opacity 0.15s;
+  line-height: 1;
+  white-space: nowrap;
+}
+
+button:focus-visible {
+  outline: 2px solid var(--color-primary);
+  outline-offset: 2px;
+}
+
+.btn-primary {
+  background: var(--color-primary);
+  color: #ffffff;
+  border: 1.5px solid var(--color-primary);
+}
+
+.btn-primary:hover {
+  background: var(--color-primary-hover);
+  border-color: var(--color-primary-hover);
+}
+
+.btn-outline {
+  background: transparent;
+  color: var(--color-text);
+  border: 1.5px solid rgba(54, 136, 255, 0.4);
+}
+
+.btn-outline:hover {
+  border-color: var(--color-primary);
+  color: var(--color-primary);
+}
+
+.btn-ghost {
+  background: transparent;
+  color: var(--color-text-muted);
+  border: none;
+}
+
+.btn-ghost:hover {
+  color: var(--color-text);
+  background: rgba(54, 136, 255, 0.06);
+}
+
+.btn-sm {
+  padding: 6px 14px;
+  font-size: 13px;
+  height: 32px;
+}
+
+.btn-lg {
+  padding: 0 24px;
+  font-size: 15px;
+  height: 46px;
+}
+
+/* ── Hero section ── */
+.hero {
+  flex: 1;
+  padding: 96px 32px 80px;
+  min-height: 100vh;
+}
+
+.hero-inner {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  gap: 20px;
+  max-width: 560px;
+  width: 100%;
+  margin: 0 auto;
+}
+
+.hero-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 10px;
+  font-weight: 600;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: var(--color-text-muted);
+}
+
+.hero-badge-line {
+  display: block;
+  width: 24px;
+  height: 1px;
+  background: var(--color-border);
+  flex-shrink: 0;
+}
+
+.hero-title {
+  font-size: 42px;
+  font-weight: 700;
+  letter-spacing: -0.05em;
+  color: var(--color-text);
+  line-height: 1.1;
+  margin: 0;
+}
+
+.hero-subtitle {
+  font-size: 16px;
+  color: var(--color-text-muted);
+  max-width: 420px;
+  line-height: 1.8;
+  letter-spacing: -0.01em;
+}
+
+.hero-ctas {
+  display: flex;
+  gap: 12px;
+  flex-wrap: wrap;
+  justify-content: center;
+  margin-top: 4px;
+}
+
+.hero-divider {
+  width: 100%;
+  border: none;
+  border-top: 1px solid var(--color-border);
+  margin: 8px 0;
+}
+
+/* ── Stats row ── */
+.hero-stats {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  width: 100%;
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-card);
+  overflow: hidden;
+}
+
+.hero-stat {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+  padding: 20px 16px;
+  position: relative;
+}
+
+.hero-stat + .hero-stat::before {
+  content: '';
+  position: absolute;
+  left: 0;
+  top: 20%;
+  height: 60%;
+  width: 1px;
+  background: var(--color-border);
+}
+
+.hero-stat-value {
+  font-size: 15px;
+  font-weight: 700;
+  color: var(--color-text);
+  letter-spacing: -0.02em;
+}
+
+.hero-stat-label {
+  font-size: 12px;
+  color: var(--color-text-muted);
+}
+
+/* ── Responsive ── */
+@media (max-width: 480px) {
+  .nav {
+    padding: 0 16px;
+  }
+
+  .hero {
+    padding: 80px 16px 32px;
+  }
+
+  .hero-title {
+    font-size: 2rem;
+  }
+
+  .hero-stats {
+    grid-template-columns: 1fr;
+  }
+
+  .hero-stat + .hero-stat::before {
+    top: 0;
+    left: 20%;
+    width: 60%;
+    height: 1px;
+  }
+
+  .hero-ctas {
+    flex-direction: column;
+    align-items: stretch;
+  }
+}
+
+/* ── Signed-in shell ── */
+.home-shell {
+  min-height: calc(100vh - 52px);
+  margin-top: 52px;
+}
+
+/* ── Signed-in home page ── */
+.home-main {
+  width: 100%;
+  max-width: 900px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+/* Greeting */
+.home-greeting {
+  display: flex;
+  align-items: flex-start;
+  gap: 16px;
+  margin-bottom: 36px;
+}
+
+.home-greeting-text {
+  min-width: 0;
+}
+
+.home-greeting-name {
+  margin: 0 0 6px;
+  font-size: 26px;
+  font-weight: 700;
+  color: var(--color-text);
+  letter-spacing: -0.04em;
+}
+
+.home-greeting-meta {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 13px;
+  color: var(--color-text-muted);
+  letter-spacing: -0.01em;
+  flex-wrap: wrap;
+}
+
+.home-dot {
+  display: inline-block;
+  width: 3px;
+  height: 3px;
+  border-radius: 50%;
+  background: var(--color-border);
+  flex-shrink: 0;
+}
+
+.home-session-active {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  color: #2fbd6b;
+}
+
+.home-session-dot {
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: #2fbd6b;
+  flex-shrink: 0;
+}
+
+/* Session stats row */
+.home-stats {
+  display: flex;
+  gap: 0;
+  padding: 20px 0;
+  border-top: 1px solid var(--color-border);
+  border-bottom: 1px solid var(--color-border);
+  margin-bottom: 52px;
+}
+
+.home-stat {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-width: 0;
+}
+
+.home-stat--bordered {
+  padding-left: 32px;
+  border-left: 1px solid var(--color-border);
+}
+
+.home-stat-icon {
+  width: 32px;
+  height: 32px;
+  border-radius: 8px;
+  background: rgba(54, 136, 255, 0.1);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: #3688FF;
+}
+
+.home-stat-value {
+  font-size: 14px;
+  font-weight: 700;
+  color: var(--color-text);
+  letter-spacing: -0.02em;
+}
+
+.home-stat-value--mono {
+  font-family: var(--font-mono, monospace);
+  letter-spacing: 0.01em;
+}
+
+.home-stat-label {
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--color-text-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.07em;
+  margin-top: 2px;
+}
+
+/* What's next */
+.home-next-label {
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-text-muted);
+  margin-bottom: 20px;
+}
+
+.home-next-list {
+  display: flex;
+  flex-direction: column;
+}
+
+.home-next-item {
+  display: grid;
+  grid-template-columns: 28px 1fr auto;
+  gap: 16px;
+  align-items: start;
+  padding: 20px 0;
+  border-top: 1px solid var(--color-border);
+  text-decoration: none;
+  color: inherit;
+  cursor: pointer;
+  transition: background 0.2s;
+  border-radius: 4px;
+}
+
+.home-next-item:hover .home-next-cta {
+  opacity: 1;
+}
+
+.home-next-n {
+  font-size: 11px;
+  font-weight: 700;
+  color: #3688FF;
+  letter-spacing: 0.05em;
+  padding-top: 2px;
+  font-variant-numeric: tabular-nums;
+}
+
+.home-next-body {
+  min-width: 0;
+}
+
+.home-next-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--color-text);
+  letter-spacing: -0.02em;
+  margin-bottom: 4px;
+}
+
+.home-next-desc {
+  font-size: 13px;
+  color: var(--color-text-muted);
+  line-height: 1.6;
+  letter-spacing: -0.01em;
+}
+
+.home-next-cta {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 13px;
+  font-weight: 600;
+  color: #3688FF;
+  white-space: nowrap;
+  opacity: 0.7;
+  transition: opacity 0.2s;
+  padding-top: 2px;
+}
+
+/* ── Profile page ── */
+.profile-main {
+  width: 100%;
+  max-width: 780px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+/* ── Token debug page ── */
+.token-main {
+  width: 100%;
+  max-width: 780px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+.token-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16px;
+  margin-bottom: 36px;
+  flex-wrap: wrap;
+}
+
+.token-title {
+  margin: 0 0 5px;
+  font-size: 22px;
+  font-weight: 700;
+  letter-spacing: -0.04em;
+  color: var(--color-text);
+}
+
+.token-subtitle {
+  margin: 0;
+  font-size: 13px;
+  color: var(--color-text-muted);
+  letter-spacing: -0.01em;
+}
+
+.token-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 7px;
+  padding: 6px 12px;
+  border-radius: 6px;
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: -0.01em;
+  flex-shrink: 0;
+}
+
+.token-badge--expired {
+  background: rgba(220, 38, 38, 0.08);
+  border: 1px solid rgba(220, 38, 38, 0.22);
+  color: #dc2626;
+}
+
+.token-badge--valid {
+  background: rgba(47, 189, 107, 0.08);
+  border: 1px solid rgba(47, 189, 107, 0.22);
+  color: #2fbd6b;
+}
+
+.token-badge-dot {
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: currentColor;
+  flex-shrink: 0;
+}
+
+.token-raw-section {
+  margin-bottom: 20px;
+}
+
+.token-raw-label-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 8px;
+}
+
+.token-section-label {
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-text-muted);
+}
+
+.token-copy-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  padding: 4px 10px;
+  border-radius: 5px;
+  background: transparent;
+  border: 1px solid var(--color-border);
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--color-text-muted);
+  cursor: pointer;
+  font-family: var(--font-sans);
+  letter-spacing: -0.01em;
+  transition: border-color 0.2s, color 0.2s;
+}
+
+.token-copy-btn:hover {
+  border-color: #3688FF;
+  color: #3688FF;
+}
+
+.token-raw {
+  display: block;
+  font-size: 11px;
+  font-family: var(--font-mono, monospace);
+  word-break: break-all;
+  line-height: 1.8;
+  background: #0b1120;
+  padding: 14px 16px;
+  border-radius: 8px;
+  overflow-x: auto;
+}
+
+.token-raw--loading {
+  color: rgba(255, 255, 255, 0.3);
+}
+
+.token-part--header   { color: #ff7b72; }
+.token-part--payload  { color: #79c0ff; }
+.token-part--signature { color: #3fb950; }
+
+.token-dot {
+  color: rgba(255, 255, 255, 0.2);
+}
+
+.token-decoded-grid {
+  display: grid;
+  grid-template-columns: 1fr 1.7fr;
+  gap: 12px;
+  margin-bottom: 20px;
+}
+
+.token-code-box {
+  background: #0b1120;
+  border-radius: 10px;
+  overflow: hidden;
+}
+
+.token-code-box-header {
+  padding: 9px 14px;
+  font-size: 10px;
+  font-weight: 700;
+  letter-spacing: 0.09em;
+  text-transform: uppercase;
+}
+
+.token-code-box-header--header {
+  color: #ff7b72;
+  border-bottom: 1px solid rgba(255, 123, 114, 0.15);
+}
+
+.token-code-box-header--payload {
+  color: #79c0ff;
+  border-bottom: 1px solid rgba(121, 192, 255, 0.15);
+}
+
+.token-code-pre {
+  margin: 0;
+  padding: 14px;
+  font-size: 11.5px;
+  line-height: 1.8;
+  font-family: var(--font-mono, monospace);
+  color: #c9d1d9;
+  overflow-x: auto;
+  max-height: 220px;
+}
+
+.token-meta-row {
+  display: flex;
+  gap: 32px;
+  padding-top: 20px;
+  border-top: 1px solid var(--color-border);
+  flex-wrap: wrap;
+}
+
+.token-meta-label {
+  font-size: 10px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-text-muted);
+  margin-bottom: 5px;
+}
+
+.token-meta-value {
+  font-size: 12px;
+  font-family: var(--font-mono, monospace);
+  color: var(--color-text);
+  letter-spacing: -0.01em;
+}
diff --git a/samples/nuxt/quickstart/components/AppNav.vue b/samples/nuxt/quickstart/components/AppNav.vue
new file mode 100644
index 0000000..3a4cc9d
--- /dev/null
+++ b/samples/nuxt/quickstart/components/AppNav.vue
@@ -0,0 +1,78 @@
+<script setup>
+const dark = useState('dark', () => false)
+const route = useRoute()
+const isHome = computed(() => route.path === '/')
+
+const menuItems = [
+  { label: 'Profile', href: '/profile' },
+  { label: 'Token debug', href: '/token' },
+]
+
+const markTopFill = computed(() => dark.value ? '#E8F4FF' : '#05213F')
+
+function toggleDark() {
+  dark.value = !dark.value
+}
+</script>
+
+<template>
+  <nav class="nav">
+    <NuxtLink to="/" class="nav-logo" aria-label="ThunderID home">
+      <svg :width="Math.round(24 * (207 / 257))" height="24" viewBox="0 0 207 257" fill="none" aria-hidden="true">
+        <path d="M55.4763 26.4391L58.8866 0H0V26.4391H55.4763Z" :fill="markTopFill" />
+        <path d="M39.8438 147.407L49.5455 72.2839H4.9909e-05V256.743H60.5602L80.048 147.407H39.8438Z" fill="#3688FF" />
+        <path d="M192.42 59.361C182.782 40.2307 168.929 25.5705 150.903 15.3381C145.501 12.2662 139.761 9.6605 133.703 7.5208L115.401 103.702H159.757L76.2987 256.743H83.3735C109.449 256.743 131.69 251.574 150.14 241.236C168.569 230.897 182.634 216.131 192.356 196.959C202.058 177.765 206.909 154.8 206.909 128.043C206.909 101.286 202.079 78.5123 192.441 59.3821L192.42 59.361Z" fill="#3688FF" />
+      </svg>
+      <div class="wordmark">
+        <span class="wordmark-name">ThunderID</span>
+        <span class="wordmark-sub">Quickstart</span>
+      </div>
+    </NuxtLink>
+
+    <div class="nav-actions">
+      <NuxtLink v-if="!isHome" to="/" class="nav-back-btn">
+        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+          <polyline points="15 18 9 12 15 6" />
+        </svg>
+        Home
+      </NuxtLink>
+
+      <button
+        class="dark-toggle"
+        :aria-label="dark ? 'Switch to light mode' : 'Switch to dark mode'"
+        @click="toggleDark"
+      >
+        <svg v-if="dark" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+          <circle cx="12" cy="12" r="5"/>
+          <line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/>
+          <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/>
+          <line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/>
+          <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/>
+        </svg>
+        <svg v-else width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+          <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/>
+        </svg>
+      </button>
+
+      <SignedIn>
+        <UserDropdown :show-trigger-label="true" :menu-items="menuItems" />
+      </SignedIn>
+      <SignedOut>
+        <SignInButton>
+          <template #default="{ signIn, isLoading }">
+            <button class="btn-ghost btn-sm" @click="signIn" :disabled="isLoading">
+              {{ isLoading ? 'Signing in…' : 'Sign in' }}
+            </button>
+          </template>
+        </SignInButton>
+        <SignUpButton>
+          <template #default="{ signUp, isLoading }">
+            <button class="btn-primary btn-sm" @click="signUp" :disabled="isLoading">
+              {{ isLoading ? 'Signing up…' : 'Get started' }}
+            </button>
+          </template>
+        </SignUpButton>
+      </SignedOut>
+    </div>
+  </nav>
+</template>
diff --git a/samples/nuxt/quickstart/nuxt.config.ts b/samples/nuxt/quickstart/nuxt.config.ts
new file mode 100644
index 0000000..fc1e782
--- /dev/null
+++ b/samples/nuxt/quickstart/nuxt.config.ts
@@ -0,0 +1,4 @@
+export default defineNuxtConfig({
+  modules: ['@thunderid/nuxt'],
+  css: ['~/assets/styles.css'],
+})
diff --git a/samples/nuxt/quickstart/package.json b/samples/nuxt/quickstart/package.json
new file mode 100644
index 0000000..4f28816
--- /dev/null
+++ b/samples/nuxt/quickstart/package.json
@@ -0,0 +1,16 @@
+{
+  "name": "@thunderid/nuxt-quickstart",
+  "private": true,
+  "version": "0.0.0",
+  "scripts": {
+    "dev": "nuxt dev",
+    "build": "nuxt build",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview"
+  },
+  "dependencies": {
+    "@thunderid/nuxt": "workspace:*",
+    "nuxt": "^3.16.2",
+    "vue": "^3.5.13"
+  }
+}
diff --git a/samples/nuxt/quickstart/pages/index.vue b/samples/nuxt/quickstart/pages/index.vue
new file mode 100644
index 0000000..ad16fc1
--- /dev/null
+++ b/samples/nuxt/quickstart/pages/index.vue
@@ -0,0 +1,243 @@
+<script setup>
+import { ref, computed, onMounted, onUnmounted } from 'vue'
+import { useThunderID } from '@thunderid/vue'
+
+const dark = useState('dark', () => false)
+const { getDecodedIdToken, organizationHandle } = useThunderID()
+
+const markTopFill = computed(() => dark.value ? '#E8F4FF' : '#05213F')
+
+function greeting(name) {
+  const h = new Date().getHours()
+  const tod = h < 12 ? 'morning' : h < 17 ? 'afternoon' : 'evening'
+  return `Good ${tod}, ${name}.`
+}
+
+function formatTime(unixSeconds) {
+  if (!unixSeconds) return '—'
+  return new Date(unixSeconds * 1000).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })
+}
+
+function formatCountdown(secsLeft) {
+  if (secsLeft <= 0) return { text: 'Expired', color: '#d95757' }
+  if (secsLeft < 300) {
+    const m = Math.floor(secsLeft / 60), s = secsLeft % 60
+    return { text: `${m}m ${s}s`, color: '#e88b3a' }
+  }
+  if (secsLeft < 3600) {
+    const m = Math.floor(secsLeft / 60), s = secsLeft % 60
+    return { text: `${m}m ${s}s`, color: '#2fbd6b' }
+  }
+  const hr = Math.floor(secsLeft / 3600), m = Math.floor((secsLeft % 3600) / 60)
+  return { text: `${hr}h ${m}m`, color: '#2fbd6b' }
+}
+
+const NEXT_STEPS = [
+  {
+    n: '01',
+    title: 'Explore use cases',
+    body: 'See what you can build — auth flows for web, mobile, APIs, and agents.',
+    cta: 'Browse use cases',
+    href: 'https://thunderid.dev/docs/next/use-cases/overview/',
+  },
+  {
+    n: '02',
+    title: 'Learn about flows',
+    body: 'Understand how authorization code, PKCE, client credentials, and device flows work.',
+    cta: 'Read guide',
+    href: 'https://thunderid.dev/docs/next/guides/guides/flows/what-are-flows/',
+  },
+  {
+    n: '03',
+    title: 'Style your experience',
+    body: 'Customize the login UI, branding, and email templates to match your product.',
+    cta: 'Design guide',
+    href: 'https://thunderid.dev/docs/next/guides/guides/design/overview/',
+  },
+  {
+    n: '04',
+    title: 'Explore SDK APIs',
+    body: 'Full Nuxt SDK reference — composables, components, and configuration options.',
+    cta: 'SDK reference',
+    href: 'https://thunderid.dev/docs/next/sdks/nuxt/overview/',
+  },
+]
+
+const idToken = ref(null)
+const now = ref(Math.floor(Date.now() / 1000))
+let tickerId = null
+
+const authTime = computed(() => idToken.value?.auth_time)
+const idExp = computed(() => idToken.value?.exp)
+const secsLeft = computed(() => idExp.value ? Math.max(0, idExp.value - now.value) : null)
+const countdown = computed(() => secsLeft.value !== null ? formatCountdown(secsLeft.value) : null)
+
+onMounted(() => {
+  getDecodedIdToken().then(t => { idToken.value = t }).catch(() => {})
+  tickerId = setInterval(() => { now.value = Math.floor(Date.now() / 1000) }, 1000)
+})
+
+onUnmounted(() => {
+  if (tickerId) clearInterval(tickerId)
+})
+</script>
+
+<template>
+  <div :class="['app', { dark }]">
+    <AppNav />
+
+    <SignedOut>
+      <section class="hero">
+        <div class="hero-inner">
+          <svg width="35" height="44" viewBox="0 0 207 257" fill="none" aria-hidden="true">
+            <path d="M55.4763 26.4391L58.8866 0H0V26.4391H55.4763Z" :fill="markTopFill" />
+            <path d="M39.8438 147.407L49.5455 72.2839H4.9909e-05V256.743H60.5602L80.048 147.407H39.8438Z" fill="#3688FF" />
+            <path d="M192.42 59.361C182.782 40.2307 168.929 25.5705 150.903 15.3381C145.501 12.2662 139.761 9.6605 133.703 7.5208L115.401 103.702H159.757L76.2987 256.743H83.3735C109.449 256.743 131.69 251.574 150.14 241.236C168.569 230.897 182.634 216.131 192.356 196.959C202.058 177.765 206.909 154.8 206.909 128.043C206.909 101.286 202.079 78.5123 192.441 59.3821L192.42 59.361Z" fill="#3688FF" />
+          </svg>
+
+          <div class="hero-badge">
+            <span class="hero-badge-line" />
+            <span>v1.0 · Open source</span>
+            <span class="hero-badge-line" />
+          </div>
+
+          <h1 class="hero-title">Auth for the Modern Dev</h1>
+
+          <p class="hero-subtitle">
+            ThunderID gives you OAuth&nbsp;2.0, PKCE, MFA, and JWT out of
+            the box. Clone the Quickstart and ship auth before lunch.
+          </p>
+
+          <div class="hero-ctas">
+            <SignUpButton>
+              <template #default="{ signUp, isLoading }">
+                <button class="btn-primary btn-lg" @click="signUp" :disabled="isLoading">
+                  {{ isLoading ? 'Signing up…' : 'Get started' }}
+                </button>
+              </template>
+            </SignUpButton>
+            <SignInButton>
+              <template #default="{ signIn, isLoading }">
+                <button class="btn-outline btn-lg" @click="signIn" :disabled="isLoading">
+                  {{ isLoading ? 'Signing in…' : 'Sign in' }}
+                </button>
+              </template>
+            </SignInButton>
+          </div>
+
+          <hr class="hero-divider" />
+
+          <div class="hero-stats">
+            <div class="hero-stat">
+              <span class="hero-stat-value">OAuth 2.0</span>
+              <span class="hero-stat-label">Authorization standard</span>
+            </div>
+            <div class="hero-stat">
+              <span class="hero-stat-value">&lt;&nbsp;5 min</span>
+              <span class="hero-stat-label">Integration time</span>
+            </div>
+            <div class="hero-stat">
+              <span class="hero-stat-value">MIT</span>
+              <span class="hero-stat-label">License</span>
+            </div>
+          </div>
+        </div>
+      </section>
+    </SignedOut>
+
+    <SignedIn>
+      <div class="home-shell">
+        <User>
+          <template #default="{ user }">
+            <main class="home-main">
+              <div class="home-greeting">
+                <UserAvatar :user="user" :size="52" />
+                <div class="home-greeting-text">
+                  <h1 class="home-greeting-name">
+                    {{ greeting(user?.givenName || user?.given_name || user?.displayName || user?.username || 'there') }}
+                  </h1>
+                  <div class="home-greeting-meta">
+                    <span v-if="user?.email">{{ user.email }}</span>
+                    <span v-if="user?.email" class="home-dot" />
+                    <span class="home-session-active">
+                      <span class="home-session-dot" />
+                      Session active
+                    </span>
+                  </div>
+                </div>
+              </div>
+
+              <div class="home-stats">
+                <div class="home-stat">
+                  <div class="home-stat-icon">
+                    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                      <circle cx="12" cy="12" r="10" /><polyline points="12 6 12 12 16 14" />
+                    </svg>
+                  </div>
+                  <div>
+                    <div class="home-stat-value">{{ formatTime(authTime) }}</div>
+                    <div class="home-stat-label">Signed in at</div>
+                  </div>
+                </div>
+                <div class="home-stat home-stat--bordered">
+                  <div class="home-stat-icon">
+                    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                      <path d="M10 2h4" /><path d="M12 14v-4" />
+                      <path d="M4 13a8 8 0 0 1 8-7 8 8 0 1 1-5.3 14L4 17.6" />
+                      <path d="M9 17H4v5" />
+                    </svg>
+                  </div>
+                  <div>
+                    <div
+                      class="home-stat-value home-stat-value--mono"
+                      :style="countdown ? { color: countdown.color } : undefined"
+                    >
+                      {{ countdown ? countdown.text : '—' }}
+                    </div>
+                    <div class="home-stat-label">Session expires in</div>
+                  </div>
+                </div>
+                <div class="home-stat home-stat--bordered">
+                  <div class="home-stat-icon">
+                    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                      <rect x="3" y="3" width="18" height="18" rx="2" />
+                      <path d="M3 9h18" /><path d="M9 21V9" />
+                    </svg>
+                  </div>
+                  <div>
+                    <div class="home-stat-value">{{ organizationHandle || user?.ouName || user?.org || 'Default' }}</div>
+                    <div class="home-stat-label">Organisation</div>
+                  </div>
+                </div>
+              </div>
+
+              <div class="home-next-label">What's next</div>
+              <div class="home-next-list">
+                <a
+                  v-for="step in NEXT_STEPS"
+                  :key="step.n"
+                  :href="step.href"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  class="home-next-item"
+                >
+                  <span class="home-next-n">{{ step.n }}</span>
+                  <div class="home-next-body">
+                    <div class="home-next-title">{{ step.title }}</div>
+                    <div class="home-next-desc">{{ step.body }}</div>
+                  </div>
+                  <span class="home-next-cta">
+                    {{ step.cta }}
+                    <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                      <path d="M7 17L17 7" /><path d="M7 7h10v10" />
+                    </svg>
+                  </span>
+                </a>
+              </div>
+            </main>
+          </template>
+        </User>
+      </div>
+    </SignedIn>
+  </div>
+</template>
diff --git a/samples/nuxt/quickstart/pages/profile.vue b/samples/nuxt/quickstart/pages/profile.vue
new file mode 100644
index 0000000..d1e53da
--- /dev/null
+++ b/samples/nuxt/quickstart/pages/profile.vue
@@ -0,0 +1,14 @@
+<script setup>
+const dark = useState('dark', () => false)
+</script>
+
+<template>
+  <div :class="['app', { dark }]">
+    <AppNav />
+    <div class="home-shell">
+      <main class="profile-main">
+        <ThunderIDUserProfile />
+      </main>
+    </div>
+  </div>
+</template>
diff --git a/samples/nuxt/quickstart/pages/token.vue b/samples/nuxt/quickstart/pages/token.vue
new file mode 100644
index 0000000..b450504
--- /dev/null
+++ b/samples/nuxt/quickstart/pages/token.vue
@@ -0,0 +1,125 @@
+<script setup>
+import { ref, computed, onMounted, onUnmounted } from 'vue'
+import { useThunderID } from '@thunderid/vue'
+
+const dark = useState('dark', () => false)
+const { getAccessToken } = useThunderID()
+
+function decodeJwtPart(part) {
+  try {
+    const base64 = part.replace(/-/g, '+').replace(/_/g, '/')
+    const padded = base64.padEnd(base64.length + (4 - (base64.length % 4)) % 4, '=')
+    return JSON.parse(atob(padded))
+  } catch {
+    return null
+  }
+}
+
+const rawToken = ref(null)
+const copied = ref(false)
+const now = ref(Math.floor(Date.now() / 1000))
+let tickerId = null
+
+const tokenParts = computed(() => rawToken.value ? rawToken.value.split('.') : [])
+const jwtHeader = computed(() => tokenParts.value[0] ? decodeJwtPart(tokenParts.value[0]) : null)
+const jwtPayload = computed(() => tokenParts.value[1] ? decodeJwtPart(tokenParts.value[1]) : null)
+
+const tokenExp = computed(() => jwtPayload.value?.exp)
+const expiresIn = computed(() => tokenExp.value ? tokenExp.value - now.value : null)
+const tokenExpired = computed(() => expiresIn.value !== null && expiresIn.value <= 0)
+const minsLeft = computed(() => expiresIn.value !== null ? Math.abs(Math.floor(expiresIn.value / 60)) : null)
+
+const issuer = computed(() => jwtPayload.value?.iss)
+const audience = computed(() => {
+  const aud = jwtPayload.value?.aud
+  return Array.isArray(aud) ? aud.join(', ') : aud
+})
+const scopes = computed(() => jwtPayload.value?.scope)
+
+onMounted(() => {
+  getAccessToken().then(t => { rawToken.value = t }).catch(() => {})
+  tickerId = setInterval(() => { now.value = Math.floor(Date.now() / 1000) }, 1000)
+})
+
+onUnmounted(() => {
+  if (tickerId) clearInterval(tickerId)
+})
+
+function handleCopy() {
+  if (rawToken.value && navigator.clipboard) {
+    navigator.clipboard.writeText(rawToken.value)
+    copied.value = true
+    setTimeout(() => { copied.value = false }, 1500)
+  }
+}
+</script>
+
+<template>
+  <div :class="['app', { dark }]">
+    <AppNav />
+    <div class="home-shell">
+      <main class="token-main">
+        <div class="token-header">
+          <div>
+            <h1 class="token-title">Token debug</h1>
+            <p class="token-subtitle">Inspect your access token and decoded claims.</p>
+          </div>
+          <div
+            v-if="expiresIn !== null"
+            :class="['token-badge', tokenExpired ? 'token-badge--expired' : 'token-badge--valid']"
+          >
+            <span class="token-badge-dot" />
+            <span>{{ tokenExpired ? 'Expired' : `Valid · expires in ${minsLeft} min` }}</span>
+          </div>
+        </div>
+
+        <div class="token-raw-section">
+          <div class="token-raw-label-row">
+            <span class="token-section-label">Access token</span>
+            <button v-if="rawToken" class="token-copy-btn" @click="handleCopy">
+              <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                <rect x="9" y="9" width="13" height="13" rx="2" />
+                <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" />
+              </svg>
+              {{ copied ? 'Copied!' : 'Copy' }}
+            </button>
+          </div>
+          <code v-if="rawToken" class="token-raw">
+            <span class="token-part--header">{{ tokenParts[0] }}</span>
+            <span class="token-dot">.</span>
+            <span class="token-part--payload">{{ tokenParts[1] }}</span>
+            <span class="token-dot">.</span>
+            <span class="token-part--signature">{{ tokenParts[2] }}</span>
+          </code>
+          <code v-else class="token-raw token-raw--loading">Loading…</code>
+        </div>
+
+        <div class="token-decoded-grid">
+          <div class="token-code-box">
+            <div class="token-code-box-header token-code-box-header--header">JWT Header</div>
+            <pre class="token-code-pre">{{ jwtHeader ? JSON.stringify(jwtHeader, null, 2) : '…' }}</pre>
+          </div>
+          <div class="token-code-box">
+            <div class="token-code-box-header token-code-box-header--payload">JWT Payload</div>
+            <pre class="token-code-pre">{{ jwtPayload ? JSON.stringify(jwtPayload, null, 2) : '…' }}</pre>
+          </div>
+        </div>
+
+        <div v-if="issuer || audience || scopes" class="token-meta-row">
+          <div v-if="issuer" class="token-meta-item">
+            <div class="token-meta-label">Issuer</div>
+            <div class="token-meta-value">{{ issuer }}</div>
+          </div>
+          <div v-if="audience" class="token-meta-item">
+            <div class="token-meta-label">Audience</div>
+            <div class="token-meta-value">{{ audience }}</div>
+          </div>
+          <div v-if="scopes" class="token-meta-item">
+            <div class="token-meta-label">Scopes</div>
+            <div class="token-meta-value">{{ scopes }}</div>
+          </div>
+        </div>
+      </main>
+    </div>
+  </div>
+</template>
diff --git a/samples/react/quickstart/.env.example b/samples/react/quickstart/.env.example
new file mode 100644
index 0000000..bd72417
--- /dev/null
+++ b/samples/react/quickstart/.env.example
@@ -0,0 +1,2 @@
+VITE_THUNDERID_CLIENT_ID=your-client-id-here
+VITE_THUNDERID_BASE_URL=https://localhost:8090
diff --git a/samples/react/quickstart/README.md b/samples/react/quickstart/README.md
new file mode 100644
index 0000000..8ca1f03
--- /dev/null
+++ b/samples/react/quickstart/README.md
@@ -0,0 +1,34 @@
+# ThunderID React Quickstart
+
+A minimal React + Vite application demonstrating ThunderID authentication with OAuth 2.0, PKCE, and JWT support using the `@thunderid/react` SDK.
+
+## Prerequisites
+
+- Node.js 18+
+- pnpm
+- A ThunderID application — register at [thunderid.dev](https://thunderid.dev)
+
+## Setup
+
+1. Copy the environment template:
+   ```sh
+   cp .env.example .env
+   ```
+
+2. Fill in your ThunderID credentials in `.env`:
+   ```
+   VITE_THUNDERID_CLIENT_ID=your-client-id
+   VITE_THUNDERID_BASE_URL=https://your-thunderid-instance
+   ```
+
+3. Install dependencies and start the dev server:
+   ```sh
+   pnpm install
+   pnpm dev
+   ```
+
+The app will be available at `http://localhost:5173`.
+
+## Docs
+
+Full SDK reference: [thunderid.dev/docs](https://thunderid.dev/docs)
diff --git a/samples/react/quickstart/index.html b/samples/react/quickstart/index.html
new file mode 100644
index 0000000..562e0aa
--- /dev/null
+++ b/samples/react/quickstart/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>ThunderID React Quickstart</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.jsx"></script>
+  </body>
+</html>
diff --git a/samples/react/quickstart/package.json b/samples/react/quickstart/package.json
new file mode 100644
index 0000000..1f9905b
--- /dev/null
+++ b/samples/react/quickstart/package.json
@@ -0,0 +1,22 @@
+{
+  "name": "@thunderid/react-quickstart",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@thunderid/react": "workspace:*",
+    "@thunderid/react-router": "workspace:*",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "react-router": "^7.6.2"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-react": "^4.5.2",
+    "vite": "^6.3.5"
+  }
+}
diff --git a/samples/react/quickstart/pnpm-lock.yaml b/samples/react/quickstart/pnpm-lock.yaml
new file mode 100644
index 0000000..4b990eb
--- /dev/null
+++ b/samples/react/quickstart/pnpm-lock.yaml
@@ -0,0 +1,1135 @@
+lockfileVersion: '9.0'
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
+
+importers:
+
+  .:
+    dependencies:
+      '@thunderid/react':
+        specifier: workspace:*
+        version: link:../../../packages/react
+      '@thunderid/react-router':
+        specifier: workspace:*
+        version: link:../../../packages/react-router
+      react:
+        specifier: ^19.2.3
+        version: 19.2.7
+      react-dom:
+        specifier: ^19.2.3
+        version: 19.2.7(react@19.2.7)
+      react-router:
+        specifier: ^7.6.2
+        version: 7.18.0(react-dom@19.2.7(react@19.2.7))(react@19.2.7)
+    devDependencies:
+      '@vitejs/plugin-react':
+        specifier: ^4.5.2
+        version: 4.7.0(vite@6.4.3)
+      vite:
+        specifier: ^6.3.5
+        version: 6.4.3
+
+packages:
+
+  '@babel/code-frame@7.29.7':
+    resolution: {integrity: sha512-Aup7aUOfpbAUg2ROOJN6Iw5f9DMBlzu0mIkm/malLQFN/YQgO48wCj0Kxa3sEHJvPVFg7siR+qRInwXd2qhQKw==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/compat-data@7.29.7':
+    resolution: {integrity: sha512-locTkQyKvwIEgBzVrn8693ebc97F2U8ZHjbXwDXJ5Fn2TCpNwTlKcaKLkdHop5c/icOFE7qt7Q9JC5hnKNa6Gg==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/core@7.29.7':
+    resolution: {integrity: sha512-RgHBCvtjbOK2gXSNBNIkNoEc9qoVEtau3hj8gEqKQuL3HZAibKarWFEI3Lfm6EYKkLalOh8eSrj9b+ch9H/VBA==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/generator@7.29.7':
+    resolution: {integrity: sha512-DkXD5OJQaAQIdZ1bt3UZdEnHAn9Imd3IVBdX03UFe+ony9Ojw5pzr9YVKGDY1jt+Gcn/FnGkNf8r+Vj5NOJWtQ==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-compilation-targets@7.29.7':
+    resolution: {integrity: sha512-wem6WaBj4NaVYVdNhLPPVacES6ZJ+KBBfSkTMD3YZxbP3rm3Di85tJU5ljaUNhaOynt+Aj0xruhYuzQBt8n71g==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-globals@7.29.7':
+    resolution: {integrity: sha512-3nQVUAtvkKH9zahfWgw96Jc/uFOmjACE1kQz82E2lqWmHBgjzbNlsC22nuQTfahmWeQtTq5nQ/4Nnd2A1wj4zA==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-module-imports@7.29.7':
+    resolution: {integrity: sha512-ejHwrQQYcm9xnTivShn2IDOlIzInN34AXskvq9QicvCtEzq1Vzclu/tKF8Jq1Cg8JG2GL6/EmjgsCT7lXepE3g==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-module-transforms@7.29.7':
+    resolution: {integrity: sha512-UPUVSyXbOh627KiCIGQSgwWzGeBKLkaJ9PJEdrngIwMSzxLR4jS4+f1f1jb7VzBbg8nFLaYotvVPFCTqdrmTAg==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0
+
+  '@babel/helper-plugin-utils@7.29.7':
+    resolution: {integrity: sha512-G7sHYigPY17oO5SYWnfD/0MTBwVR781S/JI643e/JhUYgVgWE/61SoW3NH9KWUKyKq5LVh3npif99Wkt6j86Jw==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-string-parser@7.29.7':
+    resolution: {integrity: sha512-Pb5ijPrZ89GDH8223L4UP8i6QApWxs04RbPQJTeWDV0/keR2E36MeKnyr6LYmUUvqRRI+Iv87SuF1W6ErINzYw==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-validator-identifier@7.29.7':
+    resolution: {integrity: sha512-qehxGkRj55h/ff8EMaJ+cYhyaKlHIxqYDn682wQD7RNp9UujOQsHog2uS0r2vzr4pW+sXf90NeeayjcNaX3fFg==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-validator-option@7.29.7':
+    resolution: {integrity: sha512-N9ZErrD+yW5geCDtBqnOoxmR8+tNKiGuxKlDpuJxfsqpa2dFcexaziGAE/qoHLiDDreVNMupxGmSoNlyvsA3gw==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helpers@7.29.7':
+    resolution: {integrity: sha512-1k2lAGRMfHTcwuNYcCNUmaUffmQv8KWMfh2iJUUeRlwlwH4FdNG7mfPI10NPfLHJFThE4Tyr4mv7kTNZOiPuBg==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/parser@7.29.7':
+    resolution: {integrity: sha512-hnORnjP/1P/zFEndoeX+n+t1RwWRJiJpM/jO7FW32Kn9r5+sJB2JWOdYo4L6k78j15eCwY3Gm/7364B1EMwtNg==}
+    engines: {node: '>=6.0.0'}
+    hasBin: true
+
+  '@babel/plugin-transform-react-jsx-self@7.29.7':
+    resolution: {integrity: sha512-TL0hMc9xzy86VD31nUiwzd5otRAcyEPcsegCxolO0PvcXuH1v0kECe/UIznYFihpkvU5wg/jk4v0TTEFfm53fw==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
+  '@babel/plugin-transform-react-jsx-source@7.29.7':
+    resolution: {integrity: sha512-06IyK09H3wi4cGbhDBwp5gUGo0IKtnYa8tyTiephirPCK6fbobVGiXMMI5zLQ4aKEYP3wZ3ArU44o+8KMrSG/Q==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
+  '@babel/template@7.29.7':
+    resolution: {integrity: sha512-puq+Gf35oI24FeN11LkoUQFqv9uwNeWpxXZi/Ji3rRIoKAzKnxRaZ+Gkj0vKS9ZCiTESfng1N9LyOyXvo+m+Gg==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/traverse@7.29.7':
+    resolution: {integrity: sha512-EhlfNQtZ+NK22w5BM61ciuiq1m58ed33Wr1Xan//ZRTy6hgjnwyCffRYwzsGXdASJSUJ1guZILsErh1eQcl+zw==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/types@7.29.7':
+    resolution: {integrity: sha512-4zBIxpPzowiZpusoFkyGVwakdRJUyuH5PxQ/PrqghfdFWWasvnCdPfQXHrenDai+gyLARulZjZowCOj6fjT4pA==}
+    engines: {node: '>=6.9.0'}
+
+  '@esbuild/aix-ppc64@0.25.12':
+    resolution: {integrity: sha512-Hhmwd6CInZ3dwpuGTF8fJG6yoWmsToE+vYgD4nytZVxcu1ulHpUQRAB1UJ8+N1Am3Mz4+xOByoQoSZf4D+CpkA==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [aix]
+
+  '@esbuild/android-arm64@0.25.12':
+    resolution: {integrity: sha512-6AAmLG7zwD1Z159jCKPvAxZd4y/VTO0VkprYy+3N2FtJ8+BQWFXU+OxARIwA46c5tdD9SsKGZ/1ocqBS/gAKHg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [android]
+
+  '@esbuild/android-arm@0.25.12':
+    resolution: {integrity: sha512-VJ+sKvNA/GE7Ccacc9Cha7bpS8nyzVv0jdVgwNDaR4gDMC/2TTRc33Ip8qrNYUcpkOHUT5OZ0bUcNNVZQ9RLlg==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [android]
+
+  '@esbuild/android-x64@0.25.12':
+    resolution: {integrity: sha512-5jbb+2hhDHx5phYR2By8GTWEzn6I9UqR11Kwf22iKbNpYrsmRB18aX/9ivc5cabcUiAT/wM+YIZ6SG9QO6a8kg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [android]
+
+  '@esbuild/darwin-arm64@0.25.12':
+    resolution: {integrity: sha512-N3zl+lxHCifgIlcMUP5016ESkeQjLj/959RxxNYIthIg+CQHInujFuXeWbWMgnTo4cp5XVHqFPmpyu9J65C1Yg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@esbuild/darwin-x64@0.25.12':
+    resolution: {integrity: sha512-HQ9ka4Kx21qHXwtlTUVbKJOAnmG1ipXhdWTmNXiPzPfWKpXqASVcWdnf2bnL73wgjNrFXAa3yYvBSd9pzfEIpA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@esbuild/freebsd-arm64@0.25.12':
+    resolution: {integrity: sha512-gA0Bx759+7Jve03K1S0vkOu5Lg/85dou3EseOGUes8flVOGxbhDDh/iZaoek11Y8mtyKPGF3vP8XhnkDEAmzeg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-x64@0.25.12':
+    resolution: {integrity: sha512-TGbO26Yw2xsHzxtbVFGEXBFH0FRAP7gtcPE7P5yP7wGy7cXK2oO7RyOhL5NLiqTlBh47XhmIUXuGciXEqYFfBQ==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@esbuild/linux-arm64@0.25.12':
+    resolution: {integrity: sha512-8bwX7a8FghIgrupcxb4aUmYDLp8pX06rGh5HqDT7bB+8Rdells6mHvrFHHW2JAOPZUbnjUpKTLg6ECyzvas2AQ==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@esbuild/linux-arm@0.25.12':
+    resolution: {integrity: sha512-lPDGyC1JPDou8kGcywY0YILzWlhhnRjdof3UlcoqYmS9El818LLfJJc3PXXgZHrHCAKs/Z2SeZtDJr5MrkxtOw==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [linux]
+
+  '@esbuild/linux-ia32@0.25.12':
+    resolution: {integrity: sha512-0y9KrdVnbMM2/vG8KfU0byhUN+EFCny9+8g202gYqSSVMonbsCfLjUO+rCci7pM0WBEtz+oK/PIwHkzxkyharA==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [linux]
+
+  '@esbuild/linux-loong64@0.25.12':
+    resolution: {integrity: sha512-h///Lr5a9rib/v1GGqXVGzjL4TMvVTv+s1DPoxQdz7l/AYv6LDSxdIwzxkrPW438oUXiDtwM10o9PmwS/6Z0Ng==}
+    engines: {node: '>=18'}
+    cpu: [loong64]
+    os: [linux]
+
+  '@esbuild/linux-mips64el@0.25.12':
+    resolution: {integrity: sha512-iyRrM1Pzy9GFMDLsXn1iHUm18nhKnNMWscjmp4+hpafcZjrr2WbT//d20xaGljXDBYHqRcl8HnxbX6uaA/eGVw==}
+    engines: {node: '>=18'}
+    cpu: [mips64el]
+    os: [linux]
+
+  '@esbuild/linux-ppc64@0.25.12':
+    resolution: {integrity: sha512-9meM/lRXxMi5PSUqEXRCtVjEZBGwB7P/D4yT8UG/mwIdze2aV4Vo6U5gD3+RsoHXKkHCfSxZKzmDssVlRj1QQA==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@esbuild/linux-riscv64@0.25.12':
+    resolution: {integrity: sha512-Zr7KR4hgKUpWAwb1f3o5ygT04MzqVrGEGXGLnj15YQDJErYu/BGg+wmFlIDOdJp0PmB0lLvxFIOXZgFRrdjR0w==}
+    engines: {node: '>=18'}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@esbuild/linux-s390x@0.25.12':
+    resolution: {integrity: sha512-MsKncOcgTNvdtiISc/jZs/Zf8d0cl/t3gYWX8J9ubBnVOwlk65UIEEvgBORTiljloIWnBzLs4qhzPkJcitIzIg==}
+    engines: {node: '>=18'}
+    cpu: [s390x]
+    os: [linux]
+
+  '@esbuild/linux-x64@0.25.12':
+    resolution: {integrity: sha512-uqZMTLr/zR/ed4jIGnwSLkaHmPjOjJvnm6TVVitAa08SLS9Z0VM8wIRx7gWbJB5/J54YuIMInDquWyYvQLZkgw==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [linux]
+
+  '@esbuild/netbsd-arm64@0.25.12':
+    resolution: {integrity: sha512-xXwcTq4GhRM7J9A8Gv5boanHhRa/Q9KLVmcyXHCTaM4wKfIpWkdXiMog/KsnxzJ0A1+nD+zoecuzqPmCRyBGjg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [netbsd]
+
+  '@esbuild/netbsd-x64@0.25.12':
+    resolution: {integrity: sha512-Ld5pTlzPy3YwGec4OuHh1aCVCRvOXdH8DgRjfDy/oumVovmuSzWfnSJg+VtakB9Cm0gxNO9BzWkj6mtO1FMXkQ==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [netbsd]
+
+  '@esbuild/openbsd-arm64@0.25.12':
+    resolution: {integrity: sha512-fF96T6KsBo/pkQI950FARU9apGNTSlZGsv1jZBAlcLL1MLjLNIWPBkj5NlSz8aAzYKg+eNqknrUJ24QBybeR5A==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openbsd]
+
+  '@esbuild/openbsd-x64@0.25.12':
+    resolution: {integrity: sha512-MZyXUkZHjQxUvzK7rN8DJ3SRmrVrke8ZyRusHlP+kuwqTcfWLyqMOE3sScPPyeIXN/mDJIfGXvcMqCgYKekoQw==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@esbuild/openharmony-arm64@0.25.12':
+    resolution: {integrity: sha512-rm0YWsqUSRrjncSXGA7Zv78Nbnw4XL6/dzr20cyrQf7ZmRcsovpcRBdhD43Nuk3y7XIoW2OxMVvwuRvk9XdASg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@esbuild/sunos-x64@0.25.12':
+    resolution: {integrity: sha512-3wGSCDyuTHQUzt0nV7bocDy72r2lI33QL3gkDNGkod22EsYl04sMf0qLb8luNKTOmgF/eDEDP5BFNwoBKH441w==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [sunos]
+
+  '@esbuild/win32-arm64@0.25.12':
+    resolution: {integrity: sha512-rMmLrur64A7+DKlnSuwqUdRKyd3UE7oPJZmnljqEptesKM8wx9J8gx5u0+9Pq0fQQW8vqeKebwNXdfOyP+8Bsg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@esbuild/win32-ia32@0.25.12':
+    resolution: {integrity: sha512-HkqnmmBoCbCwxUKKNPBixiWDGCpQGVsrQfJoVGYLPT41XWF8lHuE5N6WhVia2n4o5QK5M4tYr21827fNhi4byQ==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@esbuild/win32-x64@0.25.12':
+    resolution: {integrity: sha512-alJC0uCZpTFrSL0CCDjcgleBXPnCrEAhTBILpeAp7M/OFgoqtAetfBzX0xM00MUsVVPpVjlPuMbREqnZCXaTnA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [win32]
+
+  '@jridgewell/gen-mapping@0.3.13':
+    resolution: {integrity: sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==}
+
+  '@jridgewell/remapping@2.3.5':
+    resolution: {integrity: sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==}
+
+  '@jridgewell/resolve-uri@3.1.2':
+    resolution: {integrity: sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==}
+    engines: {node: '>=6.0.0'}
+
+  '@jridgewell/sourcemap-codec@1.5.5':
+    resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==}
+
+  '@jridgewell/trace-mapping@0.3.31':
+    resolution: {integrity: sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==}
+
+  '@rolldown/pluginutils@1.0.0-beta.27':
+    resolution: {integrity: sha512-+d0F4MKMCbeVUJwG96uQ4SgAznZNSq93I3V+9NHA4OpvqG8mRCpGdKmK8l/dl02h2CCDHwW2FqilnTyDcAnqjA==}
+
+  '@rollup/rollup-android-arm-eabi@4.62.2':
+    resolution: {integrity: sha512-6o7ZLZK+BeenkZCFNDXqpbjw9bD6nuWonvS/lwQJp7NoVVxm6p3qE7qQ5jGuBjiFsgvqjD8mZAU5oWxTmbOeOg==}
+    cpu: [arm]
+    os: [android]
+
+  '@rollup/rollup-android-arm64@4.62.2':
+    resolution: {integrity: sha512-BaH7BllCACHoH1LguOU56UItGfUWjujlO65kS9LAodViaN4bwIKd7oeW/ZHJ/4ljr/7MIiENnNy3HJ0zXv8Zkw==}
+    cpu: [arm64]
+    os: [android]
+
+  '@rollup/rollup-darwin-arm64@4.62.2':
+    resolution: {integrity: sha512-v39RCCvj4He82I9sFmk+M1VZ0PLM9sfsLVikjfx2hYBNALhrrOR2D3JjQA6AhlaSOgcR+RzrKY7e1+bT6SUO/A==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@rollup/rollup-darwin-x64@4.62.2':
+    resolution: {integrity: sha512-yl0y2vq3S3lHeuXhEdss6TWfKW8vkujImO12tn4ZkG/4oghr09LvdYm2RElVjokTQiUvDUGXLGsYeLqUMCKpGA==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@rollup/rollup-freebsd-arm64@4.62.2':
+    resolution: {integrity: sha512-tT4pvt4qXD+vEoezupCWi+a1F0vvDiksiHc+PxRlYTOH1I6/X4id9jPxTP+Fg+545euaFT1jJVs4CEdHZAU1vw==}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@rollup/rollup-freebsd-x64@4.62.2':
+    resolution: {integrity: sha512-6nU5F2wCW+qvCBhTn1pdIU3bzsIoF7EUwsCDRxilWGprQR6yd508YnH9+OKFCwpfS8pjZqDUmnCAr7exax0XCg==}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@rollup/rollup-linux-arm-gnueabihf@4.62.2':
+    resolution: {integrity: sha512-n1GJHPOvpIfhi3TmrCeh6S6URt9BFCt0KQE3qvexyGCTAKpR4Lg+eWvNZEqu7epxwus/8ElT3hacYEucm49SZg==}
+    cpu: [arm]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-arm-musleabihf@4.62.2':
+    resolution: {integrity: sha512-JqgflS8wEB+UXV/vS1RpRbifGBeN4D5lz8D8oOFbFZw4vedvdOgCFAjfBmIMdW3yL10XpQQ0Ambepw6MXrhOnA==}
+    cpu: [arm]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-arm64-gnu@4.62.2':
+    resolution: {integrity: sha512-wnFJkogWvN4jm/hQRF2UBaeUmk20j5+DmHvoyWii2b8HJDyvz1MF2OU/6ynXt2KR63rbZLWkFpoytpdc/yBuSA==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-arm64-musl@4.62.2':
+    resolution: {integrity: sha512-HVu2bp0zhvJ8xHEV9+UUs7S90VadmBSY3LcIMvozbPo4AuMGDWlz3ymHLHZPX4hR67TKTt8Qp5PJ5RBg/i+RMQ==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-loong64-gnu@4.62.2':
+    resolution: {integrity: sha512-mQqqAV8QaoSgr9I2fKDLY2BAVvmKjWoGiu/cSYQonsLvtqwEn1E4QYfnCOcp5zoEqNhsDYin1s6jx/VJmrxlZg==}
+    cpu: [loong64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-loong64-musl@4.62.2':
+    resolution: {integrity: sha512-IxKLoxCQ2IWi6bT2akyDUBGsOImDKB+sPp4EsTmwFQ/fMwpCKm8uLSSgP/Kx/QYUgKis6SEZ5/Nlhup0DIA0PQ==}
+    cpu: [loong64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-ppc64-gnu@4.62.2':
+    resolution: {integrity: sha512-Mk5ha2RQSgyFfmYYLkBpPnUk8D8FriBxesO1u9O75X0mHgXL1UQcH5Itl2lurWL2tj0RxV9b9tJgipac0hRY9A==}
+    cpu: [ppc64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-ppc64-musl@4.62.2':
+    resolution: {integrity: sha512-CjvEnqJL/0/TQ3TXX3OPIJ/kmBellrWd4heXUmHeJlTnmwjKpSJzoehLaL6Xk0ZnMHBu9dZuFADNOrtjF4v+2w==}
+    cpu: [ppc64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-riscv64-gnu@4.62.2':
+    resolution: {integrity: sha512-1SiZbzwdkaDURsew/tSOrooKiYy7EQGT6m8ufavAi9NEyQb/6VuIxFXAL1fqa4iZe3g4NbNk4P7J32z2tw5Mgg==}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-riscv64-musl@4.62.2':
+    resolution: {integrity: sha512-nQts12zJ3NQRoE6uYljOH89v7szzLDvG2JD/vsX+vGXU8w/At1GowTZ5/7qeFQ8m7L55rpR8Okugnuo5bgjy2Q==}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-s390x-gnu@4.62.2':
+    resolution: {integrity: sha512-E9/ll019jhPIJgpzfZoIkBGhcz+kKNgVWYRY0zr9srBdPPFVpvOKW8VaJKUbeK+eZXyQF9ltME+Kk6affeaPgg==}
+    cpu: [s390x]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-x64-gnu@4.62.2':
+    resolution: {integrity: sha512-5BqxR/pshjey51iliyzTD5Xi3EN0aLmQ2lZ3lvefVV9c82BvrLo2/6OT55iifpWBufs6kdwWbuOKS841DrmK9A==}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-x64-musl@4.62.2':
+    resolution: {integrity: sha512-uNN83XxQrRAh/w0/pmAfibcwyb6YWt4gP+dpnQKPVJshAloQ785ii8CT8ZCIxkGg9opVsvAlGhFitSm6D1Jjpg==}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-openbsd-x64@4.62.2':
+    resolution: {integrity: sha512-srjEIxSH3LRnJN6THczDHWQplqEMFiAJrTab0msUryh9kwNpkICf3Ea6q6MN/2cZwRFUNx5w+h6Hpi4QuHS6Zg==}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@rollup/rollup-openharmony-arm64@4.62.2':
+    resolution: {integrity: sha512-8hOJnxgbyObnCm5AlRA3A931xX19xq80RjVTKgJOvEKWqJruP/Uf12IbAOaDjjEXYRewwHLfmF0YRIdK3OwKWA==}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@rollup/rollup-win32-arm64-msvc@4.62.2':
+    resolution: {integrity: sha512-mmF4AY1i0hG/bLWUctUq59gtmgaSIRa3cu/A3JFRp/sCNEme2bgDEiDS22P9FbnJB8NJNF4jPJiSP5RHQpUTDg==}
+    cpu: [arm64]
+    os: [win32]
+
+  '@rollup/rollup-win32-ia32-msvc@4.62.2':
+    resolution: {integrity: sha512-DZgkknc6jhHrk46V25vbAM0zZkyP0nSDkJB8/dRkLTxv470dOmWDqGoEJl/9A0dFfS7yE3REOwNDxpHwSLSt0Q==}
+    cpu: [ia32]
+    os: [win32]
+
+  '@rollup/rollup-win32-x64-gnu@4.62.2':
+    resolution: {integrity: sha512-T6xr6ucWSFto+VGajA8YH26LdpHRuP4YLHEKAtCWvJDOlnmWcDZVCI2Jmjr+IFHDlt2zRaTAKE4tfjTaWLgJBg==}
+    cpu: [x64]
+    os: [win32]
+
+  '@rollup/rollup-win32-x64-msvc@4.62.2':
+    resolution: {integrity: sha512-BfzEnDJOt9T8M989/lA37EcJgat01wLRnoi5dQf3QzOH7jzpqTAzdDbVfRljVr5r+jzKqpbHeyOfAaXxAd0PAA==}
+    cpu: [x64]
+    os: [win32]
+
+  '@types/babel__core@7.20.5':
+    resolution: {integrity: sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==}
+
+  '@types/babel__generator@7.27.0':
+    resolution: {integrity: sha512-ufFd2Xi92OAVPYsy+P4n7/U7e68fex0+Ee8gSG9KX7eo084CWiQ4sdxktvdl0bOPupXtVJPY19zk6EwWqUQ8lg==}
+
+  '@types/babel__template@7.4.4':
+    resolution: {integrity: sha512-h/NUaSyG5EyxBIp8YRxo4RMe2/qQgvyowRwVMzhYhBCONbW8PUsg4lkFMrhgZhUe5z3L3MiLDuvyJ/CaPa2A8A==}
+
+  '@types/babel__traverse@7.28.0':
+    resolution: {integrity: sha512-8PvcXf70gTDZBgt9ptxJ8elBeBjcLOAcOtoO/mPJjtji1+CdGbHgm77om1GrsPxsiE+uXIpNSK64UYaIwQXd4Q==}
+
+  '@types/estree@1.0.9':
+    resolution: {integrity: sha512-GhdPgy1el4/ImP05X05Uw4cw2/M93BCUmnEvWZNStlCzEKME4Fkk+YpoA5OiHNQmoS7Cafb8Xa3Pya8m1Qrzeg==}
+
+  '@vitejs/plugin-react@4.7.0':
+    resolution: {integrity: sha512-gUu9hwfWvvEDBBmgtAowQCojwZmJ5mcLn3aufeCsitijs3+f2NsrPtlAWIR6OPiqljl96GVCUbLe0HyqIpVaoA==}
+    engines: {node: ^14.18.0 || >=16.0.0}
+    peerDependencies:
+      vite: ^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0
+
+  baseline-browser-mapping@2.10.40:
+    resolution: {integrity: sha512-BSSLZ9/Cjjv7Gtj5B68ZzXcXUg8iOf3fme+FCuh8rC/Go+Kmh8cox7M3A8dolou16s64QjLPOSdngh7GxXvkSw==}
+    engines: {node: '>=6.0.0'}
+    hasBin: true
+
+  browserslist@4.28.4:
+    resolution: {integrity: sha512-MTc8i/x9jBQd1iMw2CFGS+rwMa07eYjLR0CCTLDACl9xhxy+nIs3KeML/biicXtk9JrZ6dnnTatmc7ErPXIxqw==}
+    engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
+    hasBin: true
+
+  caniuse-lite@1.0.30001799:
+    resolution: {integrity: sha512-hG1bReV+OUU+MOqK4t/ZWI0tZOyz3rqS9XuhOUz1cIcbwBKjOyJEJuw9ER5JuNyqxNk8u/JUVbGibBOL1yrjFw==}
+
+  convert-source-map@2.0.0:
+    resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==}
+
+  cookie@1.1.1:
+    resolution: {integrity: sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==}
+    engines: {node: '>=18'}
+
+  debug@4.4.3:
+    resolution: {integrity: sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==}
+    engines: {node: '>=6.0'}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+
+  electron-to-chromium@1.5.379:
+    resolution: {integrity: sha512-v/qV5aV5EUA2pGilzUCq5/eyOloZAqDZBu9UMBIzgPpLlprjSR6zswsWBTv0KpqxLGUAZEwhO95ZCt7srymNVA==}
+
+  esbuild@0.25.12:
+    resolution: {integrity: sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg==}
+    engines: {node: '>=18'}
+    hasBin: true
+
+  escalade@3.2.0:
+    resolution: {integrity: sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==}
+    engines: {node: '>=6'}
+
+  fdir@6.5.0:
+    resolution: {integrity: sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==}
+    engines: {node: '>=12.0.0'}
+    peerDependencies:
+      picomatch: ^3 || ^4
+    peerDependenciesMeta:
+      picomatch:
+        optional: true
+
+  fsevents@2.3.3:
+    resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
+    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+    os: [darwin]
+
+  gensync@1.0.0-beta.2:
+    resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==}
+    engines: {node: '>=6.9.0'}
+
+  js-tokens@4.0.0:
+    resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
+
+  jsesc@3.1.0:
+    resolution: {integrity: sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==}
+    engines: {node: '>=6'}
+    hasBin: true
+
+  json5@2.2.3:
+    resolution: {integrity: sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==}
+    engines: {node: '>=6'}
+    hasBin: true
+
+  lru-cache@5.1.1:
+    resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==}
+
+  ms@2.1.3:
+    resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
+
+  nanoid@3.3.15:
+    resolution: {integrity: sha512-y7Wygv/7mEOvxTuEQDB8StXdMRBWf1kR/tlhAzBRUFkB2jfcLOAxO/SHmOO2zgz1pVgK29/kyupn059/bCHdjA==}
+    engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
+    hasBin: true
+
+  node-releases@2.0.50:
+    resolution: {integrity: sha512-J6l92tKHX6w8Jy5nO1Vuc01NoIiRGi/d6qBKVxh+IQ8Cr3b6HbVNfKiF8ZpFKufTwpwxMmce2W3iQZ861ZRyTg==}
+    engines: {node: '>=18'}
+
+  picocolors@1.1.1:
+    resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
+
+  picomatch@4.0.4:
+    resolution: {integrity: sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==}
+    engines: {node: '>=12'}
+
+  postcss@8.5.15:
+    resolution: {integrity: sha512-FfR8sjd4em2T6fb3I2MwAJU7HWVMr9zba+enmQeeWFfCbm+UOC/0X4DS8XtpUTMwWMGbjKYP7xjfNekzyGmB3A==}
+    engines: {node: ^10 || ^12 || >=14}
+
+  react-dom@19.2.7:
+    resolution: {integrity: sha512-t0BRVXvbiE/o20Hfw669rLbMCDWtYZLvmJigy2f0MxsXF+71pxhR3xOkspmsO8h3ZlNzyibAmtCa3l4lYKk6gQ==}
+    peerDependencies:
+      react: ^19.2.7
+
+  react-refresh@0.17.0:
+    resolution: {integrity: sha512-z6F7K9bV85EfseRCp2bzrpyQ0Gkw1uLoCel9XBVWPg/TjRj94SkJzUTGfOa4bs7iJvBWtQG0Wq7wnI0syw3EBQ==}
+    engines: {node: '>=0.10.0'}
+
+  react-router@7.18.0:
+    resolution: {integrity: sha512-pTTGt8J+ji1NOmYnjzT+bAJy/1zD+Jp4ziO6cL7T3ZLvXKtusO7BpFqlRXitqpcPVqllsIXFHRMt+2/k3Xn6HQ==}
+    engines: {node: '>=20.0.0'}
+    peerDependencies:
+      react: '>=18'
+      react-dom: '>=18'
+    peerDependenciesMeta:
+      react-dom:
+        optional: true
+
+  react@19.2.7:
+    resolution: {integrity: sha512-HNe9WslTbXmFK8o8cmwgAeJFSBvt1bPdHCVKtaaV+WlAN36mpT4hcRpwbf3fY56ar2oIXzsBpOAiIRHAdY0OlQ==}
+    engines: {node: '>=0.10.0'}
+
+  rollup@4.62.2:
+    resolution: {integrity: sha512-RFnrW4lhXA3s3eqHDZvN654g8OTjzRfqpIRJYczCGB6HzphckVAi/Qh4tbPUbRuDi7s1Llv8g/NspLkttY3gTA==}
+    engines: {node: '>=18.0.0', npm: '>=8.0.0'}
+    hasBin: true
+
+  scheduler@0.27.0:
+    resolution: {integrity: sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==}
+
+  semver@6.3.1:
+    resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==}
+    hasBin: true
+
+  set-cookie-parser@2.7.2:
+    resolution: {integrity: sha512-oeM1lpU/UvhTxw+g3cIfxXHyJRc/uidd3yK1P242gzHds0udQBYzs3y8j4gCCW+ZJ7ad0yctld8RYO+bdurlvw==}
+
+  source-map-js@1.2.1:
+    resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
+    engines: {node: '>=0.10.0'}
+
+  tinyglobby@0.2.17:
+    resolution: {integrity: sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==}
+    engines: {node: '>=12.0.0'}
+
+  update-browserslist-db@1.2.3:
+    resolution: {integrity: sha512-Js0m9cx+qOgDxo0eMiFGEueWztz+d4+M3rGlmKPT+T4IS/jP4ylw3Nwpu6cpTTP8R1MAC1kF4VbdLt3ARf209w==}
+    hasBin: true
+    peerDependencies:
+      browserslist: '>= 4.21.0'
+
+  vite@6.4.3:
+    resolution: {integrity: sha512-NTKlcQjlAK7MlQoyb6LgaqHc8sso/pVyUJYWMws3jg21uTJw/LddqIFPcPqP6PzpgbIcZyKI85sFE4HBrQDA8A==}
+    engines: {node: ^18.0.0 || ^20.0.0 || >=22.0.0}
+    hasBin: true
+    peerDependencies:
+      '@types/node': ^18.0.0 || ^20.0.0 || >=22.0.0
+      jiti: '>=1.21.0'
+      less: '*'
+      lightningcss: ^1.21.0
+      sass: '*'
+      sass-embedded: '*'
+      stylus: '*'
+      sugarss: '*'
+      terser: ^5.16.0
+      tsx: ^4.8.1
+      yaml: ^2.4.2
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
+      jiti:
+        optional: true
+      less:
+        optional: true
+      lightningcss:
+        optional: true
+      sass:
+        optional: true
+      sass-embedded:
+        optional: true
+      stylus:
+        optional: true
+      sugarss:
+        optional: true
+      terser:
+        optional: true
+      tsx:
+        optional: true
+      yaml:
+        optional: true
+
+  yallist@3.1.1:
+    resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==}
+
+snapshots:
+
+  '@babel/code-frame@7.29.7':
+    dependencies:
+      '@babel/helper-validator-identifier': 7.29.7
+      js-tokens: 4.0.0
+      picocolors: 1.1.1
+
+  '@babel/compat-data@7.29.7': {}
+
+  '@babel/core@7.29.7':
+    dependencies:
+      '@babel/code-frame': 7.29.7
+      '@babel/generator': 7.29.7
+      '@babel/helper-compilation-targets': 7.29.7
+      '@babel/helper-module-transforms': 7.29.7(@babel/core@7.29.7)
+      '@babel/helpers': 7.29.7
+      '@babel/parser': 7.29.7
+      '@babel/template': 7.29.7
+      '@babel/traverse': 7.29.7
+      '@babel/types': 7.29.7
+      '@jridgewell/remapping': 2.3.5
+      convert-source-map: 2.0.0
+      debug: 4.4.3
+      gensync: 1.0.0-beta.2
+      json5: 2.2.3
+      semver: 6.3.1
+    transitivePeerDependencies:
+      - supports-color
+
+  '@babel/generator@7.29.7':
+    dependencies:
+      '@babel/parser': 7.29.7
+      '@babel/types': 7.29.7
+      '@jridgewell/gen-mapping': 0.3.13
+      '@jridgewell/trace-mapping': 0.3.31
+      jsesc: 3.1.0
+
+  '@babel/helper-compilation-targets@7.29.7':
+    dependencies:
+      '@babel/compat-data': 7.29.7
+      '@babel/helper-validator-option': 7.29.7
+      browserslist: 4.28.4
+      lru-cache: 5.1.1
+      semver: 6.3.1
+
+  '@babel/helper-globals@7.29.7': {}
+
+  '@babel/helper-module-imports@7.29.7':
+    dependencies:
+      '@babel/traverse': 7.29.7
+      '@babel/types': 7.29.7
+    transitivePeerDependencies:
+      - supports-color
+
+  '@babel/helper-module-transforms@7.29.7(@babel/core@7.29.7)':
+    dependencies:
+      '@babel/core': 7.29.7
+      '@babel/helper-module-imports': 7.29.7
+      '@babel/helper-validator-identifier': 7.29.7
+      '@babel/traverse': 7.29.7
+    transitivePeerDependencies:
+      - supports-color
+
+  '@babel/helper-plugin-utils@7.29.7': {}
+
+  '@babel/helper-string-parser@7.29.7': {}
+
+  '@babel/helper-validator-identifier@7.29.7': {}
+
+  '@babel/helper-validator-option@7.29.7': {}
+
+  '@babel/helpers@7.29.7':
+    dependencies:
+      '@babel/template': 7.29.7
+      '@babel/types': 7.29.7
+
+  '@babel/parser@7.29.7':
+    dependencies:
+      '@babel/types': 7.29.7
+
+  '@babel/plugin-transform-react-jsx-self@7.29.7(@babel/core@7.29.7)':
+    dependencies:
+      '@babel/core': 7.29.7
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-transform-react-jsx-source@7.29.7(@babel/core@7.29.7)':
+    dependencies:
+      '@babel/core': 7.29.7
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/template@7.29.7':
+    dependencies:
+      '@babel/code-frame': 7.29.7
+      '@babel/parser': 7.29.7
+      '@babel/types': 7.29.7
+
+  '@babel/traverse@7.29.7':
+    dependencies:
+      '@babel/code-frame': 7.29.7
+      '@babel/generator': 7.29.7
+      '@babel/helper-globals': 7.29.7
+      '@babel/parser': 7.29.7
+      '@babel/template': 7.29.7
+      '@babel/types': 7.29.7
+      debug: 4.4.3
+    transitivePeerDependencies:
+      - supports-color
+
+  '@babel/types@7.29.7':
+    dependencies:
+      '@babel/helper-string-parser': 7.29.7
+      '@babel/helper-validator-identifier': 7.29.7
+
+  '@esbuild/aix-ppc64@0.25.12':
+    optional: true
+
+  '@esbuild/android-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/android-arm@0.25.12':
+    optional: true
+
+  '@esbuild/android-x64@0.25.12':
+    optional: true
+
+  '@esbuild/darwin-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/darwin-x64@0.25.12':
+    optional: true
+
+  '@esbuild/freebsd-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/freebsd-x64@0.25.12':
+    optional: true
+
+  '@esbuild/linux-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/linux-arm@0.25.12':
+    optional: true
+
+  '@esbuild/linux-ia32@0.25.12':
+    optional: true
+
+  '@esbuild/linux-loong64@0.25.12':
+    optional: true
+
+  '@esbuild/linux-mips64el@0.25.12':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.25.12':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.25.12':
+    optional: true
+
+  '@esbuild/linux-s390x@0.25.12':
+    optional: true
+
+  '@esbuild/linux-x64@0.25.12':
+    optional: true
+
+  '@esbuild/netbsd-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.25.12':
+    optional: true
+
+  '@esbuild/openbsd-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.25.12':
+    optional: true
+
+  '@esbuild/openharmony-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/sunos-x64@0.25.12':
+    optional: true
+
+  '@esbuild/win32-arm64@0.25.12':
+    optional: true
+
+  '@esbuild/win32-ia32@0.25.12':
+    optional: true
+
+  '@esbuild/win32-x64@0.25.12':
+    optional: true
+
+  '@jridgewell/gen-mapping@0.3.13':
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.5.5
+      '@jridgewell/trace-mapping': 0.3.31
+
+  '@jridgewell/remapping@2.3.5':
+    dependencies:
+      '@jridgewell/gen-mapping': 0.3.13
+      '@jridgewell/trace-mapping': 0.3.31
+
+  '@jridgewell/resolve-uri@3.1.2': {}
+
+  '@jridgewell/sourcemap-codec@1.5.5': {}
+
+  '@jridgewell/trace-mapping@0.3.31':
+    dependencies:
+      '@jridgewell/resolve-uri': 3.1.2
+      '@jridgewell/sourcemap-codec': 1.5.5
+
+  '@rolldown/pluginutils@1.0.0-beta.27': {}
+
+  '@rollup/rollup-android-arm-eabi@4.62.2':
+    optional: true
+
+  '@rollup/rollup-android-arm64@4.62.2':
+    optional: true
+
+  '@rollup/rollup-darwin-arm64@4.62.2':
+    optional: true
+
+  '@rollup/rollup-darwin-x64@4.62.2':
+    optional: true
+
+  '@rollup/rollup-freebsd-arm64@4.62.2':
+    optional: true
+
+  '@rollup/rollup-freebsd-x64@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-arm-gnueabihf@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-arm-musleabihf@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-gnu@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-musl@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-loong64-gnu@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-loong64-musl@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-ppc64-gnu@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-ppc64-musl@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-riscv64-gnu@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-riscv64-musl@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-s390x-gnu@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-x64-gnu@4.62.2':
+    optional: true
+
+  '@rollup/rollup-linux-x64-musl@4.62.2':
+    optional: true
+
+  '@rollup/rollup-openbsd-x64@4.62.2':
+    optional: true
+
+  '@rollup/rollup-openharmony-arm64@4.62.2':
+    optional: true
+
+  '@rollup/rollup-win32-arm64-msvc@4.62.2':
+    optional: true
+
+  '@rollup/rollup-win32-ia32-msvc@4.62.2':
+    optional: true
+
+  '@rollup/rollup-win32-x64-gnu@4.62.2':
+    optional: true
+
+  '@rollup/rollup-win32-x64-msvc@4.62.2':
+    optional: true
+
+  '@types/babel__core@7.20.5':
+    dependencies:
+      '@babel/parser': 7.29.7
+      '@babel/types': 7.29.7
+      '@types/babel__generator': 7.27.0
+      '@types/babel__template': 7.4.4
+      '@types/babel__traverse': 7.28.0
+
+  '@types/babel__generator@7.27.0':
+    dependencies:
+      '@babel/types': 7.29.7
+
+  '@types/babel__template@7.4.4':
+    dependencies:
+      '@babel/parser': 7.29.7
+      '@babel/types': 7.29.7
+
+  '@types/babel__traverse@7.28.0':
+    dependencies:
+      '@babel/types': 7.29.7
+
+  '@types/estree@1.0.9': {}
+
+  '@vitejs/plugin-react@4.7.0(vite@6.4.3)':
+    dependencies:
+      '@babel/core': 7.29.7
+      '@babel/plugin-transform-react-jsx-self': 7.29.7(@babel/core@7.29.7)
+      '@babel/plugin-transform-react-jsx-source': 7.29.7(@babel/core@7.29.7)
+      '@rolldown/pluginutils': 1.0.0-beta.27
+      '@types/babel__core': 7.20.5
+      react-refresh: 0.17.0
+      vite: 6.4.3
+    transitivePeerDependencies:
+      - supports-color
+
+  baseline-browser-mapping@2.10.40: {}
+
+  browserslist@4.28.4:
+    dependencies:
+      baseline-browser-mapping: 2.10.40
+      caniuse-lite: 1.0.30001799
+      electron-to-chromium: 1.5.379
+      node-releases: 2.0.50
+      update-browserslist-db: 1.2.3(browserslist@4.28.4)
+
+  caniuse-lite@1.0.30001799: {}
+
+  convert-source-map@2.0.0: {}
+
+  cookie@1.1.1: {}
+
+  debug@4.4.3:
+    dependencies:
+      ms: 2.1.3
+
+  electron-to-chromium@1.5.379: {}
+
+  esbuild@0.25.12:
+    optionalDependencies:
+      '@esbuild/aix-ppc64': 0.25.12
+      '@esbuild/android-arm': 0.25.12
+      '@esbuild/android-arm64': 0.25.12
+      '@esbuild/android-x64': 0.25.12
+      '@esbuild/darwin-arm64': 0.25.12
+      '@esbuild/darwin-x64': 0.25.12
+      '@esbuild/freebsd-arm64': 0.25.12
+      '@esbuild/freebsd-x64': 0.25.12
+      '@esbuild/linux-arm': 0.25.12
+      '@esbuild/linux-arm64': 0.25.12
+      '@esbuild/linux-ia32': 0.25.12
+      '@esbuild/linux-loong64': 0.25.12
+      '@esbuild/linux-mips64el': 0.25.12
+      '@esbuild/linux-ppc64': 0.25.12
+      '@esbuild/linux-riscv64': 0.25.12
+      '@esbuild/linux-s390x': 0.25.12
+      '@esbuild/linux-x64': 0.25.12
+      '@esbuild/netbsd-arm64': 0.25.12
+      '@esbuild/netbsd-x64': 0.25.12
+      '@esbuild/openbsd-arm64': 0.25.12
+      '@esbuild/openbsd-x64': 0.25.12
+      '@esbuild/openharmony-arm64': 0.25.12
+      '@esbuild/sunos-x64': 0.25.12
+      '@esbuild/win32-arm64': 0.25.12
+      '@esbuild/win32-ia32': 0.25.12
+      '@esbuild/win32-x64': 0.25.12
+
+  escalade@3.2.0: {}
+
+  fdir@6.5.0(picomatch@4.0.4):
+    optionalDependencies:
+      picomatch: 4.0.4
+
+  fsevents@2.3.3:
+    optional: true
+
+  gensync@1.0.0-beta.2: {}
+
+  js-tokens@4.0.0: {}
+
+  jsesc@3.1.0: {}
+
+  json5@2.2.3: {}
+
+  lru-cache@5.1.1:
+    dependencies:
+      yallist: 3.1.1
+
+  ms@2.1.3: {}
+
+  nanoid@3.3.15: {}
+
+  node-releases@2.0.50: {}
+
+  picocolors@1.1.1: {}
+
+  picomatch@4.0.4: {}
+
+  postcss@8.5.15:
+    dependencies:
+      nanoid: 3.3.15
+      picocolors: 1.1.1
+      source-map-js: 1.2.1
+
+  react-dom@19.2.7(react@19.2.7):
+    dependencies:
+      react: 19.2.7
+      scheduler: 0.27.0
+
+  react-refresh@0.17.0: {}
+
+  react-router@7.18.0(react-dom@19.2.7(react@19.2.7))(react@19.2.7):
+    dependencies:
+      cookie: 1.1.1
+      react: 19.2.7
+      set-cookie-parser: 2.7.2
+    optionalDependencies:
+      react-dom: 19.2.7(react@19.2.7)
+
+  react@19.2.7: {}
+
+  rollup@4.62.2:
+    dependencies:
+      '@types/estree': 1.0.9
+    optionalDependencies:
+      '@rollup/rollup-android-arm-eabi': 4.62.2
+      '@rollup/rollup-android-arm64': 4.62.2
+      '@rollup/rollup-darwin-arm64': 4.62.2
+      '@rollup/rollup-darwin-x64': 4.62.2
+      '@rollup/rollup-freebsd-arm64': 4.62.2
+      '@rollup/rollup-freebsd-x64': 4.62.2
+      '@rollup/rollup-linux-arm-gnueabihf': 4.62.2
+      '@rollup/rollup-linux-arm-musleabihf': 4.62.2
+      '@rollup/rollup-linux-arm64-gnu': 4.62.2
+      '@rollup/rollup-linux-arm64-musl': 4.62.2
+      '@rollup/rollup-linux-loong64-gnu': 4.62.2
+      '@rollup/rollup-linux-loong64-musl': 4.62.2
+      '@rollup/rollup-linux-ppc64-gnu': 4.62.2
+      '@rollup/rollup-linux-ppc64-musl': 4.62.2
+      '@rollup/rollup-linux-riscv64-gnu': 4.62.2
+      '@rollup/rollup-linux-riscv64-musl': 4.62.2
+      '@rollup/rollup-linux-s390x-gnu': 4.62.2
+      '@rollup/rollup-linux-x64-gnu': 4.62.2
+      '@rollup/rollup-linux-x64-musl': 4.62.2
+      '@rollup/rollup-openbsd-x64': 4.62.2
+      '@rollup/rollup-openharmony-arm64': 4.62.2
+      '@rollup/rollup-win32-arm64-msvc': 4.62.2
+      '@rollup/rollup-win32-ia32-msvc': 4.62.2
+      '@rollup/rollup-win32-x64-gnu': 4.62.2
+      '@rollup/rollup-win32-x64-msvc': 4.62.2
+      fsevents: 2.3.3
+
+  scheduler@0.27.0: {}
+
+  semver@6.3.1: {}
+
+  set-cookie-parser@2.7.2: {}
+
+  source-map-js@1.2.1: {}
+
+  tinyglobby@0.2.17:
+    dependencies:
+      fdir: 6.5.0(picomatch@4.0.4)
+      picomatch: 4.0.4
+
+  update-browserslist-db@1.2.3(browserslist@4.28.4):
+    dependencies:
+      browserslist: 4.28.4
+      escalade: 3.2.0
+      picocolors: 1.1.1
+
+  vite@6.4.3:
+    dependencies:
+      esbuild: 0.25.12
+      fdir: 6.5.0(picomatch@4.0.4)
+      picomatch: 4.0.4
+      postcss: 8.5.15
+      rollup: 4.62.2
+      tinyglobby: 0.2.17
+    optionalDependencies:
+      fsevents: 2.3.3
+
+  yallist@3.1.1: {}
diff --git a/samples/react/quickstart/src/App.css b/samples/react/quickstart/src/App.css
new file mode 100644
index 0000000..f82a388
--- /dev/null
+++ b/samples/react/quickstart/src/App.css
@@ -0,0 +1,707 @@
+/* ─── Design tokens ─────────────────────────────────────────────── */
+:root {
+  --color-primary:    #3688FF;
+  --color-navy:       #05213F;
+  --color-bg:         #F7F9FC;
+  --color-card:       #ffffff;
+  --color-border:     #DDE3EC;
+  --color-muted:      #5A7085;
+  --color-text:       #05213F;
+  --nav-bg:           rgba(247, 249, 252, 0.92);
+  --nav-height:       52px;
+  --radius-card:      12px;
+  --radius-btn:       8px;
+  --transition:       0.2s ease;
+}
+
+[data-theme='dark'] {
+  --color-bg:         #080f1c;
+  --color-card:       #0f1a2d;
+  --color-border:     rgba(255, 255, 255, 0.09);
+  --color-text:       #E0EAFF;
+  --color-muted:      rgba(224, 234, 255, 0.48);
+  --color-navy:       #E0EAFF;
+  --nav-bg:           rgba(8, 15, 28, 0.92);
+}
+
+/* ─── App shell ─────────────────────────────────────────────────── */
+.app {
+  min-height: 100vh;
+  background: var(--color-bg);
+  color: var(--color-text);
+  transition: background var(--transition), color var(--transition);
+}
+
+/* ─── Nav ───────────────────────────────────────────────────────── */
+.nav {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: var(--nav-height);
+  display: flex;
+  align-items: center;
+  padding: 0 28px;
+  background: var(--nav-bg);
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
+  border-bottom: 1px solid var(--color-border);
+  z-index: 100;
+  gap: 12px;
+}
+
+.nav-logo {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  cursor: pointer;
+  text-decoration: none;
+  color: inherit;
+  flex: 1;
+}
+
+.wordmark {
+  display: flex;
+  flex-direction: column;
+  gap: 0;
+}
+.wordmark-name {
+  font-size: 14px;
+  font-weight: 700;
+  letter-spacing: -0.03em;
+  line-height: 1.1;
+  color: var(--color-text);
+}
+.wordmark-sub {
+  font-size: 8.5px;
+  font-weight: 700;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: #3688FF;
+  line-height: 1;
+  margin-top: 1.5px;
+}
+
+.nav-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+/* ─── Dark-mode toggle ──────────────────────────────────────────── */
+.dark-toggle {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 34px;
+  height: 34px;
+  border-radius: 8px;
+  border: 1px solid var(--color-border);
+  background: transparent;
+  color: var(--color-muted);
+  cursor: pointer;
+  font-size: 15px;
+  transition: border-color var(--transition), color var(--transition), background var(--transition);
+  flex-shrink: 0;
+}
+
+.dark-toggle:hover {
+  background: var(--color-border);
+  color: var(--color-text);
+}
+
+/* ─── Buttons ───────────────────────────────────────────────────── */
+.btn-primary,
+.btn-outline,
+.btn-ghost {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 46px;
+  padding: 0 24px;
+  border-radius: var(--radius-btn);
+  font-size: 15px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: opacity var(--transition), background var(--transition), border-color var(--transition);
+  white-space: nowrap;
+  text-decoration: none;
+  font-family: inherit;
+}
+
+.btn-primary {
+  background: var(--color-primary);
+  color: #fff;
+  border: 1.5px solid var(--color-primary);
+}
+
+.btn-primary:hover {
+  opacity: 0.88;
+}
+
+.btn-outline {
+  background: transparent;
+  color: var(--color-primary);
+  border: 1.5px solid rgba(54, 136, 255, 0.4);
+}
+
+.btn-outline:hover {
+  background: rgba(54, 136, 255, 0.08);
+}
+
+.btn-ghost {
+  background: transparent;
+  color: var(--color-muted);
+  border: none;
+}
+.btn-ghost:hover {
+  background: rgba(0, 0, 0, 0.04);
+}
+
+/* Nav-sized buttons (slightly shorter) */
+.nav .btn-primary,
+.nav .btn-outline,
+.nav .btn-ghost {
+  height: 36px;
+  padding: 0 16px;
+  font-size: 14px;
+}
+
+/* ─── Loading ───────────────────────────────────────────────────── */
+.loading-screen {
+  min-height: calc(100vh - var(--nav-height));
+  margin-top: var(--nav-height);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--color-muted);
+  font-size: 15px;
+}
+
+/* ─── Hero ──────────────────────────────────────────────────────── */
+.hero {
+  min-height: calc(100vh - var(--nav-height));
+  margin-top: var(--nav-height);
+  padding: 96px 32px 80px;
+}
+
+.home-shell {
+  min-height: calc(100vh - var(--nav-height));
+  margin-top: var(--nav-height);
+}
+
+.hero-inner {
+  width: 100%;
+  max-width: 560px;
+  margin: 0 auto;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  gap: 0;
+}
+
+.hero-mark { display: flex; justify-content: center; margin-bottom: 32px; }
+
+.hero-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: var(--color-muted);
+  margin-bottom: 28px;
+}
+.hero-badge-line {
+  display: block;
+  height: 1px;
+  width: 24px;
+  background: var(--color-border);
+  flex-shrink: 0;
+}
+
+.hero-title {
+  font-size: 42px;
+  font-weight: 700;
+  letter-spacing: -0.05em;
+  line-height: 1.1;
+  color: var(--color-text);
+  margin: 0 0 18px;
+}
+
+.hero-subtitle {
+  font-size: 16px;
+  color: var(--color-muted);
+  max-width: 420px;
+  line-height: 1.8;
+  letter-spacing: -0.01em;
+  margin: 0 auto 36px;
+}
+
+.hero-ctas {
+  display: flex;
+  justify-content: center;
+  gap: 10px;
+  margin-bottom: 52px;
+}
+
+.hero-divider {
+  width: 100%;
+  border: none;
+  border-top: 1px solid var(--color-border);
+  margin: 4px 0;
+}
+
+/* ─── Stats row ─────────────────────────────────────────────────── */
+.hero-stats {
+  width: 100%;
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+}
+
+.stat {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+  padding: 16px 8px;
+}
+
+.stat:not(:last-child) {
+  border-right: 1px solid var(--color-border);
+}
+
+.stat-value {
+  font-size: 15px;
+  font-weight: 700;
+  color: var(--color-text);
+}
+
+.stat-label {
+  font-size: 12px;
+  color: var(--color-muted);
+}
+
+/* ─── Signed-in home page ───────────────────────────────────────────── */
+.home-main {
+  width: 100%;
+  max-width: 900px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+/* Greeting */
+.home-greeting {
+  display: flex;
+  align-items: flex-start;
+  gap: 16px;
+  margin-bottom: 36px;
+}
+
+.home-greeting-text {
+  min-width: 0;
+}
+
+.home-greeting-name {
+  margin: 0 0 6px;
+  font-size: 26px;
+  font-weight: 700;
+  color: var(--color-text);
+  letter-spacing: -0.04em;
+}
+
+.home-greeting-meta {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 13px;
+  color: var(--color-muted);
+  letter-spacing: -0.01em;
+  flex-wrap: wrap;
+}
+
+.home-dot {
+  display: inline-block;
+  width: 3px;
+  height: 3px;
+  border-radius: 50%;
+  background: var(--color-border);
+  flex-shrink: 0;
+}
+
+.home-session-active {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  color: #2fbd6b;
+}
+
+.home-session-dot {
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: #2fbd6b;
+  flex-shrink: 0;
+}
+
+/* Session stats row */
+.home-stats {
+  display: flex;
+  gap: 0;
+  padding: 20px 0;
+  border-top: 1px solid var(--color-border);
+  border-bottom: 1px solid var(--color-border);
+  margin-bottom: 52px;
+}
+
+.home-stat {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-width: 0;
+}
+
+.home-stat--bordered {
+  padding-left: 32px;
+  border-left: 1px solid var(--color-border);
+}
+
+.home-stat-icon {
+  width: 32px;
+  height: 32px;
+  border-radius: 8px;
+  background: rgba(54, 136, 255, 0.1);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: #3688FF;
+}
+
+.home-stat-value {
+  font-size: 14px;
+  font-weight: 700;
+  color: var(--color-text);
+  letter-spacing: -0.02em;
+}
+
+.home-stat-value--mono {
+  font-family: var(--font-mono, monospace);
+  letter-spacing: 0.01em;
+}
+
+.home-stat-label {
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--color-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.07em;
+  margin-top: 2px;
+}
+
+/* What's next */
+.home-next-label {
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-muted);
+  margin-bottom: 20px;
+}
+
+.home-next-list {
+  display: flex;
+  flex-direction: column;
+}
+
+.home-next-item {
+  display: grid;
+  grid-template-columns: 28px 1fr auto;
+  gap: 16px;
+  align-items: start;
+  padding: 20px 0;
+  border-top: 1px solid var(--color-border);
+  text-decoration: none;
+  color: inherit;
+  cursor: pointer;
+  transition: background var(--transition);
+  border-radius: 4px;
+}
+
+.home-next-item:hover .home-next-cta {
+  opacity: 1;
+}
+
+.home-next-n {
+  font-size: 11px;
+  font-weight: 700;
+  color: #3688FF;
+  letter-spacing: 0.05em;
+  padding-top: 2px;
+  font-variant-numeric: tabular-nums;
+}
+
+.home-next-body {
+  min-width: 0;
+}
+
+.home-next-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--color-text);
+  letter-spacing: -0.02em;
+  margin-bottom: 4px;
+}
+
+.home-next-desc {
+  font-size: 13px;
+  color: var(--color-muted);
+  line-height: 1.6;
+  letter-spacing: -0.01em;
+}
+
+.home-next-cta {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 13px;
+  font-weight: 600;
+  color: #3688FF;
+  white-space: nowrap;
+  opacity: 0.7;
+  transition: opacity var(--transition);
+  padding-top: 2px;
+}
+
+/* ─── Nav back button ───────────────────────────────────────────── */
+.nav-back-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  height: 32px;
+  padding: 0 10px;
+  border-radius: 6px;
+  border: none;
+  background: transparent;
+  color: var(--color-muted);
+  font-size: 13px;
+  font-family: inherit;
+  letter-spacing: -0.01em;
+  cursor: pointer;
+  transition: background var(--transition), color var(--transition);
+}
+
+.nav-back-btn:hover {
+  background: var(--color-border);
+  color: var(--color-text);
+}
+
+/* ─── Token debug page ──────────────────────────────────────────── */
+.profile-main {
+  width: 100%;
+  max-width: 780px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+.token-main {
+  width: 100%;
+  max-width: 780px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+.token-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16px;
+  margin-bottom: 36px;
+  flex-wrap: wrap;
+}
+
+.token-title {
+  margin: 0 0 5px;
+  font-size: 22px;
+  font-weight: 700;
+  letter-spacing: -0.04em;
+  color: var(--color-text);
+}
+
+.token-subtitle {
+  margin: 0;
+  font-size: 13px;
+  color: var(--color-muted);
+  letter-spacing: -0.01em;
+}
+
+.token-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 7px;
+  padding: 6px 12px;
+  border-radius: 6px;
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: -0.01em;
+  flex-shrink: 0;
+}
+
+.token-badge--expired {
+  background: rgba(220, 38, 38, 0.08);
+  border: 1px solid rgba(220, 38, 38, 0.22);
+  color: #dc2626;
+}
+
+.token-badge--valid {
+  background: rgba(47, 189, 107, 0.08);
+  border: 1px solid rgba(47, 189, 107, 0.22);
+  color: #2fbd6b;
+}
+
+.token-badge-dot {
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: currentColor;
+  flex-shrink: 0;
+}
+
+/* Raw token section */
+.token-raw-section {
+  margin-bottom: 20px;
+}
+
+.token-raw-label-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 8px;
+}
+
+.token-section-label {
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-muted);
+}
+
+.token-copy-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  padding: 4px 10px;
+  border-radius: 5px;
+  background: transparent;
+  border: 1px solid var(--color-border);
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--color-muted);
+  cursor: pointer;
+  font-family: inherit;
+  letter-spacing: -0.01em;
+  transition: border-color var(--transition), color var(--transition);
+}
+
+.token-copy-btn:hover {
+  border-color: #3688FF;
+  color: #3688FF;
+}
+
+.token-raw {
+  display: block;
+  font-size: 11px;
+  font-family: var(--font-mono, monospace);
+  word-break: break-all;
+  line-height: 1.8;
+  background: #0b1120;
+  padding: 14px 16px;
+  border-radius: 8px;
+  overflow-x: auto;
+}
+
+.token-raw--loading {
+  color: rgba(255, 255, 255, 0.3);
+}
+
+.token-part--header   { color: #ff7b72; }
+.token-part--payload  { color: #79c0ff; }
+.token-part--signature { color: #3fb950; }
+
+.token-dot {
+  color: rgba(255, 255, 255, 0.2);
+}
+
+/* Decoded grid */
+.token-decoded-grid {
+  display: grid;
+  grid-template-columns: 1fr 1.7fr;
+  gap: 12px;
+  margin-bottom: 20px;
+}
+
+.token-code-box {
+  background: #0b1120;
+  border-radius: 10px;
+  overflow: hidden;
+}
+
+.token-code-box-header {
+  padding: 9px 14px;
+  font-size: 10px;
+  font-weight: 700;
+  letter-spacing: 0.09em;
+  text-transform: uppercase;
+}
+
+.token-code-box-header--header {
+  color: #ff7b72;
+  border-bottom: 1px solid rgba(255, 123, 114, 0.15);
+}
+
+.token-code-box-header--payload {
+  color: #79c0ff;
+  border-bottom: 1px solid rgba(121, 192, 255, 0.15);
+}
+
+.token-code-pre {
+  margin: 0;
+  padding: 14px;
+  font-size: 11.5px;
+  line-height: 1.8;
+  font-family: var(--font-mono, monospace);
+  color: #c9d1d9;
+  overflow-x: auto;
+  max-height: 220px;
+}
+
+/* Meta row */
+.token-meta-row {
+  display: flex;
+  gap: 32px;
+  padding-top: 20px;
+  border-top: 1px solid var(--color-border);
+  flex-wrap: wrap;
+}
+
+.token-meta-label {
+  font-size: 10px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-muted);
+  margin-bottom: 5px;
+}
+
+.token-meta-value {
+  font-size: 12px;
+  font-family: var(--font-mono, monospace);
+  color: var(--color-text);
+  letter-spacing: -0.01em;
+}
diff --git a/samples/react/quickstart/src/App.jsx b/samples/react/quickstart/src/App.jsx
new file mode 100644
index 0000000..15388d9
--- /dev/null
+++ b/samples/react/quickstart/src/App.jsx
@@ -0,0 +1,23 @@
+import { createBrowserRouter, RouterProvider } from 'react-router'
+import { ProtectedRoute, CallbackRoute } from '@thunderid/react-router'
+import Nav from './components/Nav'
+import HomePage from './pages/HomePage'
+import ProfilePage from './pages/ProfilePage'
+import TokenDebugPage from './pages/TokenDebugPage'
+import './App.css'
+
+const router = createBrowserRouter([
+  {
+    element: <Nav />,
+    children: [
+      { path: '/', element: <HomePage /> },
+      { path: '/profile', element: <ProtectedRoute><ProfilePage /></ProtectedRoute> },
+      { path: '/token', element: <ProtectedRoute><TokenDebugPage /></ProtectedRoute> },
+      { path: '/callback', element: <CallbackRoute /> },
+    ],
+  },
+])
+
+export default function App() {
+  return <RouterProvider router={router} />
+}
diff --git a/samples/react/quickstart/src/components/HeroCtas.jsx b/samples/react/quickstart/src/components/HeroCtas.jsx
new file mode 100644
index 0000000..f07e694
--- /dev/null
+++ b/samples/react/quickstart/src/components/HeroCtas.jsx
@@ -0,0 +1,22 @@
+import { SignUpButton, SignInButton } from '@thunderid/react'
+
+export default function HeroCtas() {
+  return (
+    <div className="hero-ctas">
+      <SignUpButton>
+        {({ signUp, isLoading }) => (
+          <button className="btn-primary" onClick={signUp} disabled={isLoading}>
+            {isLoading ? 'Signing up…' : 'Get started'}
+          </button>
+        )}
+      </SignUpButton>
+      <SignInButton>
+        {({ signIn, isLoading }) => (
+          <button className="btn-outline" onClick={signIn} disabled={isLoading}>
+            {isLoading ? 'Signing in…' : 'Sign in'}
+          </button>
+        )}
+      </SignInButton>
+    </div>
+  )
+}
diff --git a/samples/react/quickstart/src/components/Nav.jsx b/samples/react/quickstart/src/components/Nav.jsx
new file mode 100644
index 0000000..aa402cf
--- /dev/null
+++ b/samples/react/quickstart/src/components/Nav.jsx
@@ -0,0 +1,126 @@
+import { useState } from 'react'
+import { Link, Outlet, useLocation } from 'react-router'
+import { SignedIn, SignedOut, SignInButton, SignUpButton, UserDropdown, Loading } from '@thunderid/react'
+import ThunderMark from './ThunderMark'
+
+function MoonIcon() {
+  return (
+    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" />
+    </svg>
+  )
+}
+
+function SunIcon() {
+  return (
+    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <circle cx="12" cy="12" r="5" />
+      <line x1="12" y1="1" x2="12" y2="3" /><line x1="12" y1="21" x2="12" y2="23" />
+      <line x1="4.22" y1="4.22" x2="5.64" y2="5.64" /><line x1="18.36" y1="18.36" x2="19.78" y2="19.78" />
+      <line x1="1" y1="12" x2="3" y2="12" /><line x1="21" y1="12" x2="23" y2="12" />
+      <line x1="4.22" y1="19.78" x2="5.64" y2="18.36" /><line x1="18.36" y1="5.64" x2="19.78" y2="4.22" />
+    </svg>
+  )
+}
+
+function ChevronLeftIcon() {
+  return (
+    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <polyline points="15 18 9 12 15 6" />
+    </svg>
+  )
+}
+
+function KeyIcon() {
+  return (
+    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <circle cx="7.5" cy="15.5" r="5.5" />
+      <path d="M21 2l-9.6 9.6" />
+      <path d="M15.5 7.5l3 3L22 7l-3-3" />
+    </svg>
+  )
+}
+
+function UserIcon() {
+  return (
+    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <circle cx="12" cy="8" r="4" />
+      <path d="M4 20c0-4 3.6-7 8-7s8 3 8 7" />
+    </svg>
+  )
+}
+
+export default function Nav() {
+  const [dark, setDark] = useState(false)
+  const location = useLocation()
+  const isHome = location.pathname === '/'
+
+  const toggleDark = () => {
+    const next = !dark
+    setDark(next)
+    document.documentElement.setAttribute('data-theme', next ? 'dark' : '')
+  }
+
+  const profileMenuItem = {
+    label: <span style={{ display: 'flex', alignItems: 'center', gap: 8 }}><UserIcon />Profile</span>,
+    href: '/profile',
+  }
+  const tokenDebugMenuItem = {
+    label: <span style={{ display: 'flex', alignItems: 'center', gap: 8 }}><KeyIcon />Token debug</span>,
+    href: '/token',
+  }
+
+  return (
+    <div className="app" data-theme={dark ? 'dark' : undefined}>
+      <nav className="nav">
+        <Link to="/" className="nav-logo">
+          <ThunderMark height={24} dark={dark} />
+          <div className="wordmark">
+            <span className="wordmark-name">ThunderID</span>
+            <span className="wordmark-sub">Quickstart</span>
+          </div>
+        </Link>
+        <div className="nav-actions">
+          {!isHome && (
+            <Link to="/" className="nav-back-btn">
+              <ChevronLeftIcon />
+              Home
+            </Link>
+          )}
+          <button
+            className="dark-toggle"
+            onClick={toggleDark}
+            aria-label={dark ? 'Switch to light mode' : 'Switch to dark mode'}
+          >
+            {dark ? <SunIcon /> : <MoonIcon />}
+          </button>
+          <SignedIn>
+            <UserDropdown showTriggerLabel menuItems={[profileMenuItem, tokenDebugMenuItem]} />
+          </SignedIn>
+          <SignedOut>
+            <SignInButton>
+              {({ signIn, isLoading }) => (
+                <button className="btn-ghost" onClick={signIn} disabled={isLoading}>
+                  {isLoading ? 'Signing in…' : 'Sign in'}
+                </button>
+              )}
+            </SignInButton>
+            <SignUpButton>
+              {({ signUp, isLoading }) => (
+                <button className="btn-primary" onClick={signUp} disabled={isLoading}>
+                  {isLoading ? 'Signing up…' : 'Sign up'}
+                </button>
+              )}
+            </SignUpButton>
+          </SignedOut>
+        </div>
+      </nav>
+
+      <Loading>
+        <div className="loading-screen">Loading…</div>
+      </Loading>
+
+      <Outlet context={{ dark }} />
+    </div>
+  )
+}
diff --git a/samples/react/quickstart/src/components/ThunderMark.jsx b/samples/react/quickstart/src/components/ThunderMark.jsx
new file mode 100644
index 0000000..4fe9bbf
--- /dev/null
+++ b/samples/react/quickstart/src/components/ThunderMark.jsx
@@ -0,0 +1,10 @@
+export default function ThunderMark({ height = 40, dark = false }) {
+  const w = Math.round(height * (207 / 257))
+  return (
+    <svg width={w} height={height} viewBox="0 0 207 257" fill="none" aria-hidden="true">
+      <path d="M55.4763 26.4391L58.8866 0H0V26.4391H55.4763Z" fill={dark ? '#E8F4FF' : '#05213F'} />
+      <path d="M39.8438 147.407L49.5455 72.2839H4.9909e-05V256.743H60.5602L80.048 147.407H39.8438Z" fill="#3688FF" />
+      <path d="M192.42 59.361C182.782 40.2307 168.929 25.5705 150.903 15.3381C145.501 12.2662 139.761 9.6605 133.703 7.5208L115.401 103.702H159.757L76.2987 256.743H83.3735C109.449 256.743 131.69 251.574 150.14 241.236C168.569 230.897 182.634 216.131 192.356 196.959C202.058 177.765 206.909 154.8 206.909 128.043C206.909 101.286 202.079 78.5123 192.441 59.3821L192.42 59.361Z" fill="#3688FF" />
+    </svg>
+  )
+}
diff --git a/samples/react/quickstart/src/index.css b/samples/react/quickstart/src/index.css
new file mode 100644
index 0000000..077b2d2
--- /dev/null
+++ b/samples/react/quickstart/src/index.css
@@ -0,0 +1,9 @@
+*, *::before, *::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+body {
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+}
diff --git a/samples/react/quickstart/src/main.jsx b/samples/react/quickstart/src/main.jsx
new file mode 100644
index 0000000..d42f87b
--- /dev/null
+++ b/samples/react/quickstart/src/main.jsx
@@ -0,0 +1,17 @@
+import { StrictMode } from 'react'
+import { createRoot } from 'react-dom/client'
+import { ThunderIDProvider } from '@thunderid/react'
+import App from './App.jsx'
+import './index.css'
+
+createRoot(document.getElementById('root')).render(
+  <StrictMode>
+    <ThunderIDProvider
+      clientId={import.meta.env.VITE_THUNDERID_CLIENT_ID}
+      baseUrl={import.meta.env.VITE_THUNDERID_BASE_URL}
+      afterSignInUrl={`${window.location.origin}/callback`}
+    >
+      <App />
+    </ThunderIDProvider>
+  </StrictMode>
+)
diff --git a/samples/react/quickstart/src/pages/HomePage.jsx b/samples/react/quickstart/src/pages/HomePage.jsx
new file mode 100644
index 0000000..aba19fa
--- /dev/null
+++ b/samples/react/quickstart/src/pages/HomePage.jsx
@@ -0,0 +1,254 @@
+import { useState, useEffect } from 'react'
+import { useOutletContext } from 'react-router'
+import { SignedIn, SignedOut, User, UserAvatar, useThunderID } from '@thunderid/react'
+import ThunderMark from '../components/ThunderMark'
+import HeroCtas from '../components/HeroCtas'
+
+function greeting(name) {
+  const h = new Date().getHours()
+  const tod = h < 12 ? 'morning' : h < 17 ? 'afternoon' : 'evening'
+  return `Good ${tod}, ${name}.`
+}
+
+function formatTime(unixSeconds) {
+  if (!unixSeconds) return '—'
+  return new Date(unixSeconds * 1000).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })
+}
+
+function formatCountdown(secsLeft) {
+  if (secsLeft <= 0) return { text: 'Expired', color: '#d95757' }
+  if (secsLeft < 300) {
+    const m = Math.floor(secsLeft / 60), s = secsLeft % 60
+    return { text: `${m}m ${s}s`, color: '#e88b3a' }
+  }
+  if (secsLeft < 3600) {
+    const m = Math.floor(secsLeft / 60), s = secsLeft % 60
+    return { text: `${m}m ${s}s`, color: '#2fbd6b' }
+  }
+  const hr = Math.floor(secsLeft / 3600), m = Math.floor((secsLeft % 3600) / 60)
+  return { text: `${hr}h ${m}m`, color: '#2fbd6b' }
+}
+
+const NEXT_STEPS = [
+  {
+    n: '01',
+    title: 'Explore use cases',
+    body: 'See what you can build — auth flows for web, mobile, APIs, and agents.',
+    cta: 'Browse use cases',
+    href: 'https://thunderid.dev/docs/next/use-cases/overview/',
+  },
+  {
+    n: '02',
+    title: 'Learn about flows',
+    body: 'Understand how authorization code, PKCE, client credentials, and device flows work.',
+    cta: 'Read guide',
+    href: 'https://thunderid.dev/docs/next/guides/guides/flows/what-are-flows/',
+  },
+  {
+    n: '03',
+    title: 'Style your experience',
+    body: 'Customize the login UI, branding, and email templates to match your product.',
+    cta: 'Design guide',
+    href: 'https://thunderid.dev/docs/next/guides/guides/design/overview/',
+  },
+  {
+    n: '04',
+    title: 'Explore SDK APIs',
+    body: 'Full React SDK reference — hooks, components, and configuration options.',
+    cta: 'SDK reference',
+    href: 'https://thunderid.dev/docs/next/sdks/react/overview/',
+  },
+]
+
+function ClockIcon() {
+  return (
+    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <circle cx="12" cy="12" r="10" /><polyline points="12 6 12 12 16 14" />
+    </svg>
+  )
+}
+
+function TimerIcon() {
+  return (
+    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <path d="M10 2h4" /><path d="M12 14v-4" />
+      <path d="M4 13a8 8 0 0 1 8-7 8 8 0 1 1-5.3 14L4 17.6" />
+      <path d="M9 17H4v5" />
+    </svg>
+  )
+}
+
+function BuildingIcon() {
+  return (
+    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <rect x="3" y="3" width="18" height="18" rx="2" />
+      <path d="M3 9h18" /><path d="M9 21V9" />
+    </svg>
+  )
+}
+
+function ArrowIcon() {
+  return (
+    <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <path d="M7 17L17 7" /><path d="M7 7h10v10" />
+    </svg>
+  )
+}
+
+function HomeContent() {
+  const { getDecodedIdToken, organization } = useThunderID()
+  const [token, setToken] = useState(null)
+  const [now, setNow] = useState(Math.floor(Date.now() / 1000))
+
+  useEffect(() => {
+    getDecodedIdToken().then(setToken).catch(() => {})
+  }, [getDecodedIdToken])
+
+  useEffect(() => {
+    const id = setInterval(() => setNow(Math.floor(Date.now() / 1000)), 1000)
+    return () => clearInterval(id)
+  }, [])
+
+  const authTime = token?.auth_time
+  const exp = token?.exp
+  const secsLeft = exp ? Math.max(0, exp - now) : null
+  const countdown = secsLeft !== null ? formatCountdown(secsLeft) : null
+  const orgName = organization?.displayName || organization?.name
+
+  return (
+    <User>
+      {(user) => {
+        const givenName = user?.givenName || user?.given_name || user?.displayName || user?.username || 'there'
+        const email = user?.email
+        const ouName = orgName || user?.ouName || user?.org || 'Default'
+
+        return (
+          <main className="home-main">
+            <div className="home-greeting">
+              <UserAvatar user={user} size={52} />
+              <div className="home-greeting-text">
+                <h1 className="home-greeting-name">{greeting(givenName)}</h1>
+                <div className="home-greeting-meta">
+                  {email && <span>{email}</span>}
+                  {email && <span className="home-dot" />}
+                  <span className="home-session-active">
+                    <span className="home-session-dot" />
+                    Session active
+                  </span>
+                </div>
+              </div>
+            </div>
+
+            <div className="home-stats">
+              <div className="home-stat">
+                <div className="home-stat-icon"><ClockIcon /></div>
+                <div>
+                  <div className="home-stat-value">{formatTime(authTime)}</div>
+                  <div className="home-stat-label">Signed in at</div>
+                </div>
+              </div>
+              <div className="home-stat home-stat--bordered">
+                <div className="home-stat-icon"><TimerIcon /></div>
+                <div>
+                  <div
+                    className="home-stat-value home-stat-value--mono"
+                    style={countdown ? { color: countdown.color } : undefined}
+                  >
+                    {countdown ? countdown.text : '—'}
+                  </div>
+                  <div className="home-stat-label">Session expires in</div>
+                </div>
+              </div>
+              <div className="home-stat home-stat--bordered">
+                <div className="home-stat-icon"><BuildingIcon /></div>
+                <div>
+                  <div className="home-stat-value">{ouName}</div>
+                  <div className="home-stat-label">Organisation</div>
+                </div>
+              </div>
+            </div>
+
+            <div className="home-next-label">What's next</div>
+            <div className="home-next-list">
+              {NEXT_STEPS.map((step) => (
+                <a
+                  key={step.n}
+                  href={step.href}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="home-next-item"
+                >
+                  <span className="home-next-n">{step.n}</span>
+                  <div className="home-next-body">
+                    <div className="home-next-title">{step.title}</div>
+                    <div className="home-next-desc">{step.body}</div>
+                  </div>
+                  <span className="home-next-cta">
+                    {step.cta}
+                    <ArrowIcon />
+                  </span>
+                </a>
+              ))}
+            </div>
+          </main>
+        )
+      }}
+    </User>
+  )
+}
+
+export default function HomePage() {
+  const { dark } = useOutletContext()
+
+  return (
+    <>
+      <SignedOut>
+        <div className="hero">
+          <div className="hero-inner">
+            <div className="hero-mark">
+              <ThunderMark height={44} dark={dark} />
+            </div>
+
+            <div className="hero-badge">
+              <span className="hero-badge-line" />
+              <span>v1.0 · Open source</span>
+              <span className="hero-badge-line" />
+            </div>
+
+            <h1 className="hero-title">Auth for the Modern Dev</h1>
+
+            <p className="hero-subtitle">
+              ThunderID gives you OAuth 2.0, PKCE, MFA, and JWT out of the box.
+              Clone the Quickstart and ship auth before lunch.
+            </p>
+
+            <HeroCtas />
+
+            <hr className="hero-divider" />
+
+            <div className="hero-stats">
+              <div className="stat">
+                <span className="stat-value">OAuth 2.0</span>
+                <span className="stat-label">Authorization standard</span>
+              </div>
+              <div className="stat">
+                <span className="stat-value">&lt; 5 min</span>
+                <span className="stat-label">Integration time</span>
+              </div>
+              <div className="stat">
+                <span className="stat-value">MIT</span>
+                <span className="stat-label">License</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </SignedOut>
+
+      <SignedIn>
+        <div className="home-shell">
+          <HomeContent />
+        </div>
+      </SignedIn>
+    </>
+  )
+}
diff --git a/samples/react/quickstart/src/pages/ProfilePage.jsx b/samples/react/quickstart/src/pages/ProfilePage.jsx
new file mode 100644
index 0000000..b13051e
--- /dev/null
+++ b/samples/react/quickstart/src/pages/ProfilePage.jsx
@@ -0,0 +1,9 @@
+import { UserProfile } from '@thunderid/react'
+
+export default function ProfilePage() {
+  return (
+    <main className="profile-main">
+      <UserProfile />
+    </main>
+  )
+}
diff --git a/samples/react/quickstart/src/pages/TokenDebugPage.jsx b/samples/react/quickstart/src/pages/TokenDebugPage.jsx
new file mode 100644
index 0000000..fad3dda
--- /dev/null
+++ b/samples/react/quickstart/src/pages/TokenDebugPage.jsx
@@ -0,0 +1,139 @@
+import { useState, useEffect } from 'react'
+import { useThunderID } from '@thunderid/react'
+
+function decodeJwtPart(part) {
+  try {
+    const base64 = part.replace(/-/g, '+').replace(/_/g, '/')
+    const padded = base64.padEnd(base64.length + (4 - (base64.length % 4)) % 4, '=')
+    return JSON.parse(atob(padded))
+  } catch {
+    return null
+  }
+}
+
+function CopyIcon() {
+  return (
+    <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.75" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
+      <rect x="9" y="9" width="13" height="13" rx="2" />
+      <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" />
+    </svg>
+  )
+}
+
+export default function TokenDebugPage() {
+  const { getAccessToken } = useThunderID()
+  const [rawToken, setRawToken] = useState(null)
+  const [copied, setCopied] = useState(false)
+  const [now, setNow] = useState(Math.floor(Date.now() / 1000))
+
+  useEffect(() => {
+    getAccessToken().then(setRawToken).catch(() => {})
+  }, [getAccessToken])
+
+  useEffect(() => {
+    const id = setInterval(() => setNow(Math.floor(Date.now() / 1000)), 1000)
+    return () => clearInterval(id)
+  }, [])
+
+  const parts = rawToken ? rawToken.split('.') : []
+  const jwtHeader = parts[0] ? decodeJwtPart(parts[0]) : null
+  const jwtPayload = parts[1] ? decodeJwtPart(parts[1]) : null
+
+  const exp = jwtPayload?.exp
+  const expiresIn = exp ? exp - now : null
+  const expired = expiresIn !== null && expiresIn <= 0
+  const minsLeft = expiresIn !== null ? Math.abs(Math.floor(expiresIn / 60)) : null
+
+  const handleCopy = () => {
+    if (rawToken && navigator.clipboard) {
+      navigator.clipboard.writeText(rawToken)
+      setCopied(true)
+      setTimeout(() => setCopied(false), 1500)
+    }
+  }
+
+  const issuer = jwtPayload?.iss
+  const audience = Array.isArray(jwtPayload?.aud) ? jwtPayload.aud.join(', ') : jwtPayload?.aud
+  const scopes = jwtPayload?.scope
+
+  return (
+    <main className="token-main">
+      <div className="token-header">
+        <div>
+          <h1 className="token-title">Token debug</h1>
+          <p className="token-subtitle">Inspect your access token and decoded claims.</p>
+        </div>
+        {expiresIn !== null && (
+          <div className={`token-badge ${expired ? 'token-badge--expired' : 'token-badge--valid'}`}>
+            <span className="token-badge-dot" />
+            <span>{expired ? 'Expired' : `Valid · expires in ${minsLeft} min`}</span>
+          </div>
+        )}
+      </div>
+
+      {rawToken ? (
+        <div className="token-raw-section">
+          <div className="token-raw-label-row">
+            <span className="token-section-label">Access token</span>
+            <button className="token-copy-btn" onClick={handleCopy}>
+              <CopyIcon />
+              {copied ? 'Copied!' : 'Copy'}
+            </button>
+          </div>
+          <code className="token-raw">
+            <span className="token-part--header">{parts[0]}</span>
+            <span className="token-dot">.</span>
+            <span className="token-part--payload">{parts[1]}</span>
+            <span className="token-dot">.</span>
+            <span className="token-part--signature">{parts[2]}</span>
+          </code>
+        </div>
+      ) : (
+        <div className="token-raw-section">
+          <div className="token-raw-label-row">
+            <span className="token-section-label">Access token</span>
+          </div>
+          <code className="token-raw token-raw--loading">Loading…</code>
+        </div>
+      )}
+
+      <div className="token-decoded-grid">
+        <div className="token-code-box">
+          <div className="token-code-box-header token-code-box-header--header">JWT Header</div>
+          <pre className="token-code-pre">
+            {jwtHeader ? JSON.stringify(jwtHeader, null, 2) : '…'}
+          </pre>
+        </div>
+        <div className="token-code-box">
+          <div className="token-code-box-header token-code-box-header--payload">JWT Payload</div>
+          <pre className="token-code-pre">
+            {jwtPayload ? JSON.stringify(jwtPayload, null, 2) : '…'}
+          </pre>
+        </div>
+      </div>
+
+      {(issuer || audience || scopes) && (
+        <div className="token-meta-row">
+          {issuer && (
+            <div className="token-meta-item">
+              <div className="token-meta-label">Issuer</div>
+              <div className="token-meta-value">{issuer}</div>
+            </div>
+          )}
+          {audience && (
+            <div className="token-meta-item">
+              <div className="token-meta-label">Audience</div>
+              <div className="token-meta-value">{audience}</div>
+            </div>
+          )}
+          {scopes && (
+            <div className="token-meta-item">
+              <div className="token-meta-label">Scopes</div>
+              <div className="token-meta-value">{scopes}</div>
+            </div>
+          )}
+        </div>
+      )}
+    </main>
+  )
+}
diff --git a/samples/react/quickstart/vite.config.js b/samples/react/quickstart/vite.config.js
new file mode 100644
index 0000000..9ffcc67
--- /dev/null
+++ b/samples/react/quickstart/vite.config.js
@@ -0,0 +1,6 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+export default defineConfig({
+  plugins: [react()],
+})
diff --git a/samples/vue/quickstart/.env.example b/samples/vue/quickstart/.env.example
new file mode 100644
index 0000000..bd72417
--- /dev/null
+++ b/samples/vue/quickstart/.env.example
@@ -0,0 +1,2 @@
+VITE_THUNDERID_CLIENT_ID=your-client-id-here
+VITE_THUNDERID_BASE_URL=https://localhost:8090
diff --git a/samples/vue/quickstart/README.md b/samples/vue/quickstart/README.md
new file mode 100644
index 0000000..f3ff019
--- /dev/null
+++ b/samples/vue/quickstart/README.md
@@ -0,0 +1,34 @@
+# ThunderID Vue Quickstart
+
+A minimal Vue 3 + Vite application demonstrating ThunderID authentication with OAuth 2.0, PKCE, and JWT support using the `@thunderid/vue` SDK.
+
+## Prerequisites
+
+- Node.js 18+
+- pnpm
+- A ThunderID application — register at [thunderid.dev](https://thunderid.dev)
+
+## Setup
+
+1. Copy the environment template:
+   ```sh
+   cp .env.example .env
+   ```
+
+2. Fill in your ThunderID credentials in `.env`:
+   ```
+   VITE_THUNDERID_CLIENT_ID=your-client-id
+   VITE_THUNDERID_BASE_URL=https://your-thunderid-instance
+   ```
+
+3. Install dependencies and start the dev server:
+   ```sh
+   pnpm install
+   pnpm dev
+   ```
+
+The app will be available at `http://localhost:5173`.
+
+## Docs
+
+Full SDK reference: [thunderid.dev/docs](https://thunderid.dev/docs)
diff --git a/samples/vue/quickstart/index.html b/samples/vue/quickstart/index.html
new file mode 100644
index 0000000..01e5e85
--- /dev/null
+++ b/samples/vue/quickstart/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>ThunderID Vue Quickstart</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.js"></script>
+  </body>
+</html>
diff --git a/samples/vue/quickstart/package.json b/samples/vue/quickstart/package.json
new file mode 100644
index 0000000..6a22fe7
--- /dev/null
+++ b/samples/vue/quickstart/package.json
@@ -0,0 +1,19 @@
+{
+  "name": "@thunderid/vue-quickstart",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@thunderid/vue": "workspace:*",
+    "vue": "^3.5.13"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^5.2.3",
+    "vite": "^6.3.5"
+  }
+}
diff --git a/samples/vue/quickstart/src/App.vue b/samples/vue/quickstart/src/App.vue
new file mode 100644
index 0000000..3d84107
--- /dev/null
+++ b/samples/vue/quickstart/src/App.vue
@@ -0,0 +1,35 @@
+<script setup>
+import { ref } from 'vue'
+import { ThunderIDProvider, Loading } from '@thunderid/vue'
+import Nav from './components/Nav.vue'
+import HomePage from './pages/HomePage.vue'
+import ProfilePage from './pages/ProfilePage.vue'
+import TokenDebugPage from './pages/TokenDebugPage.vue'
+
+const clientId = import.meta.env.VITE_THUNDERID_CLIENT_ID
+const baseUrl = import.meta.env.VITE_THUNDERID_BASE_URL
+
+const page = ref('home')
+const dark = ref(false)
+</script>
+
+<template>
+  <ThunderIDProvider :client-id="clientId" :base-url="baseUrl">
+    <div :class="['app', { dark }]">
+      <Nav
+        :page="page"
+        :dark="dark"
+        @update:page="page = $event"
+        @update:dark="dark = $event"
+      />
+
+      <Loading>
+        <div class="loading-screen">Loading…</div>
+      </Loading>
+
+      <HomePage v-if="page === 'home'" :dark="dark" />
+      <ProfilePage v-else-if="page === 'profile'" />
+      <TokenDebugPage v-else-if="page === 'token'" />
+    </div>
+  </ThunderIDProvider>
+</template>
diff --git a/samples/vue/quickstart/src/components/Nav.vue b/samples/vue/quickstart/src/components/Nav.vue
new file mode 100644
index 0000000..aeef41e
--- /dev/null
+++ b/samples/vue/quickstart/src/components/Nav.vue
@@ -0,0 +1,90 @@
+<script setup>
+import { computed } from 'vue'
+import { SignedIn, SignedOut, SignInButton, SignUpButton, UserDropdown } from '@thunderid/vue'
+
+const props = defineProps({
+  page: { type: String, default: 'home' },
+  dark: { type: Boolean, default: false },
+})
+
+const emit = defineEmits(['update:page', 'update:dark'])
+
+const markTopFill = computed(() => props.dark ? '#E8F4FF' : '#05213F')
+const isHome = computed(() => props.page === 'home')
+
+const menuItems = computed(() => [
+  { label: 'Profile', onClick: () => emit('update:page', 'profile') },
+  { label: 'Token debug', onClick: () => emit('update:page', 'token') },
+])
+
+function toggleDark() {
+  emit('update:dark', !props.dark)
+}
+</script>
+
+<template>
+  <nav class="nav">
+    <a class="nav-logo" href="/" @click.prevent="emit('update:page', 'home')">
+      <svg :width="Math.round(24 * (207 / 257))" height="24" viewBox="0 0 207 257" fill="none" aria-hidden="true">
+        <path d="M55.4763 26.4391L58.8866 0H0V26.4391H55.4763Z" :fill="markTopFill" />
+        <path d="M39.8438 147.407L49.5455 72.2839H4.9909e-05V256.743H60.5602L80.048 147.407H39.8438Z" fill="#3688FF" />
+        <path d="M192.42 59.361C182.782 40.2307 168.929 25.5705 150.903 15.3381C145.501 12.2662 139.761 9.6605 133.703 7.5208L115.401 103.702H159.757L76.2987 256.743H83.3735C109.449 256.743 131.69 251.574 150.14 241.236C168.569 230.897 182.634 216.131 192.356 196.959C202.058 177.765 206.909 154.8 206.909 128.043C206.909 101.286 202.079 78.5123 192.441 59.3821L192.42 59.361Z" fill="#3688FF" />
+      </svg>
+      <div class="wordmark">
+        <span class="wordmark-name">ThunderID</span>
+        <span class="wordmark-sub">Quickstart</span>
+      </div>
+    </a>
+
+    <div class="nav-actions">
+      <button
+        v-if="!isHome"
+        class="nav-back-btn"
+        @click="emit('update:page', 'home')"
+      >
+        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+          <polyline points="15 18 9 12 15 6" />
+        </svg>
+        Home
+      </button>
+
+      <button
+        class="dark-toggle"
+        @click="toggleDark"
+        :aria-label="dark ? 'Switch to light mode' : 'Switch to dark mode'"
+      >
+        <svg v-if="dark" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+          <circle cx="12" cy="12" r="5"/>
+          <line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/>
+          <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/>
+          <line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/>
+          <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/>
+        </svg>
+        <svg v-else width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+          <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/>
+        </svg>
+      </button>
+
+      <SignedIn>
+        <UserDropdown :show-trigger-label="true" :menu-items="menuItems" />
+      </SignedIn>
+
+      <SignedOut>
+        <SignInButton>
+          <template #default="{ signIn, isLoading }">
+            <button class="btn-ghost" @click="signIn" :disabled="isLoading">
+              {{ isLoading ? 'Signing in…' : 'Sign in' }}
+            </button>
+          </template>
+        </SignInButton>
+        <SignUpButton>
+          <template #default="{ signUp, isLoading }">
+            <button class="btn-primary" @click="signUp" :disabled="isLoading">
+              {{ isLoading ? 'Signing up…' : 'Sign up' }}
+            </button>
+          </template>
+        </SignUpButton>
+      </SignedOut>
+    </div>
+  </nav>
+</template>
diff --git a/samples/vue/quickstart/src/main.js b/samples/vue/quickstart/src/main.js
new file mode 100644
index 0000000..f49fe52
--- /dev/null
+++ b/samples/vue/quickstart/src/main.js
@@ -0,0 +1,8 @@
+import { createApp } from 'vue'
+import { ThunderIDPlugin } from '@thunderid/vue'
+import App from './App.vue'
+import './style.css'
+
+const app = createApp(App)
+app.use(ThunderIDPlugin)
+app.mount('#app')
diff --git a/samples/vue/quickstart/src/pages/HomePage.vue b/samples/vue/quickstart/src/pages/HomePage.vue
new file mode 100644
index 0000000..5bd1498
--- /dev/null
+++ b/samples/vue/quickstart/src/pages/HomePage.vue
@@ -0,0 +1,256 @@
+<script setup>
+import { ref, computed, onMounted, onUnmounted } from 'vue'
+import { SignedIn, SignedOut, SignInButton, SignUpButton, User, useThunderID } from '@thunderid/vue'
+
+const props = defineProps({
+  dark: { type: Boolean, default: false },
+})
+
+const { getDecodedIdToken, organizationHandle } = useThunderID()
+
+const markTopFill = computed(() => props.dark ? '#E8F4FF' : '#05213F')
+
+function greeting(name) {
+  const h = new Date().getHours()
+  const tod = h < 12 ? 'morning' : h < 17 ? 'afternoon' : 'evening'
+  return `Good ${tod}, ${name}.`
+}
+
+function formatTime(unixSeconds) {
+  if (!unixSeconds) return '—'
+  return new Date(unixSeconds * 1000).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })
+}
+
+function formatCountdown(secsLeft) {
+  if (secsLeft <= 0) return { text: 'Expired', color: '#d95757' }
+  if (secsLeft < 300) {
+    const m = Math.floor(secsLeft / 60), s = secsLeft % 60
+    return { text: `${m}m ${s}s`, color: '#e88b3a' }
+  }
+  if (secsLeft < 3600) {
+    const m = Math.floor(secsLeft / 60), s = secsLeft % 60
+    return { text: `${m}m ${s}s`, color: '#2fbd6b' }
+  }
+  const hr = Math.floor(secsLeft / 3600), m = Math.floor((secsLeft % 3600) / 60)
+  return { text: `${hr}h ${m}m`, color: '#2fbd6b' }
+}
+
+const NEXT_STEPS = [
+  {
+    n: '01',
+    title: 'Explore use cases',
+    body: 'See what you can build — auth flows for web, mobile, APIs, and agents.',
+    cta: 'Browse use cases',
+    href: 'https://thunderid.dev/docs/next/use-cases/overview/',
+  },
+  {
+    n: '02',
+    title: 'Learn about flows',
+    body: 'Understand how authorization code, PKCE, client credentials, and device flows work.',
+    cta: 'Read guide',
+    href: 'https://thunderid.dev/docs/next/guides/guides/flows/what-are-flows/',
+  },
+  {
+    n: '03',
+    title: 'Style your experience',
+    body: 'Customize the login UI, branding, and email templates to match your product.',
+    cta: 'Design guide',
+    href: 'https://thunderid.dev/docs/next/guides/guides/design/overview/',
+  },
+  {
+    n: '04',
+    title: 'Explore SDK APIs',
+    body: 'Full Vue SDK reference — composables, components, and configuration options.',
+    cta: 'SDK reference',
+    href: 'https://thunderid.dev/docs/next/sdks/vue/overview/',
+  },
+]
+
+const idToken = ref(null)
+const now = ref(Math.floor(Date.now() / 1000))
+let timerInterval = null
+
+const authTime = computed(() => idToken.value?.auth_time)
+const tokenExp = computed(() => idToken.value?.exp)
+const secsLeft = computed(() => tokenExp.value ? Math.max(0, tokenExp.value - now.value) : null)
+const countdown = computed(() => secsLeft.value !== null ? formatCountdown(secsLeft.value) : null)
+
+onMounted(() => {
+  getDecodedIdToken().then(t => { idToken.value = t }).catch(() => {})
+  timerInterval = setInterval(() => { now.value = Math.floor(Date.now() / 1000) }, 1000)
+})
+
+onUnmounted(() => {
+  if (timerInterval) clearInterval(timerInterval)
+})
+</script>
+
+<template>
+  <SignedOut>
+    <div class="hero">
+      <div class="hero-inner">
+        <div class="hero-mark">
+          <svg width="35" height="44" viewBox="0 0 207 257" fill="none" aria-hidden="true">
+            <path d="M55.4763 26.4391L58.8866 0H0V26.4391H55.4763Z" :fill="markTopFill" />
+            <path d="M39.8438 147.407L49.5455 72.2839H4.9909e-05V256.743H60.5602L80.048 147.407H39.8438Z" fill="#3688FF" />
+            <path d="M192.42 59.361C182.782 40.2307 168.929 25.5705 150.903 15.3381C145.501 12.2662 139.761 9.6605 133.703 7.5208L115.401 103.702H159.757L76.2987 256.743H83.3735C109.449 256.743 131.69 251.574 150.14 241.236C168.569 230.897 182.634 216.131 192.356 196.959C202.058 177.765 206.909 154.8 206.909 128.043C206.909 101.286 202.079 78.5123 192.441 59.3821L192.42 59.361Z" fill="#3688FF" />
+          </svg>
+        </div>
+
+        <div class="hero-badge">
+          <span class="hero-badge-line"></span>
+          <span>v1.0 · Open source</span>
+          <span class="hero-badge-line"></span>
+        </div>
+
+        <h1 class="hero-title">Auth for the Modern Dev</h1>
+
+        <p class="hero-subtitle">
+          ThunderID gives you OAuth 2.0, PKCE, MFA, and JWT out of the box.
+          Clone the Quickstart and ship auth before lunch.
+        </p>
+
+        <div class="hero-ctas">
+          <SignUpButton>
+            <template #default="{ signUp, isLoading }">
+              <button class="btn-primary" @click="signUp" :disabled="isLoading">
+                {{ isLoading ? 'Signing up…' : 'Get started' }}
+              </button>
+            </template>
+          </SignUpButton>
+          <SignInButton>
+            <template #default="{ signIn, isLoading }">
+              <button class="btn-outline" @click="signIn" :disabled="isLoading">
+                {{ isLoading ? 'Signing in…' : 'Sign in' }}
+              </button>
+            </template>
+          </SignInButton>
+        </div>
+
+        <hr class="hero-divider" />
+
+        <div class="hero-stats">
+          <div class="stat">
+            <span class="stat-value">OAuth 2.0</span>
+            <span class="stat-label">Authorization standard</span>
+          </div>
+          <div class="stat">
+            <span class="stat-value">&lt; 5 min</span>
+            <span class="stat-label">Integration time</span>
+          </div>
+          <div class="stat">
+            <span class="stat-value">MIT</span>
+            <span class="stat-label">License</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </SignedOut>
+
+  <SignedIn>
+    <div class="home-shell">
+      <User>
+        <template #default="{ user }">
+          <main class="home-main">
+            <div class="home-greeting">
+              <div class="home-avatar">
+                <img
+                  v-if="user?.picture"
+                  :src="user.picture"
+                  :alt="user?.displayName || user?.username || ''"
+                  class="home-avatar-img"
+                />
+                <span v-else class="home-avatar-initials">
+                  {{ (user?.givenName || user?.given_name || user?.displayName || user?.username || '?')[0].toUpperCase() }}
+                </span>
+              </div>
+              <div class="home-greeting-text">
+                <h1 class="home-greeting-name">
+                  {{ greeting(user?.givenName || user?.given_name || user?.displayName || user?.username || 'there') }}
+                </h1>
+                <div class="home-greeting-meta">
+                  <span v-if="user?.email">{{ user.email }}</span>
+                  <span v-if="user?.email" class="home-dot"></span>
+                  <span class="home-session-active">
+                    <span class="home-session-dot"></span>
+                    Session active
+                  </span>
+                </div>
+              </div>
+            </div>
+
+            <div class="home-stats">
+              <div class="home-stat">
+                <div class="home-stat-icon">
+                  <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                    <circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/>
+                  </svg>
+                </div>
+                <div>
+                  <div class="home-stat-value">{{ formatTime(authTime) }}</div>
+                  <div class="home-stat-label">Signed in at</div>
+                </div>
+              </div>
+              <div class="home-stat home-stat--bordered">
+                <div class="home-stat-icon">
+                  <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                    <path d="M10 2h4"/><path d="M12 14v-4"/>
+                    <path d="M4 13a8 8 0 0 1 8-7 8 8 0 1 1-5.3 14L4 17.6"/>
+                    <path d="M9 17H4v5"/>
+                  </svg>
+                </div>
+                <div>
+                  <div
+                    class="home-stat-value home-stat-value--mono"
+                    :style="countdown ? { color: countdown.color } : {}"
+                  >
+                    {{ countdown ? countdown.text : '—' }}
+                  </div>
+                  <div class="home-stat-label">Session expires in</div>
+                </div>
+              </div>
+              <div class="home-stat home-stat--bordered">
+                <div class="home-stat-icon">
+                  <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                    <rect x="3" y="3" width="18" height="18" rx="2"/>
+                    <path d="M3 9h18"/><path d="M9 21V9"/>
+                  </svg>
+                </div>
+                <div>
+                  <div class="home-stat-value">
+                    {{ organizationHandle || user?.ouName || user?.org || 'Default' }}
+                  </div>
+                  <div class="home-stat-label">Organisation</div>
+                </div>
+              </div>
+            </div>
+
+            <div class="home-next-label">What's next</div>
+            <div class="home-next-list">
+              <a
+                v-for="step in NEXT_STEPS"
+                :key="step.n"
+                :href="step.href"
+                target="_blank"
+                rel="noopener noreferrer"
+                class="home-next-item"
+              >
+                <span class="home-next-n">{{ step.n }}</span>
+                <div class="home-next-body">
+                  <div class="home-next-title">{{ step.title }}</div>
+                  <div class="home-next-desc">{{ step.body }}</div>
+                </div>
+                <span class="home-next-cta">
+                  {{ step.cta }}
+                  <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                    <path d="M7 17L17 7"/><path d="M7 7h10v10"/>
+                  </svg>
+                </span>
+              </a>
+            </div>
+          </main>
+        </template>
+      </User>
+    </div>
+  </SignedIn>
+</template>
diff --git a/samples/vue/quickstart/src/pages/ProfilePage.vue b/samples/vue/quickstart/src/pages/ProfilePage.vue
new file mode 100644
index 0000000..d188e9d
--- /dev/null
+++ b/samples/vue/quickstart/src/pages/ProfilePage.vue
@@ -0,0 +1,9 @@
+<script setup>
+import { UserProfile } from '@thunderid/vue'
+</script>
+
+<template>
+  <main class="profile-main">
+    <UserProfile />
+  </main>
+</template>
diff --git a/samples/vue/quickstart/src/pages/TokenDebugPage.vue b/samples/vue/quickstart/src/pages/TokenDebugPage.vue
new file mode 100644
index 0000000..403ddb8
--- /dev/null
+++ b/samples/vue/quickstart/src/pages/TokenDebugPage.vue
@@ -0,0 +1,118 @@
+<script setup>
+import { ref, computed, onMounted, onUnmounted } from 'vue'
+import { useThunderID } from '@thunderid/vue'
+
+const { getAccessToken } = useThunderID()
+
+function decodeJwtPart(part) {
+  try {
+    const base64 = part.replace(/-/g, '+').replace(/_/g, '/')
+    const padded = base64.padEnd(base64.length + (4 - (base64.length % 4)) % 4, '=')
+    return JSON.parse(atob(padded))
+  } catch {
+    return null
+  }
+}
+
+const rawToken = ref(null)
+const copied = ref(false)
+const now = ref(Math.floor(Date.now() / 1000))
+let timerInterval = null
+
+const tokenParts = computed(() => rawToken.value ? rawToken.value.split('.') : [])
+const jwtHeader = computed(() => tokenParts.value[0] ? decodeJwtPart(tokenParts.value[0]) : null)
+const jwtPayload = computed(() => tokenParts.value[1] ? decodeJwtPart(tokenParts.value[1]) : null)
+
+const tokenExpiresIn = computed(() => jwtPayload.value?.exp ? jwtPayload.value.exp - now.value : null)
+const tokenExpired = computed(() => tokenExpiresIn.value !== null && tokenExpiresIn.value <= 0)
+const tokenMinsLeft = computed(() => tokenExpiresIn.value !== null ? Math.abs(Math.floor(tokenExpiresIn.value / 60)) : null)
+
+const tokenIssuer = computed(() => jwtPayload.value?.iss)
+const tokenAudience = computed(() => {
+  const aud = jwtPayload.value?.aud
+  return Array.isArray(aud) ? aud.join(', ') : aud
+})
+const tokenScopes = computed(() => jwtPayload.value?.scope)
+
+onMounted(() => {
+  getAccessToken().then(t => { rawToken.value = t }).catch(() => {})
+  timerInterval = setInterval(() => { now.value = Math.floor(Date.now() / 1000) }, 1000)
+})
+
+onUnmounted(() => {
+  if (timerInterval) clearInterval(timerInterval)
+})
+
+function handleCopy() {
+  if (rawToken.value && navigator.clipboard) {
+    navigator.clipboard.writeText(rawToken.value)
+    copied.value = true
+    setTimeout(() => { copied.value = false }, 1500)
+  }
+}
+</script>
+
+<template>
+  <main class="token-main">
+    <div class="token-header">
+      <div>
+        <h1 class="token-title">Token debug</h1>
+        <p class="token-subtitle">Inspect your access token and decoded claims.</p>
+      </div>
+      <div
+        v-if="tokenExpiresIn !== null"
+        :class="['token-badge', tokenExpired ? 'token-badge--expired' : 'token-badge--valid']"
+      >
+        <span class="token-badge-dot"></span>
+        <span>{{ tokenExpired ? 'Expired' : `Valid · expires in ${tokenMinsLeft} min` }}</span>
+      </div>
+    </div>
+
+    <div class="token-raw-section">
+      <div class="token-raw-label-row">
+        <span class="token-section-label">Access token</span>
+        <button v-if="rawToken" class="token-copy-btn" @click="handleCopy">
+          <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+            <rect x="9" y="9" width="13" height="13" rx="2"/>
+            <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>
+          </svg>
+          {{ copied ? 'Copied!' : 'Copy' }}
+        </button>
+      </div>
+      <code v-if="rawToken" class="token-raw">
+        <span class="token-part--header">{{ tokenParts[0] }}</span>
+        <span class="token-dot">.</span>
+        <span class="token-part--payload">{{ tokenParts[1] }}</span>
+        <span class="token-dot">.</span>
+        <span class="token-part--signature">{{ tokenParts[2] }}</span>
+      </code>
+      <code v-else class="token-raw token-raw--loading">Loading…</code>
+    </div>
+
+    <div class="token-decoded-grid">
+      <div class="token-code-box">
+        <div class="token-code-box-header token-code-box-header--header">JWT Header</div>
+        <pre class="token-code-pre">{{ jwtHeader ? JSON.stringify(jwtHeader, null, 2) : '…' }}</pre>
+      </div>
+      <div class="token-code-box">
+        <div class="token-code-box-header token-code-box-header--payload">JWT Payload</div>
+        <pre class="token-code-pre">{{ jwtPayload ? JSON.stringify(jwtPayload, null, 2) : '…' }}</pre>
+      </div>
+    </div>
+
+    <div v-if="tokenIssuer || tokenAudience || tokenScopes" class="token-meta-row">
+      <div v-if="tokenIssuer" class="token-meta-item">
+        <div class="token-meta-label">Issuer</div>
+        <div class="token-meta-value">{{ tokenIssuer }}</div>
+      </div>
+      <div v-if="tokenAudience" class="token-meta-item">
+        <div class="token-meta-label">Audience</div>
+        <div class="token-meta-value">{{ tokenAudience }}</div>
+      </div>
+      <div v-if="tokenScopes" class="token-meta-item">
+        <div class="token-meta-label">Scopes</div>
+        <div class="token-meta-value">{{ tokenScopes }}</div>
+      </div>
+    </div>
+  </main>
+</template>
diff --git a/samples/vue/quickstart/src/style.css b/samples/vue/quickstart/src/style.css
new file mode 100644
index 0000000..7cdde5b
--- /dev/null
+++ b/samples/vue/quickstart/src/style.css
@@ -0,0 +1,742 @@
+/* ─── Reset ─────────────────────────────────────────────────────── */
+*, *::before, *::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+body {
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+}
+
+/* ─── Design tokens ─────────────────────────────────────────────── */
+:root {
+  --color-primary:    #3688FF;
+  --color-navy:       #05213F;
+  --color-bg:         #F7F9FC;
+  --color-card:       #ffffff;
+  --color-border:     #DDE3EC;
+  --color-muted:      #5A7085;
+  --color-text:       #05213F;
+  --nav-height:       52px;
+  --radius-card:      12px;
+  --radius-btn:       8px;
+  --transition:       0.2s ease;
+  --nav-bg:           rgba(247, 249, 252, 0.92);
+}
+
+/* ─── App shell ─────────────────────────────────────────────────── */
+.app {
+  min-height: 100vh;
+  background: var(--color-bg);
+  color: var(--color-text);
+  transition: background var(--transition), color var(--transition);
+}
+
+.app.dark {
+  --color-bg:         #080f1c;
+  --color-card:       #0f1a2d;
+  --color-border:     rgba(255, 255, 255, 0.09);
+  --color-text:       #E0EAFF;
+  --color-muted:      rgba(224, 234, 255, 0.48);
+  --color-navy:       #E0EAFF;
+  --nav-bg:           rgba(8, 15, 28, 0.92);
+}
+
+/* ─── Nav ───────────────────────────────────────────────────────── */
+.nav {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: var(--nav-height);
+  display: flex;
+  align-items: center;
+  padding: 0 28px;
+  background: var(--nav-bg);
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
+  border-bottom: 1px solid var(--color-border);
+  z-index: 100;
+  gap: 12px;
+}
+
+.nav-logo {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  cursor: pointer;
+  text-decoration: none;
+  color: inherit;
+  flex: 1;
+}
+
+.wordmark {
+  display: flex;
+  flex-direction: column;
+  gap: 0;
+}
+.wordmark-name {
+  font-size: 14px;
+  font-weight: 700;
+  letter-spacing: -0.03em;
+  line-height: 1.1;
+  color: var(--color-text);
+}
+.wordmark-sub {
+  font-size: 8.5px;
+  font-weight: 700;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: #3688FF;
+  line-height: 1;
+  margin-top: 1.5px;
+}
+
+.nav-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+/* ─── Dark-mode toggle ──────────────────────────────────────────── */
+.dark-toggle {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 34px;
+  height: 34px;
+  border-radius: 8px;
+  border: 1px solid var(--color-border);
+  background: transparent;
+  color: var(--color-muted);
+  cursor: pointer;
+  font-size: 15px;
+  transition: border-color var(--transition), color var(--transition), background var(--transition);
+  flex-shrink: 0;
+}
+
+.dark-toggle:hover {
+  background: var(--color-border);
+  color: var(--color-text);
+}
+
+/* ─── Buttons ───────────────────────────────────────────────────── */
+.btn-primary,
+.btn-outline,
+.btn-ghost {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 46px;
+  padding: 0 24px;
+  border-radius: var(--radius-btn);
+  font-size: 15px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: opacity var(--transition), background var(--transition), border-color var(--transition);
+  white-space: nowrap;
+  text-decoration: none;
+  font-family: inherit;
+}
+
+.btn-primary {
+  background: var(--color-primary);
+  color: #fff;
+  border: 1.5px solid var(--color-primary);
+}
+
+.btn-primary:hover {
+  opacity: 0.88;
+}
+
+.btn-outline {
+  background: transparent;
+  color: var(--color-primary);
+  border: 1.5px solid rgba(54, 136, 255, 0.4);
+}
+
+.btn-outline:hover {
+  background: color-mix(in srgb, var(--color-primary) 8%, transparent);
+}
+
+.btn-ghost {
+  background: transparent;
+  color: var(--color-muted);
+  border: none;
+}
+.btn-ghost:hover {
+  background: rgba(0, 0, 0, 0.04);
+}
+
+/* Nav-sized buttons (slightly shorter) */
+.nav .btn-primary,
+.nav .btn-outline,
+.nav .btn-ghost {
+  height: 36px;
+  padding: 0 16px;
+  font-size: 14px;
+}
+
+/* ─── Loading ───────────────────────────────────────────────────── */
+.loading-screen {
+  min-height: calc(100vh - var(--nav-height));
+  margin-top: var(--nav-height);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--color-muted);
+  font-size: 15px;
+}
+
+/* ─── Hero ──────────────────────────────────────────────────────── */
+.hero {
+  min-height: calc(100vh - var(--nav-height));
+  margin-top: var(--nav-height);
+  padding: 96px 32px 80px;
+}
+
+.hero-inner {
+  width: 100%;
+  max-width: 560px;
+  margin: 0 auto;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+}
+
+.hero-mark { display: flex; justify-content: center; margin-bottom: 32px; }
+.hero-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: var(--color-muted);
+  margin-bottom: 28px;
+}
+.hero-badge-line {
+  display: block;
+  height: 1px;
+  width: 24px;
+  background: var(--color-border);
+  flex-shrink: 0;
+}
+
+.hero-title {
+  font-size: 42px;
+  font-weight: 700;
+  letter-spacing: -0.05em;
+  line-height: 1.1;
+  color: var(--color-text);
+  margin: 0 0 18px;
+}
+
+.hero-subtitle {
+  font-size: 16px;
+  color: var(--color-muted);
+  max-width: 420px;
+  line-height: 1.8;
+  letter-spacing: -0.01em;
+  margin: 0 auto 36px;
+}
+
+.hero-ctas {
+  display: flex;
+  justify-content: center;
+  gap: 10px;
+  margin-bottom: 52px;
+}
+
+.hero-divider {
+  width: 100%;
+  border: none;
+  border-top: 1px solid var(--color-border);
+  margin: 4px 0;
+}
+
+/* ─── Stats row ─────────────────────────────────────────────────── */
+.hero-stats {
+  width: 100%;
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+}
+
+.stat {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+  padding: 16px 8px;
+}
+
+.stat:not(:last-child) {
+  border-right: 1px solid var(--color-border);
+}
+
+.stat-value {
+  font-size: 15px;
+  font-weight: 700;
+  color: var(--color-text);
+}
+
+.stat-label {
+  font-size: 12px;
+  color: var(--color-muted);
+}
+
+/* ─── Signed-in home page ───────────────────────────────────────────── */
+.home-shell {
+  min-height: calc(100vh - var(--nav-height));
+  margin-top: var(--nav-height);
+}
+
+.home-main {
+  width: 100%;
+  max-width: 900px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+/* Greeting */
+.home-greeting {
+  display: flex;
+  align-items: flex-start;
+  gap: 16px;
+  margin-bottom: 36px;
+}
+
+.home-avatar {
+  width: 52px;
+  height: 52px;
+  border-radius: 50%;
+  background: var(--color-primary);
+  color: #fff;
+  font-size: 18px;
+  font-weight: 700;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  overflow: hidden;
+}
+
+.home-avatar-img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.home-avatar-initials {
+  line-height: 1;
+}
+
+.home-greeting-text {
+  min-width: 0;
+}
+
+.home-greeting-name {
+  margin: 0 0 6px;
+  font-size: 26px;
+  font-weight: 700;
+  color: var(--color-text);
+  letter-spacing: -0.04em;
+}
+
+.home-greeting-meta {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 13px;
+  color: var(--color-muted);
+  letter-spacing: -0.01em;
+  flex-wrap: wrap;
+}
+
+.home-dot {
+  display: inline-block;
+  width: 3px;
+  height: 3px;
+  border-radius: 50%;
+  background: var(--color-border);
+  flex-shrink: 0;
+}
+
+.home-session-active {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  color: #2fbd6b;
+}
+
+.home-session-dot {
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: #2fbd6b;
+  flex-shrink: 0;
+}
+
+/* Session stats row */
+.home-stats {
+  display: flex;
+  gap: 0;
+  padding: 20px 0;
+  border-top: 1px solid var(--color-border);
+  border-bottom: 1px solid var(--color-border);
+  margin-bottom: 52px;
+}
+
+.home-stat {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-width: 0;
+}
+
+.home-stat--bordered {
+  padding-left: 32px;
+  border-left: 1px solid var(--color-border);
+}
+
+.home-stat-icon {
+  width: 32px;
+  height: 32px;
+  border-radius: 8px;
+  background: rgba(54, 136, 255, 0.1);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: #3688FF;
+}
+
+.home-stat-value {
+  font-size: 14px;
+  font-weight: 700;
+  color: var(--color-text);
+  letter-spacing: -0.02em;
+}
+
+.home-stat-value--mono {
+  font-family: var(--font-mono, monospace);
+  letter-spacing: 0.01em;
+}
+
+.home-stat-label {
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--color-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.07em;
+  margin-top: 2px;
+}
+
+/* What's next */
+.home-next-label {
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-muted);
+  margin-bottom: 20px;
+}
+
+.home-next-list {
+  display: flex;
+  flex-direction: column;
+}
+
+.home-next-item {
+  display: grid;
+  grid-template-columns: 28px 1fr auto;
+  gap: 16px;
+  align-items: start;
+  padding: 20px 0;
+  border-top: 1px solid var(--color-border);
+  text-decoration: none;
+  color: inherit;
+  cursor: pointer;
+  transition: background var(--transition);
+  border-radius: 4px;
+}
+
+.home-next-item:hover .home-next-cta {
+  opacity: 1;
+}
+
+.home-next-n {
+  font-size: 11px;
+  font-weight: 700;
+  color: #3688FF;
+  letter-spacing: 0.05em;
+  padding-top: 2px;
+  font-variant-numeric: tabular-nums;
+}
+
+.home-next-body {
+  min-width: 0;
+}
+
+.home-next-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--color-text);
+  letter-spacing: -0.02em;
+  margin-bottom: 4px;
+}
+
+.home-next-desc {
+  font-size: 13px;
+  color: var(--color-muted);
+  line-height: 1.6;
+  letter-spacing: -0.01em;
+}
+
+.home-next-cta {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 13px;
+  font-weight: 600;
+  color: #3688FF;
+  white-space: nowrap;
+  opacity: 0.7;
+  transition: opacity var(--transition);
+  padding-top: 2px;
+}
+
+/* ─── Nav back button ───────────────────────────────────────────── */
+.nav-back-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  height: 32px;
+  padding: 0 10px;
+  border-radius: 6px;
+  border: none;
+  background: transparent;
+  color: var(--color-muted);
+  font-size: 13px;
+  font-family: inherit;
+  letter-spacing: -0.01em;
+  cursor: pointer;
+  transition: background var(--transition), color var(--transition);
+}
+
+.nav-back-btn:hover {
+  background: var(--color-border);
+  color: var(--color-text);
+}
+
+/* ─── Profile page ──────────────────────────────────────────────── */
+.profile-main {
+  width: 100%;
+  max-width: 780px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+/* ─── Token debug page ──────────────────────────────────────────── */
+.token-main {
+  width: 100%;
+  max-width: 780px;
+  margin: 0 auto;
+  padding: 52px 28px 80px;
+}
+
+.token-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16px;
+  margin-bottom: 36px;
+  flex-wrap: wrap;
+}
+
+.token-title {
+  margin: 0 0 5px;
+  font-size: 22px;
+  font-weight: 700;
+  letter-spacing: -0.04em;
+  color: var(--color-text);
+}
+
+.token-subtitle {
+  margin: 0;
+  font-size: 13px;
+  color: var(--color-muted);
+  letter-spacing: -0.01em;
+}
+
+.token-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 7px;
+  padding: 6px 12px;
+  border-radius: 6px;
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: -0.01em;
+  flex-shrink: 0;
+}
+
+.token-badge--expired {
+  background: rgba(220, 38, 38, 0.08);
+  border: 1px solid rgba(220, 38, 38, 0.22);
+  color: #dc2626;
+}
+
+.token-badge--valid {
+  background: rgba(47, 189, 107, 0.08);
+  border: 1px solid rgba(47, 189, 107, 0.22);
+  color: #2fbd6b;
+}
+
+.token-badge-dot {
+  display: inline-block;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: currentColor;
+  flex-shrink: 0;
+}
+
+/* Raw token section */
+.token-raw-section {
+  margin-bottom: 20px;
+}
+
+.token-raw-label-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 8px;
+}
+
+.token-section-label {
+  font-size: 11px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-muted);
+}
+
+.token-copy-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  padding: 4px 10px;
+  border-radius: 5px;
+  background: transparent;
+  border: 1px solid var(--color-border);
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--color-muted);
+  cursor: pointer;
+  font-family: inherit;
+  letter-spacing: -0.01em;
+  transition: border-color var(--transition), color var(--transition);
+}
+
+.token-copy-btn:hover {
+  border-color: #3688FF;
+  color: #3688FF;
+}
+
+.token-raw {
+  display: block;
+  font-size: 11px;
+  font-family: var(--font-mono, monospace);
+  word-break: break-all;
+  line-height: 1.8;
+  background: #0b1120;
+  padding: 14px 16px;
+  border-radius: 8px;
+  overflow-x: auto;
+}
+
+.token-raw--loading {
+  color: rgba(255, 255, 255, 0.3);
+}
+
+.token-part--header   { color: #ff7b72; }
+.token-part--payload  { color: #79c0ff; }
+.token-part--signature { color: #3fb950; }
+
+.token-dot {
+  color: rgba(255, 255, 255, 0.2);
+}
+
+/* Decoded grid */
+.token-decoded-grid {
+  display: grid;
+  grid-template-columns: 1fr 1.7fr;
+  gap: 12px;
+  margin-bottom: 20px;
+}
+
+.token-code-box {
+  background: #0b1120;
+  border-radius: 10px;
+  overflow: hidden;
+}
+
+.token-code-box-header {
+  padding: 9px 14px;
+  font-size: 10px;
+  font-weight: 700;
+  letter-spacing: 0.09em;
+  text-transform: uppercase;
+}
+
+.token-code-box-header--header {
+  color: #ff7b72;
+  border-bottom: 1px solid rgba(255, 123, 114, 0.15);
+}
+
+.token-code-box-header--payload {
+  color: #79c0ff;
+  border-bottom: 1px solid rgba(121, 192, 255, 0.15);
+}
+
+.token-code-pre {
+  margin: 0;
+  padding: 14px;
+  font-size: 11.5px;
+  line-height: 1.8;
+  font-family: var(--font-mono, monospace);
+  color: #c9d1d9;
+  overflow-x: auto;
+  max-height: 220px;
+}
+
+/* Meta row */
+.token-meta-row {
+  display: flex;
+  gap: 32px;
+  padding-top: 20px;
+  border-top: 1px solid var(--color-border);
+  flex-wrap: wrap;
+}
+
+.token-meta-label {
+  font-size: 10px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.09em;
+  color: var(--color-muted);
+  margin-bottom: 5px;
+}
+
+.token-meta-value {
+  font-size: 12px;
+  font-family: var(--font-mono, monospace);
+  color: var(--color-text);
+  letter-spacing: -0.01em;
+}
diff --git a/samples/vue/quickstart/vite.config.js b/samples/vue/quickstart/vite.config.js
new file mode 100644
index 0000000..c40aa3c
--- /dev/null
+++ b/samples/vue/quickstart/vite.config.js
@@ -0,0 +1,6 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+
+export default defineConfig({
+  plugins: [vue()],
+})