@asgardeo/nuxt 0.0.0 → 0.1.0-alpha.0

package/dist/module.mjs

@@ -1,67 +1,193 @@
-import { defineNuxtModule, createResolver, addImports, addServerImports } from '@nuxt/kit';
+import { defineNuxtModule, createResolver, addServerHandler, addServerPlugin, addPlugin, addRouteMiddleware, addImports, addComponent } from '@nuxt/kit';
 import { defu } from 'defu';
 
 const PACKAGE_NAME = "@asgardeo/nuxt";
 const module = defineNuxtModule({
-  defaults: {
-    baseUrl: process.env.ASGARDEO_BASE_URL || "",
-    clientID: process.env.ASGARDEO_CLIENT_ID || "",
-    clientSecret: process.env.ASGARDEO_CLIENT_SECRET || "",
-    scope: ["openid", "profile"],
-    signInRedirectURL: process.env.ASGARDEO_SIGN_IN_REDIRECT_URL || "",
-    signOutRedirectURL: process.env.ASGARDEO_SIGN_OUT_REDIRECT_URL || ""
-  },
+  defaults: {},
   meta: {
-    configKey: "asgardeoAuth",
+    configKey: "asgardeo",
     name: PACKAGE_NAME
   },
   setup(userOptions, nuxt) {
-    const options = defu(
+    const { resolve } = createResolver(import.meta.url);
+    const publicConfig = defu(
+      // Layer 1: environment variables — only win when actually set
+      {
+        afterSignInUrl: process.env["NUXT_PUBLIC_ASGARDEO_AFTER_SIGN_IN_URL"],
+        afterSignOutUrl: process.env["NUXT_PUBLIC_ASGARDEO_AFTER_SIGN_OUT_URL"],
+        applicationId: process.env["NUXT_PUBLIC_ASGARDEO_APPLICATION_ID"],
+        baseUrl: process.env["NUXT_PUBLIC_ASGARDEO_BASE_URL"],
+        clientId: process.env["NUXT_PUBLIC_ASGARDEO_CLIENT_ID"],
+        signInUrl: process.env["NUXT_PUBLIC_ASGARDEO_SIGN_IN_URL"],
+        signUpUrl: process.env["NUXT_PUBLIC_ASGARDEO_SIGN_UP_URL"]
+      },
+      // Layer 2: nuxt.config.ts options
       userOptions,
-      nuxt.options.runtimeConfig.asgardeoAuth,
-      nuxt.options.runtimeConfig.public.asgardeoAuth,
+      // Layer 3: hard defaults
       {
-        clientID: process.env.ASGARDEO_CLIENT_ID,
-        clientSecret: process.env.ASGARDEO_CLIENT_SECRET,
-        enablePKCE: true,
-        scope: ["openid", "profile"],
-        serverOrigin: process.env.ASGARDEO_BASE_URL,
-        signInRedirectURL: process.env.ASGARDEO_SIGN_IN_REDIRECT_URL || "",
-        signOutRedirectURL: process.env.ASGARDEO_SIGN_OUT_REDIRECT_URL || ""
+        afterSignInUrl: "/",
+        afterSignOutUrl: "/",
+        scopes: ["openid", "profile"]
       }
     );
-    nuxt.options.runtimeConfig.public.asgardeoAuth = defu(nuxt.options.runtimeConfig.public.asgardeoAuth, {
-      clientID: options.clientID
-    });
-    nuxt.options.runtimeConfig.asgardeoAuth = defu(nuxt.options.runtimeConfig.asgardeoAuth, {
-      clientID: options.clientID,
-      clientSecret: options.clientSecret,
-      scope: options.scope,
-      serverOrigin: options.baseUrl,
-      signInRedirectURL: options.signInRedirectURL,
-      signOutRedirectURL: options.signOutRedirectURL
-    });
-    const { resolve } = createResolver(import.meta.url);
-    const runtimeDir = resolve("./runtime");
-    const runtimeServerDir = resolve("./runtime/server");
-    addImports({
-      from: resolve(runtimeDir, "composables/asgardeo/useAuth"),
-      name: "useAuth"
-    });
-    addServerImports([
+    const privateConfig = {
+      clientSecret: process.env["ASGARDEO_CLIENT_SECRET"] || userOptions.clientSecret || "",
+      sessionSecret: process.env["ASGARDEO_SESSION_SECRET"] || userOptions.sessionSecret || ""
+    };
+    const { options } = nuxt;
+    options.runtimeConfig.asgardeo = defu(
+      options.runtimeConfig.asgardeo || {},
+      privateConfig
+    );
+    options.runtimeConfig.public.asgardeo = defu(
+      options.runtimeConfig.public.asgardeo || {},
       {
-        as: "AsgardeoAuthHandler",
-        from: resolve(runtimeServerDir, "handler"),
-        name: "AsgardeoAuthHandler"
+        afterSignInUrl: publicConfig.afterSignInUrl,
+        afterSignOutUrl: publicConfig.afterSignOutUrl,
+        applicationId: publicConfig.applicationId,
+        baseUrl: publicConfig.baseUrl,
+        clientId: publicConfig.clientId,
+        preferences: publicConfig.preferences,
+        scopes: publicConfig.scopes,
+        signInUrl: publicConfig.signInUrl,
+        signUpUrl: publicConfig.signUpUrl
       }
+    );
+    const publicAsgardeo = options.runtimeConfig.public.asgardeo;
+    if (publicAsgardeo?.["clientSecret"]) {
+      delete publicAsgardeo["clientSecret"];
+      console.error(
+        `[${PACKAGE_NAME}] SECURITY: clientSecret found in public config. Removed. Use ASGARDEO_CLIENT_SECRET env var.`
+      );
+    }
+    if (publicAsgardeo?.["sessionSecret"]) {
+      delete publicAsgardeo["sessionSecret"];
+      console.error(
+        `[${PACKAGE_NAME}] SECURITY: sessionSecret found in public config. Removed. Use ASGARDEO_SESSION_SECRET env var.`
+      );
+    }
+    const serverRoutes = [
+      // ── Auth flow ──────────────────────────────────────────────────────
+      { handler: resolve("./runtime/server/routes/auth/session/signin.get"), route: "/api/auth/signin" },
+      {
+        handler: resolve("./runtime/server/routes/auth/session/signin.post"),
+        method: "post",
+        route: "/api/auth/signin"
+      },
+      {
+        handler: resolve("./runtime/server/routes/auth/session/signup.post"),
+        method: "post",
+        route: "/api/auth/signup"
+      },
+      { handler: resolve("./runtime/server/routes/auth/session/callback.get"), route: "/api/auth/callback" },
+      {
+        handler: resolve("./runtime/server/routes/auth/session/callback.post"),
+        method: "post",
+        route: "/api/auth/callback"
+      },
+      {
+        handler: resolve("./runtime/server/routes/auth/session/signout.post"),
+        method: "post",
+        route: "/api/auth/signout"
+      },
+      // ── Session / token ───────────────────────────────────────────────
+      { handler: resolve("./runtime/server/routes/auth/session/session.get"), route: "/api/auth/session" },
+      { handler: resolve("./runtime/server/routes/auth/session/token.get"), route: "/api/auth/token" },
+      // ── User ──────────────────────────────────────────────────────────
+      { handler: resolve("./runtime/server/routes/auth/user/user.get"), route: "/api/auth/user" },
+      { handler: resolve("./runtime/server/routes/auth/user/profile.get"), route: "/api/auth/user/profile" },
+      {
+        handler: resolve("./runtime/server/routes/auth/user/profile.patch"),
+        method: "patch",
+        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",
+        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",
+        route: "/api/auth/organizations/switch"
+      },
+      // ── Branding ──────────────────────────────────────────────────────
+      { handler: resolve("./runtime/server/routes/auth/branding/branding.get"), route: "/api/auth/branding" }
+    ];
+    serverRoutes.forEach((sr) => {
+      addServerHandler({ handler: sr.handler, method: "method" in sr ? sr.method : void 0, route: sr.route });
+    });
+    addServerPlugin(resolve("./runtime/server/plugins/asgardeo-ssr"));
+    addPlugin(resolve("./runtime/plugins/asgardeo"));
+    addRouteMiddleware({
+      name: "auth",
+      path: resolve("./runtime/middleware/auth")
+    });
+    addImports([
+      // Core auth composable (Nuxt-specific wrapper around @asgardeo/vue)
+      { from: resolve("./runtime/composables/useAsgardeo"), name: "useAsgardeo" },
+      // Composables from @asgardeo/vue — auto-imported directly, no local wrappers
+      { from: "@asgardeo/vue", name: "useUser" },
+      { from: "@asgardeo/vue", name: "useOrganization" },
+      { from: "@asgardeo/vue", name: "useFlow" },
+      { from: "@asgardeo/vue", name: "useFlowMeta" },
+      { from: "@asgardeo/vue", name: "useTheme" },
+      { from: "@asgardeo/vue", name: "useBranding" },
+      // useI18n aliased to `useAsgardeoI18n` to avoid collision with @nuxtjs/i18n
+      { as: "useAsgardeoI18n", from: "@asgardeo/vue", name: "useI18n" },
+      // Middleware factory
+      { from: resolve("./runtime/middleware/defineAsgardeoMiddleware"), name: "defineAsgardeoMiddleware" }
     ]);
-    nuxt.hook("nitro:config", (nitroConfig) => {
-      nitroConfig.alias = nitroConfig.alias || {};
-      nitroConfig.alias["#auth/server"] = resolve(runtimeDir, "server/services/asgardeo");
-      nitroConfig.externals = defu(typeof nitroConfig.externals === "object" ? nitroConfig.externals : {}, {
-        inline: [resolve(runtimeDir)]
-      });
+    addComponent({
+      filePath: resolve("./runtime/components/AsgardeoRoot"),
+      name: "AsgardeoRoot"
+    });
+    addComponent({ filePath: resolve("./runtime/components/control/SignedIn"), name: "AsgardeoSignedIn" });
+    addComponent({ filePath: resolve("./runtime/components/control/SignedOut"), name: "AsgardeoSignedOut" });
+    addComponent({ filePath: resolve("./runtime/components/control/Loading"), name: "AsgardeoLoading" });
+    addComponent({ filePath: resolve("./runtime/components/actions/SignInButton"), name: "AsgardeoSignInButton" });
+    addComponent({ filePath: resolve("./runtime/components/actions/SignOutButton"), name: "AsgardeoSignOutButton" });
+    addComponent({ filePath: resolve("./runtime/components/actions/SignUpButton"), name: "AsgardeoSignUpButton" });
+    addComponent({ filePath: resolve("./runtime/components/auth/SignIn"), name: "AsgardeoSignIn" });
+    addComponent({ filePath: resolve("./runtime/components/auth/SignUp"), name: "AsgardeoSignUp" });
+    addComponent({ filePath: resolve("./runtime/components/user/User"), name: "AsgardeoUser" });
+    addComponent({ filePath: resolve("./runtime/components/user/UserProfile"), name: "AsgardeoUserProfile" });
+    addComponent({ filePath: resolve("./runtime/components/user/UserDropdown"), name: "AsgardeoUserDropdown" });
+    addComponent({ filePath: resolve("./runtime/components/organization/Organization"), name: "AsgardeoOrganization" });
+    addComponent({
+      filePath: resolve("./runtime/components/organization/OrganizationProfile"),
+      name: "AsgardeoOrganizationProfile"
+    });
+    addComponent({
+      filePath: resolve("./runtime/components/organization/OrganizationSwitcher"),
+      name: "AsgardeoOrganizationSwitcher"
+    });
+    addComponent({
+      filePath: resolve("./runtime/components/organization/OrganizationList"),
+      name: "AsgardeoOrganizationList"
+    });
+    addComponent({
+      filePath: resolve("./runtime/components/organization/CreateOrganization"),
+      name: "AsgardeoCreateOrganization"
     });
+    addComponent({ filePath: resolve("./runtime/components/auth/Callback"), name: "AsgardeoCallback" });
   }
 });
 

package/dist/runtime/components/AsgardeoRoot.d.ts

@@ -0,0 +1,52 @@
+/**
+ * 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 } from 'vue';
+/**
+ * Nuxt root wrapper that mounts the full Asgardeo Vue provider tree.
+ *
+ * Mirrors `AsgardeoClientProvider` in the Next.js SDK — reads the SSR-hydrated
+ * `useState` keys written by the universal Nuxt plugin and passes the resolved
+ * data as props to each Vue provider:
+ *
+ * - {@link I18nProvider}      ← `preferences.i18n`
+ * - {@link BrandingProvider}  ← `brandingPreference` (from `asgardeo:branding`)
+ * - {@link ThemeProvider}     ← `inheritFromBranding`, `mode`
+ * - {@link FlowProvider}
+ * - {@link UserProvider}      ← `profile`, `flattenedProfile`, `schemas`,
+ *                               `updateProfile`, `revalidateProfile`, `onUpdateProfile`
+ * - {@link OrganizationProvider} ← `currentOrganization`, `myOrganizations`,
+ *                                  `onOrganizationSwitch`, `getAllOrganizations`,
+ *                                  `revalidateMyOrganizations`
+ *
+ * The `ASGARDEO_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`, `useAsgardeoI18n`) receive real data.
+ *
+ * @example
+ * ```vue
+ * <!-- app.vue -->
+ * <template>
+ *   <AsgardeoRoot>
+ *     <NuxtPage />
+ *   </AsgardeoRoot>
+ * </template>
+ * ```
+ */
+declare const AsgardeoRoot: Component;
+export default AsgardeoRoot;

package/dist/runtime/components/AsgardeoRoot.js

@@ -0,0 +1,160 @@
+import { generateFlattenedUserProfile } from "@asgardeo/node";
+import {
+  BrandingProvider,
+  FlowMetaProvider,
+  FlowProvider,
+  I18nProvider,
+  OrganizationProvider,
+  ThemeProvider,
+  UserProvider
+} from "@asgardeo/vue";
+import { defineComponent, h } from "vue";
+import { useState, useRuntimeConfig } from "#imports";
+const AsgardeoRoot = defineComponent({
+  name: "AsgardeoRoot",
+  setup(_props, { slots }) {
+    const userProfileState = useState("asgardeo:user-profile");
+    const currentOrgState = useState("asgardeo:current-org");
+    const myOrgsState = useState("asgardeo:my-orgs");
+    const brandingState = useState("asgardeo:branding");
+    const authState = useState("asgardeo:auth");
+    const prefs = useRuntimeConfig().public.asgardeo?.preferences;
+    const shouldFetchProfile = prefs?.user?.fetchUserProfile !== false;
+    const shouldFetchOrgs = prefs?.user?.fetchOrganizations !== false;
+    const shouldFetchBranding = prefs?.theme?.inheritFromBranding !== false;
+    const themeMode = prefs?.theme?.mode ?? "light";
+    const onUpdateProfile = (payload) => {
+      const prev = userProfileState.value;
+      userProfileState.value = prev ? {
+        ...prev,
+        flattenedProfile: generateFlattenedUserProfile(payload, prev.schemas),
+        profile: payload
+      } : {
+        flattenedProfile: generateFlattenedUserProfile(payload, []),
+        profile: payload,
+        schemas: []
+      };
+      authState.value = { ...authState.value, user: payload };
+    };
+    const updateProfile = async (requestConfig, _sessionId) => {
+      if (_sessionId) {
+      }
+      try {
+        const result = await $fetch("/api/auth/user/profile", {
+          body: requestConfig,
+          method: "PATCH"
+        });
+        if (result?.success && result.data?.user) {
+          onUpdateProfile(result.data.user);
+        }
+        return result;
+      } catch (err) {
+        return { data: { user: {} }, error: String(err), success: false };
+      }
+    };
+    const revalidateProfile = async () => {
+      try {
+        const res = await $fetch("/api/auth/user/profile");
+        if (res) userProfileState.value = res;
+      } catch {
+      }
+    };
+    const onOrganizationSwitch = async (organization) => $fetch("/api/auth/organizations/switch", { body: { organization }, method: "POST" });
+    const getAllOrganizations = async () => $fetch("/api/auth/organizations");
+    const revalidateMyOrganizations = async () => {
+      try {
+        const res = await $fetch("/api/auth/organizations/me");
+        myOrgsState.value = res ?? [];
+        return myOrgsState.value;
+      } catch {
+        return myOrgsState.value;
+      }
+    };
+    const createOrganization = async (payload) => $fetch("/api/auth/organizations", { body: payload, method: "POST" });
+    const revalidateCurrentOrganization = async () => {
+      try {
+        const res = await $fetch("/api/auth/organizations/current");
+        currentOrgState.value = res ?? null;
+        return currentOrgState.value;
+      } catch {
+        return currentOrgState.value;
+      }
+    };
+    const revalidateBranding = async () => {
+      try {
+        const res = await $fetch("/api/auth/branding");
+        if (res) brandingState.value = res;
+      } catch {
+      }
+    };
+    return () => h(
+      I18nProvider,
+      { preferences: prefs?.i18n },
+      {
+        default: () => h(
+          FlowMetaProvider,
+          { enabled: false },
+          {
+            default: () => h(
+              BrandingProvider,
+              {
+                // 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 : void 0
+              },
+              {
+                default: () => h(
+                  ThemeProvider,
+                  {
+                    // Mirror the same flag used in the Nitro plugin gate.
+                    inheritFromBranding: shouldFetchBranding,
+                    mode: themeMode
+                  },
+                  {
+                    default: () => h(FlowProvider, null, {
+                      default: () => 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 : void 0,
+                          profile: shouldFetchProfile ? userProfileState.value : null,
+                          revalidateProfile: shouldFetchProfile ? revalidateProfile : void 0,
+                          schemas: shouldFetchProfile ? userProfileState.value?.schemas ?? null : null,
+                          updateProfile: shouldFetchProfile ? updateProfile : void 0
+                        },
+                        {
+                          default: () => h(
+                            OrganizationProvider,
+                            {
+                              // When fetchOrganizations is false pass empty
+                              // values so the provider renders without org data.
+                              createOrganization: shouldFetchOrgs ? createOrganization : void 0,
+                              currentOrganization: shouldFetchOrgs ? currentOrgState.value : null,
+                              getAllOrganizations: shouldFetchOrgs ? getAllOrganizations : void 0,
+                              myOrganizations: shouldFetchOrgs ? myOrgsState.value : [],
+                              onOrganizationSwitch: shouldFetchOrgs ? onOrganizationSwitch : void 0,
+                              revalidateCurrentOrganization: shouldFetchOrgs ? revalidateCurrentOrganization : void 0,
+                              revalidateMyOrganizations: shouldFetchOrgs ? revalidateMyOrganizations : void 0
+                            },
+                            {
+                              default: () => slots["default"]?.()
+                            }
+                          )
+                        }
+                      )
+                    })
+                  }
+                )
+              }
+            )
+          }
+        )
+      }
+    );
+  }
+});
+export default AsgardeoRoot;

package/dist/runtime/components/actions/SignInButton.d.ts

@@ -0,0 +1,37 @@
+/**
+ * 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 } from 'vue';
+/**
+ * Nuxt-specific SignInButton container.
+ *
+ * Mirrors the Next.js SDK's SignInButton: imports {@link BaseSignInButton} from
+ * `@asgardeo/vue` and wires navigation through Nuxt's `navigateTo` so
+ * server-side redirects work correctly (no `window.location` access).
+ *
+ * The `signIn` action and `signInUrl` come from the Nuxt-specific
+ * {@link useAsgardeo} composable which is provided via the Nuxt auto-import
+ * layer — not directly from `@asgardeo/vue`.
+ *
+ * @example
+ * ```vue
+ * <AsgardeoSignInButton />
+ * <AsgardeoSignInButton class="btn-primary">Log in</AsgardeoSignInButton>
+ * ```
+ */
+declare const SignInButton: Component;
+export default SignInButton;

package/dist/runtime/components/actions/SignInButton.js

@@ -0,0 +1,51 @@
+import { AsgardeoRuntimeError } from "@asgardeo/browser";
+import { BaseSignInButton } from "@asgardeo/vue";
+import { defineComponent, h, ref } from "vue";
+import { navigateTo } from "#app";
+import { useAsgardeo } from "#imports";
+const SignInButton = defineComponent({
+  emits: ["click", "error"],
+  name: "SignInButton",
+  props: {
+    signInOptions: { default: void 0, type: Object }
+  },
+  setup(props, { slots, emit, attrs }) {
+    const { signIn, signInUrl, signInOptions: contextSignInOptions } = useAsgardeo();
+    const isLoading = ref(false);
+    const handleSignIn = async (e) => {
+      try {
+        isLoading.value = true;
+        if (signInUrl) {
+          await navigateTo(signInUrl, { external: true });
+        } else {
+          await signIn(props.signInOptions ?? contextSignInOptions);
+        }
+        if (e) emit("click", e);
+      } catch (error) {
+        emit("error", error);
+        throw new AsgardeoRuntimeError(
+          `Sign in failed: ${error instanceof Error ? error.message : String(error)}`,
+          "SignInButton-handleSignIn-RuntimeError-001",
+          "nuxt",
+          "Something went wrong while trying to sign in. Please try again later."
+        );
+      } finally {
+        isLoading.value = false;
+      }
+    };
+    return () => {
+      const slotContent = slots["default"] ? () => slots["default"]({ isLoading: isLoading.value }) : void 0;
+      return h(
+        BaseSignInButton,
+        {
+          class: attrs["class"],
+          isLoading: isLoading.value,
+          onClick: handleSignIn,
+          style: attrs["style"]
+        },
+        slotContent
+      );
+    };
+  }
+});
+export default SignInButton;

package/dist/runtime/components/actions/SignOutButton.d.ts

@@ -0,0 +1,34 @@
+/**
+ * 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 } from 'vue';
+/**
+ * Nuxt-specific SignOutButton container.
+ *
+ * Imports {@link BaseSignOutButton} from `@asgardeo/vue` and wires the
+ * `signOut` action through the Nuxt-specific {@link useAsgardeo} composable
+ * (auto-import layer), which uses Nuxt's `navigateTo` instead of
+ * `window.location`.
+ *
+ * @example
+ * ```vue
+ * <AsgardeoSignOutButton />
+ * <AsgardeoSignOutButton class="btn-secondary">Sign out</AsgardeoSignOutButton>
+ * ```
+ */
+declare const SignOutButton: Component;
+export default SignOutButton;

package/dist/runtime/components/actions/SignOutButton.js

@@ -0,0 +1,43 @@
+import { AsgardeoRuntimeError } from "@asgardeo/browser";
+import { BaseSignOutButton } from "@asgardeo/vue";
+import { defineComponent, h, ref } from "vue";
+import { useAsgardeo } from "#imports";
+const SignOutButton = defineComponent({
+  emits: ["click", "error"],
+  name: "SignOutButton",
+  setup(_, { slots, emit, attrs }) {
+    const { signOut } = useAsgardeo();
+    const isLoading = ref(false);
+    const handleSignOut = async (e) => {
+      try {
+        isLoading.value = true;
+        await signOut();
+        if (e) emit("click", e);
+      } catch (error) {
+        emit("error", error);
+        throw new AsgardeoRuntimeError(
+          `Sign out failed: ${error instanceof Error ? error.message : String(error)}`,
+          "SignOutButton-handleSignOut-RuntimeError-001",
+          "nuxt",
+          "Something went wrong while trying to sign out. Please try again later."
+        );
+      } finally {
+        isLoading.value = false;
+      }
+    };
+    return () => {
+      const slotContent = slots["default"] ? () => slots["default"]({ isLoading: isLoading.value }) : void 0;
+      return h(
+        BaseSignOutButton,
+        {
+          class: attrs["class"],
+          isLoading: isLoading.value,
+          onClick: handleSignOut,
+          style: attrs["style"]
+        },
+        slotContent
+      );
+    };
+  }
+});
+export default SignOutButton;

package/dist/runtime/components/actions/SignUpButton.d.ts

@@ -0,0 +1,33 @@
+/**
+ * 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 } from 'vue';
+/**
+ * Nuxt-specific SignUpButton container.
+ *
+ * Imports {@link BaseSignUpButton} from `@asgardeo/vue` and wires navigation
+ * through Nuxt's `navigateTo` so a configured `signUpUrl` is followed
+ * SSR-safely instead of via `window.location`.
+ *
+ * @example
+ * ```vue
+ * <AsgardeoSignUpButton />
+ * <AsgardeoSignUpButton class="btn-primary">Create account</AsgardeoSignUpButton>
+ * ```
+ */
+declare const SignUpButton: Component;
+export default SignUpButton;