@strands.gg/accui 2.1.5 → 2.1.7

package/dist/js/composables-BqIRpDGP.js

@@ -0,0 +1,1609 @@
+import { computed, ref, onMounted, watch, inject, provide, onUnmounted } from "vue";
+import { u as useRequestCache, d as debouncedSetItem } from "./utils-BZHeJkZf.js";
+const currentTheme = ref("system");
+const systemPrefersDark = ref(false);
+const STORAGE_KEY = "strands-ui-theme";
+function getSystemPreference() {
+  if (typeof window === "undefined") return false;
+  return window.matchMedia("(prefers-color-scheme: dark)").matches;
+}
+function getStoredTheme() {
+  if (typeof window === "undefined") return "system";
+  try {
+    const stored = localStorage.getItem(STORAGE_KEY);
+    if (stored && ["light", "dark", "system"].includes(stored)) {
+      return stored;
+    }
+  } catch (error) {
+    console.warn("Failed to read theme preference from localStorage:", error);
+  }
+  return "system";
+}
+function setStoredTheme(theme) {
+  if (typeof window === "undefined") return;
+  try {
+    localStorage.setItem(STORAGE_KEY, theme);
+  } catch (error) {
+    console.warn("Failed to save theme preference to localStorage:", error);
+  }
+}
+function applyTheme(isDark) {
+  if (typeof document === "undefined") return;
+  if (isDark) {
+    document.documentElement.setAttribute("data-theme", "dark");
+    document.documentElement.classList.add("dark");
+  } else {
+    document.documentElement.setAttribute("data-theme", "light");
+    document.documentElement.classList.remove("dark");
+  }
+}
+function useDarkMode() {
+  const isDark = computed(() => {
+    if (currentTheme.value === "dark") return true;
+    if (currentTheme.value === "light") return false;
+    return systemPrefersDark.value;
+  });
+  const themeLabel = computed(() => {
+    switch (currentTheme.value) {
+      case "light":
+        return "Light";
+      case "dark":
+        return "Dark";
+      case "system":
+        return "System";
+      default:
+        return "System";
+    }
+  });
+  function setTheme(theme) {
+    currentTheme.value = theme;
+    setStoredTheme(theme);
+  }
+  function toggle() {
+    const newTheme = isDark.value ? "light" : "dark";
+    setTheme(newTheme);
+  }
+  function cycleTheme() {
+    switch (currentTheme.value) {
+      case "light":
+        setTheme("dark");
+        break;
+      case "dark":
+        setTheme("system");
+        break;
+      case "system":
+        setTheme("light");
+        break;
+      default:
+        setTheme("light");
+        break;
+    }
+  }
+  function initialize() {
+    if (typeof window === "undefined") return;
+    systemPrefersDark.value = getSystemPreference();
+    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    const handleSystemThemeChange = (e) => {
+      systemPrefersDark.value = e.matches;
+    };
+    if (mediaQuery.addEventListener) {
+      mediaQuery.addEventListener("change", handleSystemThemeChange);
+    } else {
+      mediaQuery.addListener(handleSystemThemeChange);
+    }
+    currentTheme.value = getStoredTheme();
+    applyTheme(isDark.value);
+    watch(isDark, (newIsDark) => {
+      applyTheme(newIsDark);
+    }, { immediate: false });
+  }
+  onMounted(() => {
+    initialize();
+  });
+  return {
+    // State
+    currentTheme: computed(() => currentTheme.value),
+    isDark,
+    themeLabel,
+    // Actions  
+    setTheme,
+    toggle,
+    cycleTheme,
+    initialize,
+    // Theme options for UI
+    themeOptions: [
+      { value: "light", label: "Light", icon: "sun" },
+      { value: "dark", label: "Dark", icon: "moon" },
+      { value: "system", label: "System", icon: "monitor" }
+    ]
+  };
+}
+let globalInstance = null;
+function useGlobalDarkMode() {
+  if (!globalInstance) {
+    globalInstance = useDarkMode();
+    if (typeof window !== "undefined") {
+      globalInstance.initialize();
+    }
+  }
+  return globalInstance;
+}
+const STRANDS_AUTH_DEFAULTS = {
+  baseUrl: "https://your-api.example.com",
+  accentColor: "#EA00A8",
+  redirectUrl: "/",
+  onSignInUrl: "/dashboard",
+  onSignOutUrl: "/",
+  autoRefresh: true,
+  refreshInterval: 4,
+  protectedRoutes: [],
+  guestOnlyRoutes: ["/auth", "/login", "/register"],
+  devMode: false,
+  styles: true,
+  endpoints: {},
+  useSquircle: true
+};
+const DEFAULT_ENDPOINTS = {
+  signIn: "/api/v1/auth/sign-in",
+  signUp: "/api/v1/auth/sign-up",
+  signOut: "/api/v1/auth/sign-out",
+  refresh: "/api/v1/auth/refresh",
+  passwordReset: "/api/v1/auth/password-reset",
+  passwordResetConfirm: "/api/v1/auth/password-reset/confirm",
+  completeRegistration: "/api/v1/auth/complete-registration",
+  profile: "/api/v1/user/profile",
+  verifyEmail: "/api/v1/auth/verify-email",
+  oauthProviders: "/api/v1/oauth/providers",
+  oauthProvider: "/api/v1/oauth/providers/{provider_id}",
+  changeEmail: "/api/v1/user/change-email",
+  avatar: "/api/v1/user/avatar",
+  settings: "/api/v1/user/settings",
+  // Username endpoints
+  changeUsername: "/api/v1/user/username",
+  usernameCooldown: "/api/v1/user/username/cooldown",
+  checkUsernameAvailability: "/api/v1/username/{username}/available",
+  // MFA endpoints
+  mfaDevices: "/api/v1/mfa/devices",
+  mfaTotpSetup: "/api/v1/mfa/totp/setup",
+  mfaTotpVerify: "/api/v1/mfa/totp/verify",
+  mfaEmailSetup: "/api/v1/mfa/email/setup",
+  mfaEmailSend: "/api/v1/mfa/email/send",
+  mfaEmailVerify: "/api/v1/mfa/email/verify",
+  mfaDeviceDisable: "/api/v1/mfa/device/disable",
+  mfaBackupCodes: "/api/v1/mfa/backup-codes/regenerate",
+  // Hardware key endpoints
+  mfaHardwareStartRegistration: "/api/v1/mfa/hardware/start-registration",
+  mfaHardwareCompleteRegistration: "/api/v1/mfa/hardware/complete-registration",
+  // MFA sign-in specific endpoints
+  mfaSigninSendEmail: "/api/v1/auth/mfa/email/send",
+  mfaSigninVerify: "/api/v1/auth/mfa/verify",
+  mfaBackupCodeVerify: "/api/v1/auth/mfa/backup-code/verify",
+  mfaWebAuthnChallenge: "/api/v1/auth/mfa/webauthn/challenge",
+  // Session management endpoints
+  sessions: "/api/v1/sessions",
+  sessionsStats: "/api/v1/sessions/stats",
+  sessionRevoke: "/api/v1/sessions/{session_id}/revoke",
+  sessionsRevokeAll: "/api/v1/sessions/revoke-all"
+};
+const STRANDS_CONFIG_KEY = Symbol("strands-config");
+const globalConfig = ref(null);
+function generateColorShades(accentColor) {
+  if (typeof window === "undefined" || !document.documentElement) return;
+  document.documentElement.style.setProperty("--strands-accent", accentColor);
+  document.documentElement.style.setProperty("--accui-strands-accent", accentColor);
+  document.documentElement.style.setProperty("--accui-strands-50", `color-mix(in srgb, ${accentColor} 10%, white)`);
+  document.documentElement.style.setProperty("--accui-strands-100", `color-mix(in srgb, ${accentColor} 20%, white)`);
+  document.documentElement.style.setProperty("--accui-strands-200", `color-mix(in srgb, ${accentColor} 30%, white)`);
+  document.documentElement.style.setProperty("--accui-strands-300", `color-mix(in srgb, ${accentColor} 40%, white)`);
+  document.documentElement.style.setProperty("--accui-strands-400", `color-mix(in srgb, ${accentColor} 70%, white)`);
+  document.documentElement.style.setProperty("--accui-strands-500", accentColor);
+  document.documentElement.style.setProperty("--accui-strands-600", `color-mix(in srgb, ${accentColor} 85%, black)`);
+  document.documentElement.style.setProperty("--accui-strands-700", `color-mix(in srgb, ${accentColor} 70%, black)`);
+  document.documentElement.style.setProperty("--accui-strands-800", `color-mix(in srgb, ${accentColor} 55%, black)`);
+  document.documentElement.style.setProperty("--accui-strands-900", `color-mix(in srgb, ${accentColor} 40%, black)`);
+  document.documentElement.style.setProperty("--accui-strands-950", `color-mix(in srgb, ${accentColor} 25%, black)`);
+}
+function provideStrandsConfig(config) {
+  globalConfig.value = config;
+  if (typeof window !== "undefined" && document.documentElement) {
+    const useSquircle = config.useSquircle !== void 0 ? config.useSquircle : true;
+    document.documentElement.style.setProperty("--strands-allow-squircle", useSquircle ? "1" : "0");
+    if (config.accentColor) {
+      generateColorShades(config.accentColor);
+    }
+  }
+  try {
+    provide(STRANDS_CONFIG_KEY, config);
+  } catch (error) {
+    console.warn("[Strands Auth] Could not provide config via Vue provide/inject. Config available via global state only.", error);
+  }
+}
+function useStrandsConfig(fallbackConfig) {
+  const injectedConfig = inject(STRANDS_CONFIG_KEY, null);
+  let nuxtConfig = null;
+  try {
+    if (typeof window !== "undefined") {
+      if (window.__STRANDS_CONFIG__) {
+        nuxtConfig = window.__STRANDS_CONFIG__;
+      } else if (window.__NUXT__) {
+        const nuxtData = window.__NUXT__;
+        nuxtConfig = nuxtData?.config?.public?.strandsAuth || nuxtData?.public?.strandsAuth || nuxtData?.strandsAuth;
+      }
+    }
+  } catch (error) {
+    console.error("[Strands Auth] Error accessing runtime configuration:", error);
+  }
+  const activeConfig = computed(() => {
+    const config = {
+      ...STRANDS_AUTH_DEFAULTS,
+      ...fallbackConfig || {},
+      ...injectedConfig || {},
+      ...globalConfig.value || {},
+      ...nuxtConfig || {}
+    };
+    if (config.baseUrl === STRANDS_AUTH_DEFAULTS.baseUrl && typeof window === "undefined") {
+      console.warn("[Strands Auth] No baseUrl configured for SSR. Please provide a baseUrl in your strandsAuth configuration.");
+    }
+    if (typeof window !== "undefined" && document.documentElement) {
+      const useSquircle = config.useSquircle !== void 0 ? config.useSquircle : true;
+      document.documentElement.style.setProperty("--strands-allow-squircle", useSquircle ? "1" : "0");
+      if (config.accentColor) {
+        document.documentElement.style.setProperty("--strands-accent", config.accentColor);
+      }
+    }
+    return config;
+  });
+  const endpoints = computed(() => {
+    const config = activeConfig.value;
+    const customEndpoints = config.endpoints || {};
+    return {
+      signIn: customEndpoints.signIn || DEFAULT_ENDPOINTS.signIn,
+      signUp: customEndpoints.signUp || DEFAULT_ENDPOINTS.signUp,
+      signOut: customEndpoints.signOut || DEFAULT_ENDPOINTS.signOut,
+      refresh: customEndpoints.refresh || DEFAULT_ENDPOINTS.refresh,
+      passwordReset: customEndpoints.passwordReset || DEFAULT_ENDPOINTS.passwordReset,
+      passwordResetConfirm: customEndpoints.passwordResetConfirm || DEFAULT_ENDPOINTS.passwordResetConfirm,
+      completeRegistration: customEndpoints.completeRegistration || DEFAULT_ENDPOINTS.completeRegistration,
+      profile: customEndpoints.profile || DEFAULT_ENDPOINTS.profile,
+      verifyEmail: customEndpoints.verifyEmail || DEFAULT_ENDPOINTS.verifyEmail,
+      oauthProviders: customEndpoints.oauthProviders || DEFAULT_ENDPOINTS.oauthProviders,
+      oauthProvider: customEndpoints.oauthProvider || DEFAULT_ENDPOINTS.oauthProvider,
+      changeEmail: customEndpoints.changeEmail || DEFAULT_ENDPOINTS.changeEmail,
+      avatar: customEndpoints.avatar || DEFAULT_ENDPOINTS.avatar,
+      settings: customEndpoints.settings || DEFAULT_ENDPOINTS.settings,
+      // Username endpoints
+      changeUsername: customEndpoints.changeUsername || DEFAULT_ENDPOINTS.changeUsername,
+      usernameCooldown: customEndpoints.usernameCooldown || DEFAULT_ENDPOINTS.usernameCooldown,
+      checkUsernameAvailability: customEndpoints.checkUsernameAvailability || DEFAULT_ENDPOINTS.checkUsernameAvailability,
+      // MFA endpoints
+      mfaDevices: customEndpoints.mfaDevices || DEFAULT_ENDPOINTS.mfaDevices,
+      mfaTotpSetup: customEndpoints.mfaTotpSetup || DEFAULT_ENDPOINTS.mfaTotpSetup,
+      mfaTotpVerify: customEndpoints.mfaTotpVerify || DEFAULT_ENDPOINTS.mfaTotpVerify,
+      mfaEmailSetup: customEndpoints.mfaEmailSetup || DEFAULT_ENDPOINTS.mfaEmailSetup,
+      mfaEmailSend: customEndpoints.mfaEmailSend || DEFAULT_ENDPOINTS.mfaEmailSend,
+      mfaEmailVerify: customEndpoints.mfaEmailVerify || DEFAULT_ENDPOINTS.mfaEmailVerify,
+      mfaDeviceDisable: customEndpoints.mfaDeviceDisable || DEFAULT_ENDPOINTS.mfaDeviceDisable,
+      mfaBackupCodes: customEndpoints.mfaBackupCodes || DEFAULT_ENDPOINTS.mfaBackupCodes,
+      // Hardware key endpoints
+      mfaHardwareStartRegistration: customEndpoints.mfaHardwareStartRegistration || DEFAULT_ENDPOINTS.mfaHardwareStartRegistration,
+      mfaHardwareCompleteRegistration: customEndpoints.mfaHardwareCompleteRegistration || DEFAULT_ENDPOINTS.mfaHardwareCompleteRegistration,
+      // MFA sign-in specific endpoints
+      mfaSigninSendEmail: customEndpoints.mfaSigninSendEmail || DEFAULT_ENDPOINTS.mfaSigninSendEmail,
+      mfaSigninVerify: customEndpoints.mfaSigninVerify || DEFAULT_ENDPOINTS.mfaSigninVerify,
+      mfaBackupCodeVerify: customEndpoints.mfaBackupCodeVerify || DEFAULT_ENDPOINTS.mfaBackupCodeVerify,
+      mfaWebAuthnChallenge: customEndpoints.mfaWebAuthnChallenge || DEFAULT_ENDPOINTS.mfaWebAuthnChallenge,
+      // Session management endpoints
+      sessions: customEndpoints.sessions || DEFAULT_ENDPOINTS.sessions,
+      sessionsStats: customEndpoints.sessionsStats || DEFAULT_ENDPOINTS.sessionsStats,
+      sessionRevoke: customEndpoints.sessionRevoke || DEFAULT_ENDPOINTS.sessionRevoke,
+      sessionsRevokeAll: customEndpoints.sessionsRevokeAll || DEFAULT_ENDPOINTS.sessionsRevokeAll
+    };
+  });
+  const getUrl = (endpoint) => {
+    const config = activeConfig.value;
+    if (!config.baseUrl) {
+      throw new Error("Base URL is required in configuration");
+    }
+    let endpointPath;
+    if (typeof endpoint === "string" && endpoint in endpoints.value) {
+      endpointPath = endpoints.value[endpoint];
+    } else if (typeof endpoint === "string") {
+      endpointPath = endpoint;
+    } else {
+      endpointPath = endpoints.value[endpoint];
+    }
+    const baseUrl = config.baseUrl.replace(/\/$/, "");
+    const path = endpointPath.startsWith("/") ? endpointPath : `/${endpointPath}`;
+    console.debug(`[Strands Auth] Constructing URL for endpoint "${endpoint}": ${baseUrl}${path}`);
+    return `${baseUrl}${path}`;
+  };
+  const getSupportEmail = () => {
+    const config = activeConfig.value;
+    return config.supportEmail || null;
+  };
+  return {
+    config: activeConfig,
+    endpoints,
+    getUrl,
+    getSupportEmail
+  };
+}
+function setStrandsConfig(config) {
+  globalConfig.value = config;
+  if (typeof window !== "undefined" && document.documentElement) {
+    const useSquircle = config.useSquircle !== void 0 ? config.useSquircle : true;
+    document.documentElement.style.setProperty("--strands-allow-squircle", useSquircle ? "1" : "0");
+    if (config.accentColor) {
+      generateColorShades(config.accentColor);
+    }
+  }
+}
+const mapApiUserToFrontend = (apiUser) => {
+  return {
+    id: apiUser.id,
+    email: apiUser.email,
+    firstName: apiUser.first_name || apiUser.firstName || "",
+    lastName: apiUser.last_name || apiUser.lastName || "",
+    avatar: apiUser.avatar_url || apiUser.avatar,
+    mfaEnabled: apiUser.mfa_enabled ?? apiUser.mfaEnabled ?? false,
+    emailVerified: apiUser.email_verified ?? apiUser.emailVerified ?? false,
+    passwordUpdatedAt: apiUser.password_updated_at || apiUser.passwordUpdatedAt,
+    settings: apiUser.settings || {},
+    xp: apiUser.xp || 0,
+    level: apiUser.level || 1,
+    next_level_xp: apiUser.next_level_xp || apiUser.next_level_xp || 4,
+    username: apiUser.username,
+    usernameLastChangedAt: apiUser.username_last_changed_at || apiUser.usernameLastChangedAt,
+    createdAt: apiUser.created_at || apiUser.createdAt,
+    updatedAt: apiUser.updated_at || apiUser.updatedAt || (/* @__PURE__ */ new Date()).toISOString()
+  };
+};
+const globalState = {
+  currentUser: ref(null),
+  currentSession: ref(null),
+  loadingStates: ref({
+    initializing: true,
+    signingIn: false,
+    signingUp: false,
+    signingOut: false,
+    refreshingToken: false,
+    sendingMfaEmail: false,
+    verifyingMfa: false,
+    loadingProfile: false
+  }),
+  isInitialized: ref(false),
+  mfaRequired: ref(false),
+  mfaSessionId: ref(null),
+  availableMfaMethods: ref([])
+};
+let refreshTimer = null;
+let refreshPromise = null;
+function useStrandsAuth() {
+  const { getUrl } = useStrandsConfig();
+  const { fetch: cachedFetch, clear: clearCache, invalidate } = useRequestCache();
+  const { currentUser, currentSession, loadingStates, isInitialized, mfaRequired, mfaSessionId, availableMfaMethods } = globalState;
+  const isInitializing = computed(() => loadingStates.value.initializing);
+  const isSigningIn = computed(() => loadingStates.value.signingIn);
+  const isSigningUp = computed(() => loadingStates.value.signingUp);
+  const isSigningOut = computed(() => loadingStates.value.signingOut);
+  const isRefreshingToken = computed(() => loadingStates.value.refreshingToken);
+  const isSendingMfaEmail = computed(() => loadingStates.value.sendingMfaEmail);
+  const isVerifyingMfa = computed(() => loadingStates.value.verifyingMfa);
+  computed(() => loadingStates.value.loadingProfile);
+  const loading2 = computed(
+    () => loadingStates.value.signingIn || loadingStates.value.signingUp || loadingStates.value.signingOut || loadingStates.value.refreshingToken || loadingStates.value.sendingMfaEmail || loadingStates.value.verifyingMfa || loadingStates.value.loadingProfile
+  );
+  const isLoading = computed(() => loadingStates.value.initializing || loading2.value);
+  const loadingMessage = computed(() => {
+    const states = loadingStates.value;
+    if (states.initializing) return "Checking authentication...";
+    if (states.signingIn) return "Signing you in...";
+    if (states.signingUp) return "Creating your account...";
+    if (states.signingOut) return "Signing you out...";
+    if (states.refreshingToken) return "Refreshing session...";
+    if (states.sendingMfaEmail) return "Sending verification code...";
+    if (states.verifyingMfa) return "Verifying code...";
+    if (states.loadingProfile) return "Loading profile...";
+    return "Loading...";
+  });
+  const getAuthHeaders = () => {
+    const headers = {};
+    if (currentSession.value?.accessToken) {
+      headers["Authorization"] = `Bearer ${currentSession.value.accessToken}`;
+    }
+    if (currentSession.value?.refreshToken) {
+      headers["x-refresh-token"] = currentSession.value.refreshToken;
+    }
+    return headers;
+  };
+  const completeHardwareKeyRegistration = async (deviceId, credential, accessToken) => {
+    const response = await fetch(getUrl("mfaHardwareCompleteRegistration"), {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        "Authorization": `Bearer ${currentSession.value.accessToken}`
+      },
+      body: JSON.stringify({
+        device_id: deviceId,
+        credential
+      })
+    });
+    if (!response.ok) {
+      const errorText = await response.text();
+      let errorMessage = "Failed to complete hardware key registration";
+      try {
+        const errorData = JSON.parse(errorText);
+        errorMessage = errorData.message || errorData.error || errorText;
+      } catch {
+        errorMessage = errorText || "Failed to complete hardware key registration";
+      }
+      throw new Error(errorMessage);
+    }
+    return response.json();
+  };
+  const registerHardwareKey = async (deviceName, accessToken, deviceType = "hardware") => {
+    const response = await fetch(getUrl("mfaHardwareStartRegistration"), {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        "Authorization": `Bearer ${currentSession.value.accessToken}`
+      },
+      body: JSON.stringify({
+        device_name: deviceName,
+        device_type: deviceType
+      })
+    });
+    if (!response.ok) {
+      const errorText = await response.text();
+      let errorMessage = "Failed to start hardware key registration";
+      try {
+        const errorData = JSON.parse(errorText);
+        errorMessage = errorData.message || errorData.error || errorText;
+      } catch {
+        errorMessage = errorText || "Failed to start hardware key registration";
+      }
+      throw new Error(errorMessage);
+    }
+    return response.json();
+  };
+  const isAuthenticated = computed(() => currentUser.value !== null);
+  const signIn = async (credentials) => {
+    loadingStates.value.signingIn = true;
+    try {
+      mfaRequired.value = false;
+      mfaSessionId.value = null;
+      availableMfaMethods.value = [];
+      const headers = {
+        "Content-Type": "application/json"
+      };
+      if (typeof window !== "undefined" && window.location) {
+        headers["Origin"] = window.location.origin;
+      }
+      const response = await fetch(getUrl("signIn"), {
+        method: "POST",
+        headers,
+        body: JSON.stringify(credentials)
+      });
+      if (!response.ok) {
+        if (response.status === 401) {
+          throw new Error("Invalid email or password");
+        } else if (response.status === 403) {
+          throw new Error("Please verify your email address before signing in");
+        } else {
+          throw new Error(`Sign in failed: ${response.status} ${response.statusText}`);
+        }
+      }
+      const authData = await response.json();
+      if (authData.mfa_required) {
+        mfaRequired.value = true;
+        mfaSessionId.value = authData.mfa_session_id || null;
+        const methods = (authData.available_mfa_methods || []).map((method) => {
+          let fallbackName = `${method.device_type.charAt(0).toUpperCase() + method.device_type.slice(1)} Authentication`;
+          if (method.device_type === "hardware") {
+            fallbackName = method.device_name || "Security Key";
+          } else if (method.device_type === "totp") {
+            fallbackName = method.device_name || "Authenticator App";
+          } else if (method.device_type === "email") {
+            fallbackName = method.device_name || "Email Verification";
+          }
+          return {
+            id: method.device_id,
+            device_type: method.device_type,
+            device_name: method.device_name || fallbackName,
+            is_active: true,
+            created_at: (/* @__PURE__ */ new Date()).toISOString(),
+            last_used_at: method.last_used_at,
+            // Pass through additional metadata if available
+            credential_id: method.credential_id,
+            device_info: method.device_info
+          };
+        });
+        availableMfaMethods.value = methods;
+        loadingStates.value.signingIn = false;
+        return authData;
+      }
+      await setAuthData(authData);
+      return authData;
+    } catch (error) {
+      throw error;
+    } finally {
+      loadingStates.value.signingIn = false;
+    }
+  };
+  const signUp = async (userData) => {
+    loadingStates.value.signingUp = true;
+    try {
+      throw new Error("Sign up not implemented - please integrate with auth SDK");
+    } finally {
+      loadingStates.value.signingUp = false;
+    }
+  };
+  const signOut = async () => {
+    loadingStates.value.signingOut = true;
+    try {
+      stopTokenRefreshTimer();
+      refreshPromise = null;
+      clearCache();
+      currentUser.value = null;
+      currentSession.value = null;
+      mfaRequired.value = false;
+      mfaSessionId.value = null;
+      availableMfaMethods.value = [];
+      if (typeof window !== "undefined") {
+        localStorage.removeItem("strands_auth_session");
+        localStorage.removeItem("strands_auth_user");
+      }
+    } finally {
+      loadingStates.value.signingOut = false;
+    }
+  };
+  const refreshToken = async () => {
+    if (!currentSession.value?.refreshToken) {
+      return false;
+    }
+    if (refreshPromise) {
+      console.log("Token refresh already in progress, waiting for completion...");
+      return await refreshPromise;
+    }
+    refreshPromise = (async () => {
+      loadingStates.value.refreshingToken = true;
+      try {
+        const response = await fetch(getUrl("refresh"), {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json"
+          },
+          body: JSON.stringify({
+            refresh_token: currentSession.value.refreshToken
+          })
+        });
+        if (!response.ok) {
+          if (response.status === 401) {
+            await signOut();
+            return false;
+          }
+          throw new Error(`Token refresh failed: ${response.status} ${response.statusText}`);
+        }
+        const tokenData = await response.json();
+        if (tokenData.user) {
+          currentUser.value = mapApiUserToFrontend(tokenData.user);
+          if (currentUser.value && typeof window !== "undefined") {
+            localStorage.setItem("strands_auth_user", JSON.stringify(currentUser.value));
+          }
+        }
+        const newSession = {
+          accessToken: tokenData.access_token,
+          refreshToken: tokenData.refresh_token,
+          expiresAt: new Date(Date.now() + 5 * 60 * 1e3),
+          // 5 minutes from now
+          userId: tokenData.user?.id || currentUser.value?.id
+        };
+        currentSession.value = newSession;
+        if (typeof window !== "undefined") {
+          localStorage.setItem("strands_auth_session", JSON.stringify(newSession));
+        }
+        startTokenRefreshTimer();
+        invalidate(`sessions:${currentSession.value.accessToken.slice(0, 20)}`);
+        return true;
+      } catch (error) {
+        await signOut();
+        return false;
+      } finally {
+        loadingStates.value.refreshingToken = false;
+      }
+    })();
+    const result = await refreshPromise;
+    refreshPromise = null;
+    return result;
+  };
+  const fetchProfile = async () => {
+    const cacheKey = `profile:${currentSession.value.accessToken.slice(0, 20)}`;
+    loadingStates.value.loadingProfile = true;
+    try {
+      return await cachedFetch(cacheKey, async () => {
+        const response = await fetch(getUrl("profile"), {
+          method: "GET",
+          headers: {
+            "Content-Type": "application/json",
+            "Authorization": `Bearer ${currentSession.value?.accessToken}`
+          }
+        });
+        if (!response.ok) {
+          if (response.status === 401) {
+            throw new Error("Authentication expired. Please sign in again.");
+          } else {
+            throw new Error(`Failed to fetch profile: ${response.status} ${response.statusText}`);
+          }
+        }
+        const userData = await response.json();
+        currentUser.value = mapApiUserToFrontend(userData);
+        if (currentUser.value && typeof window !== "undefined") {
+          localStorage.setItem("strands_auth_user", JSON.stringify(currentUser.value));
+        }
+        return currentUser.value;
+      });
+    } finally {
+      loadingStates.value.loadingProfile = false;
+    }
+  };
+  const updateProfile = async (profileData) => {
+    loadingStates.value.loadingProfile = true;
+    try {
+      const response = await fetch(getUrl("profile"), {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "Authorization": `Bearer ${currentSession.value.accessToken}`
+        },
+        body: JSON.stringify({
+          first_name: profileData.firstName,
+          last_name: profileData.lastName
+        })
+      });
+      if (!response.ok) {
+        if (response.status === 401) {
+          throw new Error("Authentication expired. Please sign in again.");
+        } else {
+          throw new Error(`Profile update failed: ${response.status} ${response.statusText}`);
+        }
+      }
+      const updatedUserData = await response.json();
+      currentUser.value = mapApiUserToFrontend(updatedUserData);
+      if (currentUser.value) {
+        debouncedSetItem("strands_auth_user", JSON.stringify(currentUser.value));
+      }
+      return currentUser.value;
+    } finally {
+      loadingStates.value.loadingProfile = false;
+    }
+  };
+  const updateUserSettings = async (settings) => {
+    loadingStates.value.loadingProfile = true;
+    try {
+      const response = await fetch(getUrl("settings"), {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "Authorization": `Bearer ${currentSession.value.accessToken}`
+        },
+        body: JSON.stringify({
+          settings
+        })
+      });
+      if (!response.ok) {
+        if (response.status === 401) {
+          throw new Error("Authentication expired. Please sign in again.");
+        } else {
+          throw new Error(`Settings update failed: ${response.status} ${response.statusText}`);
+        }
+      }
+      const updatedUserData = await response.json();
+      currentUser.value = mapApiUserToFrontend(updatedUserData);
+      if (currentUser.value) {
+        debouncedSetItem("strands_auth_user", JSON.stringify(currentUser.value));
+      }
+      return currentUser.value;
+    } finally {
+      loadingStates.value.loadingProfile = false;
+    }
+  };
+  const changeEmail = async (newEmail, password) => {
+    loadingStates.value.loadingProfile = true;
+    try {
+      const response = await fetch(getUrl("changeEmail"), {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "Authorization": `Bearer ${currentSession.value.accessToken}`
+        },
+        body: JSON.stringify({
+          new_email: newEmail,
+          password
+        })
+      });
+      if (!response.ok) {
+        if (response.status === 401) {
+          throw new Error("Authentication expired. Please sign in again.");
+        } else {
+          const errorData = await response.json().catch(() => ({}));
+          throw new Error(errorData.message || `Email change failed: ${response.status} ${response.statusText}`);
+        }
+      }
+      const result = await response.json();
+      if (currentUser.value) {
+        currentUser.value = {
+          ...currentUser.value,
+          email: newEmail,
+          emailVerified: false,
+          // Email needs to be verified again
+          updatedAt: (/* @__PURE__ */ new Date()).toISOString()
+        };
+        if (typeof window !== "undefined") {
+          localStorage.setItem("strands_auth_user", JSON.stringify(currentUser.value));
+        }
+      }
+      return result;
+    } finally {
+      loadingStates.value.loadingProfile = false;
+    }
+  };
+  const verifyMfa = async (deviceId, code, isBackupCode = false) => {
+    if (!mfaSessionId.value) {
+      throw new Error("No MFA session available");
+    }
+    loadingStates.value.verifyingMfa = true;
+    try {
+      const endpoint = isBackupCode ? getUrl("mfaBackupCodeVerify") : getUrl("mfaSigninVerify");
+      const body = isBackupCode ? { mfa_session_id: mfaSessionId.value, backup_code: code } : { mfa_session_id: mfaSessionId.value, device_id: deviceId, code };
+      const response = await fetch(endpoint, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(body)
+      });
+      if (!response.ok) {
+        const errorText = await response.text();
+        let errorMessage = "MFA verification failed";
+        try {
+          const errorData = JSON.parse(errorText);
+          errorMessage = errorData.message || errorData.error || errorText;
+        } catch {
+          errorMessage = errorText || "MFA verification failed";
+        }
+        throw new Error(errorMessage);
+      }
+      const authData = await response.json();
+      mfaRequired.value = false;
+      mfaSessionId.value = null;
+      availableMfaMethods.value = [];
+      await setAuthData(authData);
+      return authData;
+    } finally {
+      loadingStates.value.verifyingMfa = false;
+    }
+  };
+  const sendMfaEmailCode = async (deviceId) => {
+    if (!mfaSessionId.value) {
+      throw new Error("No MFA session available");
+    }
+    loadingStates.value.sendingMfaEmail = true;
+    try {
+      const response = await fetch(getUrl("mfaSigninSendEmail"), {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          mfa_session_id: mfaSessionId.value,
+          device_id: deviceId
+        })
+      });
+      if (!response.ok) {
+        const errorText = await response.text();
+        let errorMessage = "Failed to send MFA email code";
+        try {
+          const errorData = JSON.parse(errorText);
+          errorMessage = errorData.message || errorData.error || errorText;
+        } catch {
+          errorMessage = errorText || "Failed to send MFA email code";
+        }
+        throw new Error(errorMessage);
+      }
+      const result = await response.json();
+      return result;
+    } finally {
+      loadingStates.value.sendingMfaEmail = false;
+    }
+  };
+  const getMfaWebAuthnChallenge = async (deviceId) => {
+    if (!mfaSessionId.value) {
+      throw new Error("No MFA session available");
+    }
+    const response = await fetch(getUrl("mfaWebAuthnChallenge"), {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        mfa_session_id: mfaSessionId.value,
+        device_id: deviceId
+      })
+    });
+    if (!response.ok) {
+      const errorText = await response.text();
+      let errorMessage = "Failed to get WebAuthn challenge";
+      try {
+        const errorData = JSON.parse(errorText);
+        errorMessage = errorData.message || errorData.error || errorText;
+      } catch {
+        errorMessage = errorText || errorMessage;
+      }
+      throw new Error(errorMessage);
+    }
+    return response.json();
+  };
+  const setAuthData = async (authResponse) => {
+    try {
+      if (authResponse.user) {
+        currentUser.value = mapApiUserToFrontend(authResponse.user);
+      }
+      const session = {
+        accessToken: authResponse.access_token,
+        refreshToken: authResponse.refresh_token,
+        expiresAt: new Date(Date.now() + 5 * 60 * 1e3),
+        // 5 minutes from now (matching API token expiry)
+        userId: currentUser.value?.id || authResponse.user?.id
+      };
+      currentSession.value = session;
+      if (typeof window !== "undefined") {
+        localStorage.setItem("strands_auth_session", JSON.stringify(session));
+        if (currentUser.value) {
+          localStorage.setItem("strands_auth_user", JSON.stringify(currentUser.value));
+        }
+      }
+      startTokenRefreshTimer();
+    } catch (error) {
+    }
+  };
+  const startTokenRefreshTimer = () => {
+    if (refreshTimer) {
+      clearTimeout(refreshTimer);
+    }
+    if (!currentSession.value) return;
+    if (typeof document !== "undefined" && document.visibilityState === "hidden") {
+      return;
+    }
+    const now = /* @__PURE__ */ new Date();
+    const expiresAt = currentSession.value.expiresAt;
+    const timeUntilRefresh = expiresAt.getTime() - now.getTime() - 1 * 60 * 1e3;
+    if (timeUntilRefresh <= 0) {
+      refreshToken();
+      return;
+    }
+    refreshTimer = setTimeout(async () => {
+      if (typeof document === "undefined" || document.visibilityState === "visible") {
+        const success = await refreshToken();
+        if (success) {
+          startTokenRefreshTimer();
+        }
+      }
+    }, timeUntilRefresh);
+  };
+  const stopTokenRefreshTimer = () => {
+    if (refreshTimer) {
+      clearTimeout(refreshTimer);
+      refreshTimer = null;
+    }
+  };
+  const initialize = async () => {
+    if (isInitialized.value) return;
+    loadingStates.value.initializing = true;
+    try {
+      if (typeof window !== "undefined") {
+        const storedSession = localStorage.getItem("strands_auth_session");
+        const storedUser = localStorage.getItem("strands_auth_user");
+        if (storedSession && storedUser) {
+          try {
+            const session = JSON.parse(storedSession);
+            const user = JSON.parse(storedUser);
+            session.expiresAt = new Date(session.expiresAt);
+            if (session.expiresAt > /* @__PURE__ */ new Date()) {
+              currentSession.value = session;
+              currentUser.value = user;
+              startTokenRefreshTimer();
+            } else {
+              localStorage.removeItem("strands_auth_session");
+              localStorage.removeItem("strands_auth_user");
+            }
+          } catch (error) {
+            localStorage.removeItem("strands_auth_session");
+            localStorage.removeItem("strands_auth_user");
+          }
+        }
+      }
+      isInitialized.value = true;
+      await new Promise((resolve) => setTimeout(resolve, 50));
+    } catch (error) {
+    } finally {
+      loadingStates.value.initializing = false;
+    }
+  };
+  const changeUsername = async (newUsername) => {
+    loadingStates.value.loadingProfile = true;
+    try {
+      const response = await fetch(getUrl("changeUsername"), {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "Authorization": `Bearer ${currentSession.value.accessToken}`
+        },
+        body: JSON.stringify({
+          username: newUsername
+        })
+      });
+      if (!response.ok) {
+        const errorData = await response.json().catch(() => ({}));
+        if (response.status === 409) {
+          throw new Error("Username is already taken");
+        } else if (errorData.cooldown_end) {
+          throw new Error(`You can only change your username once every 30 days. You can change it again on ${new Date(errorData.cooldown_end).toLocaleDateString()}`);
+        }
+        throw new Error(errorData.message || `Username change failed: ${response.status} ${response.statusText}`);
+      }
+      const result = await response.json();
+      if (currentUser.value) {
+        currentUser.value = {
+          ...currentUser.value,
+          username: newUsername,
+          usernameLastChangedAt: (/* @__PURE__ */ new Date()).toISOString(),
+          updatedAt: (/* @__PURE__ */ new Date()).toISOString()
+        };
+        if (typeof window !== "undefined") {
+          localStorage.setItem("strands_auth_user", JSON.stringify(currentUser.value));
+        }
+      }
+      return result;
+    } finally {
+      loadingStates.value.loadingProfile = false;
+    }
+  };
+  const getUsernameCooldown = async () => {
+    const response = await fetch(getUrl("usernameCooldown"), {
+      method: "GET",
+      headers: {
+        "Authorization": `Bearer ${currentSession.value.accessToken}`
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`Failed to get username cooldown: ${response.status} ${response.statusText}`);
+    }
+    return response.json();
+  };
+  const checkUsernameAvailability = async (username) => {
+    const url = getUrl("checkUsernameAvailability").replace("{username}", encodeURIComponent(username));
+    const response = await fetch(url, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json"
+      }
+    });
+    if (!response.ok) {
+      throw new Error(`Failed to check username availability: ${response.status} ${response.statusText}`);
+    }
+    return response.json();
+  };
+  const getUserSessions = async () => {
+    const cacheKey = `sessions:${currentSession.value?.accessToken?.slice(0, 20) || "no-token"}`;
+    try {
+      return await cachedFetch(cacheKey, async () => {
+        const headers = getAuthHeaders();
+        const response = await fetch(getUrl("sessions"), {
+          method: "GET",
+          headers
+        });
+        if (!response.ok) {
+          await response.text();
+          throw new Error(`Failed to get user sessions: ${response.status} ${response.statusText}`);
+        }
+        return response.json();
+      }, 2 * 60 * 1e3);
+    } catch (error) {
+      throw error;
+    }
+  };
+  const getSessionStats = async () => {
+    const response = await fetch(getUrl("sessionsStats"), {
+      method: "GET",
+      headers: getAuthHeaders()
+    });
+    if (!response.ok) {
+      throw new Error(`Failed to get session stats: ${response.status} ${response.statusText}`);
+    }
+    return response.json();
+  };
+  const revokeSession = async (sessionId) => {
+    const url = getUrl("sessionRevoke").replace("{session_id}", encodeURIComponent(sessionId));
+    const response = await fetch(url, {
+      method: "POST",
+      headers: getAuthHeaders()
+    });
+    if (!response.ok) {
+      throw new Error(`Failed to revoke session: ${response.status} ${response.statusText}`);
+    }
+    return response.status === 200;
+  };
+  const revokeAllOtherSessions = async () => {
+    const response = await fetch(getUrl("sessionsRevokeAll"), {
+      method: "POST",
+      headers: getAuthHeaders()
+    });
+    if (!response.ok) {
+      throw new Error(`Failed to revoke all other sessions: ${response.status} ${response.statusText}`);
+    }
+    return response.status === 200;
+  };
+  if (typeof document !== "undefined") {
+    document.addEventListener("visibilitychange", () => {
+      if (document.visibilityState === "visible" && currentSession.value) {
+        startTokenRefreshTimer();
+      } else if (document.visibilityState === "hidden") {
+        stopTokenRefreshTimer();
+      }
+    });
+  }
+  const cleanup = () => {
+    stopTokenRefreshTimer();
+    clearCache();
+    if (typeof document !== "undefined") {
+      document.removeEventListener("visibilitychange", () => {
+      });
+    }
+  };
+  try {
+    onUnmounted(cleanup);
+  } catch (e) {
+  }
+  if (!isInitialized.value) {
+    initialize();
+  }
+  return {
+    // State
+    user: computed(() => currentUser.value),
+    currentUser: computed(() => currentUser.value),
+    currentSession: computed(() => currentSession.value),
+    isAuthenticated,
+    isLoading: computed(() => isLoading.value || !isInitialized.value),
+    loading: computed(() => loading2.value),
+    loadingMessage,
+    // Specific loading states
+    isInitializing,
+    isSigningIn,
+    isSigningUp,
+    isSigningOut,
+    isRefreshingToken,
+    isSendingMfaEmail,
+    isVerifyingMfa,
+    // MFA State
+    mfaRequired: computed(() => mfaRequired.value),
+    mfaSessionId: computed(() => mfaSessionId.value),
+    availableMfaMethods: computed(() => availableMfaMethods.value),
+    // Methods
+    signIn,
+    signUp,
+    signOut,
+    refreshToken,
+    fetchProfile,
+    updateProfile,
+    updateUserSettings,
+    changeEmail,
+    changeUsername,
+    getUsernameCooldown,
+    checkUsernameAvailability,
+    // Session management
+    getUserSessions,
+    getSessionStats,
+    revokeSession,
+    revokeAllOtherSessions,
+    initialize,
+    setAuthData,
+    verifyMfa,
+    sendMfaEmailCode,
+    getMfaWebAuthnChallenge,
+    registerHardwareKey,
+    completeHardwareKeyRegistration,
+    // Token management
+    startTokenRefreshTimer,
+    stopTokenRefreshTimer,
+    getAuthHeaders,
+    // Force re-initialization (useful for testing or navigation)
+    forceReInit: () => {
+      isInitialized.value = false;
+      loadingStates.value.initializing = true;
+      initialize();
+    }
+  };
+}
+const mfaDevices = ref([]);
+const mfaEnabled = ref(false);
+const loading = ref(false);
+function useStrandsMfa() {
+  const { getUrl } = useStrandsConfig();
+  const { currentSession } = useStrandsAuth();
+  const hasMfaDevices = computed(() => mfaDevices.value.length > 0);
+  const activeMfaDevices = computed(
+    () => mfaDevices.value.filter(
+      (d) => d.is_active && d.device_type !== "hardware" && d.device_type !== "passkey"
+    )
+  );
+  const makeAuthenticatedRequest = async (url, options = {}) => {
+    const headers = {
+      "Content-Type": "application/json",
+      ...options.headers
+    };
+    if (currentSession.value?.accessToken) {
+      headers["Authorization"] = `Bearer ${currentSession.value.accessToken}`;
+    }
+    const response = await fetch(url, {
+      ...options,
+      headers
+    });
+    if (!response.ok) {
+      const errorText = await response.text();
+      let errorMessage = `Request failed: ${response.status} ${response.statusText}`;
+      try {
+        const errorData = JSON.parse(errorText);
+        errorMessage = errorData.message || errorMessage;
+      } catch {
+        if (errorText) {
+          errorMessage = errorText;
+        }
+      }
+      throw new Error(errorMessage);
+    }
+    return response.json();
+  };
+  const fetchMfaDevices = async () => {
+    loading.value = true;
+    try {
+      const response = await makeAuthenticatedRequest(getUrl("mfaDevices"), {
+        method: "GET"
+      });
+      mfaDevices.value = response.devices || [];
+      mfaEnabled.value = response.mfa_enabled || false;
+      return response;
+    } finally {
+      loading.value = false;
+    }
+  };
+  const setupTotp = async (deviceName) => {
+    loading.value = true;
+    try {
+      const response = await makeAuthenticatedRequest(getUrl("mfaTotpSetup"), {
+        method: "POST",
+        body: JSON.stringify({ device_name: deviceName })
+      });
+      await fetchMfaDevices();
+      return response;
+    } finally {
+      loading.value = false;
+    }
+  };
+  const verifyTotpSetup = async (deviceId, totpCode) => {
+    loading.value = true;
+    try {
+      await makeAuthenticatedRequest(getUrl("mfaTotpVerify"), {
+        method: "POST",
+        body: JSON.stringify({
+          device_id: deviceId,
+          totp_code: totpCode
+        })
+      });
+      await fetchMfaDevices();
+    } finally {
+      loading.value = false;
+    }
+  };
+  const setupEmailMfa = async (deviceName) => {
+    loading.value = true;
+    try {
+      const response = await makeAuthenticatedRequest(getUrl("mfaEmailSetup"), {
+        method: "POST",
+        body: JSON.stringify({ device_name: deviceName })
+      });
+      await fetchMfaDevices();
+      return response;
+    } finally {
+      loading.value = false;
+    }
+  };
+  const sendEmailMfaCode = async (deviceId) => {
+    loading.value = true;
+    try {
+      await makeAuthenticatedRequest(getUrl("mfaEmailSend"), {
+        method: "POST",
+        body: JSON.stringify({ device_id: deviceId })
+      });
+    } finally {
+      loading.value = false;
+    }
+  };
+  const verifyEmailMfaCode = async (deviceId, code) => {
+    loading.value = true;
+    try {
+      const response = await makeAuthenticatedRequest(getUrl("mfaEmailVerify"), {
+        method: "POST",
+        body: JSON.stringify({
+          device_id: deviceId,
+          code
+        })
+      });
+      return response.verified || false;
+    } finally {
+      loading.value = false;
+    }
+  };
+  const disableMfaDevice = async (deviceId) => {
+    loading.value = true;
+    try {
+      await makeAuthenticatedRequest(getUrl("mfaDeviceDisable"), {
+        method: "POST",
+        body: JSON.stringify({ device_id: deviceId })
+      });
+      await fetchMfaDevices();
+    } finally {
+      loading.value = false;
+    }
+  };
+  const regenerateBackupCodes = async (deviceId) => {
+    loading.value = true;
+    try {
+      const response = await makeAuthenticatedRequest(getUrl("mfaBackupCodes"), {
+        method: "POST",
+        body: JSON.stringify({ device_id: deviceId })
+      });
+      return response;
+    } finally {
+      loading.value = false;
+    }
+  };
+  const getDeviceTypeIcon = (deviceType) => {
+    switch (deviceType) {
+      case "totp":
+        return "📱";
+      // Authenticator app
+      case "email":
+        return "📧";
+      // Email
+      case "hardware":
+        return "🔑";
+      // Hardware key
+      case "passkey":
+        return "🔐";
+      // Passkey
+      default:
+        return "🔒";
+    }
+  };
+  const getDeviceTypeName = (deviceType) => {
+    switch (deviceType) {
+      case "totp":
+        return "Authenticator App";
+      case "email":
+        return "Email Verification";
+      case "hardware":
+        return "Hardware Key";
+      case "passkey":
+        return "Passkey";
+      default:
+        return "Unknown";
+    }
+  };
+  const formatLastUsed = (lastUsedAt) => {
+    if (!lastUsedAt) return "Never";
+    const date = new Date(lastUsedAt);
+    const now = /* @__PURE__ */ new Date();
+    const diffMs = now.getTime() - date.getTime();
+    const diffDays = Math.floor(diffMs / (1e3 * 60 * 60 * 24));
+    if (diffDays === 0) return "Today";
+    if (diffDays === 1) return "Yesterday";
+    if (diffDays < 30) return `${diffDays} days ago`;
+    return date.toLocaleDateString();
+  };
+  return {
+    // State
+    mfaDevices: computed(() => mfaDevices.value),
+    mfaEnabled: computed(() => mfaEnabled.value),
+    loading: computed(() => loading.value),
+    hasMfaDevices,
+    activeMfaDevices,
+    // Methods
+    fetchMfaDevices,
+    setupTotp,
+    verifyTotpSetup,
+    setupEmailMfa,
+    sendEmailMfaCode,
+    verifyEmailMfaCode,
+    disableMfaDevice,
+    regenerateBackupCodes,
+    // Helper methods
+    getDeviceTypeIcon,
+    getDeviceTypeName,
+    formatLastUsed
+  };
+}
+const providersCache = /* @__PURE__ */ new Map();
+const CACHE_DURATION = 5 * 60 * 1e3;
+function useOAuthProviders(options = {}) {
+  const { getUrl, config } = useStrandsConfig();
+  const providers = ref([]);
+  const loading2 = ref(false);
+  const error = ref(null);
+  const enabledProviders = computed(
+    () => providers.value.filter((provider) => provider.enabled)
+  );
+  const fetchProviders = async () => {
+    const cacheKey = JSON.stringify(options);
+    const cached = providersCache.get(cacheKey);
+    if (cached && Date.now() - cached.timestamp < CACHE_DURATION) {
+      providers.value = cached.data;
+      return cached.data;
+    }
+    loading2.value = true;
+    error.value = null;
+    try {
+      let url = getUrl("oauthProviders");
+      const redirectUrl = options.redirectUrl || config.value?.oauth2RedirectUrl;
+      if (redirectUrl) {
+        const params = new URLSearchParams();
+        let absoluteRedirectUrl = redirectUrl;
+        if (redirectUrl.startsWith("/")) {
+          const currentOrigin = window.location.origin;
+          absoluteRedirectUrl = `${currentOrigin}${redirectUrl}`;
+        }
+        params.append("redirect_url", absoluteRedirectUrl);
+        url = `${url}?${params.toString()}`;
+      }
+      const response = await fetch(url, {
+        method: "GET",
+        headers: {
+          "Content-Type": "application/json"
+        }
+      });
+      if (!response.ok) {
+        const errorData = await response.json().catch(() => ({}));
+        throw new Error(errorData.error?.message || `HTTP ${response.status}: ${response.statusText}`);
+      }
+      const result = await response.json();
+      providers.value = result.providers || [];
+      providersCache.set(cacheKey, {
+        data: providers.value,
+        timestamp: Date.now()
+      });
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : "Failed to fetch OAuth providers";
+      error.value = errorMessage;
+    } finally {
+      loading2.value = false;
+    }
+  };
+  const getProviderAuthUrl = async (providerId, customOptions) => {
+    const mergedOptions = { ...options, ...customOptions };
+    const params = new URLSearchParams();
+    if (mergedOptions.redirectUrl) {
+      let absoluteRedirectUrl = mergedOptions.redirectUrl;
+      if (mergedOptions.redirectUrl.startsWith("/")) {
+        const currentOrigin = window.location.origin;
+        absoluteRedirectUrl = `${currentOrigin}${mergedOptions.redirectUrl}`;
+      }
+      params.append("redirect_url", absoluteRedirectUrl);
+    }
+    if (mergedOptions.scopes && mergedOptions.scopes.length > 0) {
+      params.append("scopes", mergedOptions.scopes.join(","));
+    }
+    const queryString = params.toString();
+    const providerUrl = getUrl("oauthProvider").replace("{provider_id}", providerId);
+    const fullUrl = queryString ? `${providerUrl}?${queryString}` : providerUrl;
+    try {
+      const response = await fetch(fullUrl, {
+        method: "GET",
+        headers: {
+          "Content-Type": "application/json"
+        }
+      });
+      if (!response.ok) {
+        const errorData = await response.json().catch(() => ({}));
+        throw new Error(errorData.error?.message || `HTTP ${response.status}: ${response.statusText}`);
+      }
+      const result = await response.json();
+      if (!result.success) {
+        throw new Error(result.error?.message || "Failed to get OAuth auth URL");
+      }
+      return result.data.authUrl;
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : "Failed to get OAuth auth URL";
+      throw new Error(errorMessage);
+    }
+  };
+  const redirectToProvider = async (providerId, customOptions) => {
+    try {
+      const provider = providers.value.find((p) => p.id === providerId);
+      if (!provider) {
+        throw new Error(`OAuth provider '${providerId}' not found`);
+      }
+      if (!provider.auth_url) {
+        throw new Error(`No auth URL configured for provider '${providerId}'`);
+      }
+      window.location.href = provider.auth_url;
+    } catch (err) {
+      error.value = err instanceof Error ? err.message : "Failed to redirect to OAuth provider";
+      throw err;
+    }
+  };
+  const getProviderById = (providerId) => {
+    return providers.value.find((provider) => provider.id === providerId);
+  };
+  const getProviderIcon = (provider) => {
+    if (provider.iconUrl) {
+      return provider.iconUrl;
+    }
+    switch (provider.id.toLowerCase()) {
+      case "google":
+        return "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9IiM0Mjg1RjQiIGQ9Ik0yMi41NiAxMi4yNWMwLS43OC0uMDctMS41My0uMi0yLjI1SDEydjQuMjZoNS45MmMtLjI2IDEuMzctMS4wNCAyLjUzLTIuMjEgMy4zMXYyLjc3aDMuNTdjMi4wOC0xLjkyIDMuMjgtNC43NCAzLjI4LTguMDl6Ii8+PHBhdGggZmlsbD0iIzM0QTg1MyIgZD0iTTEyIDIzYzIuOTcgMCA1LjQ2LS45OCA3LjI4LTIuNjZsLTMuNTctMi43N2MtLjk4LjY2LTIuMjMgMS4wNi0zLjcxIDEuMDYtMi44NiAwLTUuMjktMS45My02LjE2LTQuNTNIMi4xOHYyLjg0QzMuOTkgMjAuNTMgNy43IDIzIDEyIDIzeiIvPjxwYXRoIGZpbGw9IiNGQkJDMDUiIGQ9Ik01Ljg0IDE0LjA5Yy0uMjItLjY2LS4zNS0xLjM2LS4zNS0yLjA5cy4xMy0xLjQzLjM1LTIuMDlWNy4wN0gyLjE4QzEuNDMgOC41NSAxIDEwLjIyIDEgMTJzLjQzIDMuNDUgMS4xOCA0LjkzbDIuODUtMi4yMi44MS0uNjJ6Ii8+PHBhdGggZmlsbD0iI0VBNDMzNSIgZD0iTTEyIDUuMzhjMS42MiAwIDMuMDYuNTYgNC4yMSAxLjY0bDMuMTUtMy4xNUMxNy40NSAyLjA5IDE0Ljk3IDEgMTIgMSA3LjcgMSAzLjk5IDMuNDcgMi4xOCA3LjA3bDMuNjYgMi44NGMuODctMi42IDMuMy00LjUzIDYuMTYtNC41M3oiLz48L3N2Zz4=";
+      case "github":
+        return "data:image/svg+xml;base64,PHN2ZyBmaWxsPSJjdXJyZW50Q29sb3IiIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZD0iTTEyIDBoLTEyYy02LjYyNiAwLTEyIDUuMzczLTEyIDEyIDAgNS4zMDIgMy40MzggOS44IDguMjA3IDExLjM4Ny41OTkuMTExLjc5My0uMjYxLjc5My0uNTc3di0yLjIzNGMtMy4zMzguNzI2LTQuMDMzLTEuNDE2LTQuMDMzLTEuNDE2LS41NDYtMS4zODctMS4zMzMtMS43NTYtMS4zMzMtMS43NTYtMS4wODktLjc0NS4wODMtLjcyOS4wODMtLjcyOSAxLjIwNS4wODQgMS44MzkgMS4yMzcgMS44MzkgMS4yMzcgMS4wNyAxLjgzNCAyLjgwNyAxLjMwNCAzLjQ5Mi45OTcuMTA3LS43NzUuNDE4LTEuMzA1Ljc2Mi0xLjYwNC0yLjY2NS0uMzA1LTUuNDY3LTEuMzM0LTUuNDY3LTUuOTMxIDAtMS4zMTEuNDY5LTIuMzgxIDEuMjM2LTMuMjIxLS4xMjQtLjMwMy0uNTM1LTEuNTI0LjExNy0zLjE3NiAwIDAgMS4wMDgtLjMyMiAzLjMwMSAxLjIzLjk1Ny0uMjY2IDEuOTgzLS4zOTkgMy4wMDMtLjQwNCAxLjAyLjAwNSAyLjA0Ny4xMzggMy4wMDYuNDA0IDIuMjkxLTEuNTUyIDMuMjk3LTEuMjMgMy4yOTctMS4yMy42NTMgMS42NTMuMjQyIDIuODc0LjExOCAzLjE3Ni43Ny44NCAxLjIzNSAxLjkxMSAxLjIzNSAzLjIyMSAwIDQuNjA5LTIuODA3IDUuNjI0LTUuNDc5IDUuOTIxLjQzLjM3Mi44MjMgMS4xMDIuODIzIDIuMjIydjMuMjkzYzAgLjMxOS4xOTIuNjk0LjgwMS41NzYgNC43NjUtMS41ODkgOC4xOTktNi4wODYgOC4xOTktMTEuMzg2IDAtNi42MjctNS4zNzMtMTItMTItMTJ6Ii8+PC9zdmc+";
+      case "microsoft":
+      case "azure":
+        return "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiPjxyZWN0IGZpbGw9IiNmMjUwMjIiIHdpZHRoPSIxMSIgaGVpZ2h0PSIxMSIvPjxyZWN0IGZpbGw9IiM3ZmJhMDAiIHg9IjEzIiB3aWR0aD0iMTEiIGhlaWdodD0iMTEiLz48cmVjdCBmaWxsPSIjMDBhNGVmIiB5PSIxMyIgd2lkdGg9IjExIiBoZWlnaHQ9IjExIi8+PHJlY3QgZmlsbD0iI2ZmYjkwMCIgeD0iMTMiIHk9IjEzIiB3aWR0aD0iMTEiIGhlaWdodD0iMTEiLz48L3N2Zz4=";
+      case "discord":
+        return "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9IiM1ODY1RjIiPjxwYXRoIGQ9Ik0yMC4zMTcgNC4zNjk2QTE5Ljc5MTMgMTkuNzkxMyAwIDAgMCAxOC4yMDU4IDMuMzY5NmMtLjk2NDIuMzU2NC0xLjk5NTguNjE1NC0zLjA1OC43NzNhMTQuNzI0NCAxNC43MjQ0IDAgMCAwLTYuMjk1NCAwIDEzLjU0OTQgMTMuNTQ5NCAwIDAgMC0zLjA1OC0uNzczIDEzLjY5MyAxMy42OTMgMCAwIDAtNS4wNjc2LTEuMjc5NCAyMC4xOTg0IDIwLjE5ODQgMCAwIDAtMi42NDk3IDkuMTE2MyAyMC4yODE4IDIwLjI4MTggMCAwIDAgMi4zNzU4IDIuNjNjMS4zMzIyLjEyNTggMi42NjUuMTcyMiA0LjA0NC4xNzIyaDEuMzE1NGMxLjM3OSAwIDIuNzExOC0uMDQ2NCA0LjA0NC0uMTcyMmEyMC4yODE4IDIwLjI4MTggMCAwIDAgMi4zNzU4LTIuNjMgMjAuMTk4NCAyMC4xOTg0IDAgMCAwIDIuNjQ5Ny05LjExNjNBMTkuNzkxMyAxOS43OTEzIDAgMCAwIDIwLjMxNyA0LjM2OTZ6TTE4LjE5IDEyQzE3LjY3IDE0LjQ5IDEzLjk5IDE2IDEyIDE2UzYuMzMgMTQuNDkgNS44MSAxMmMuNTItMi40OSA0LjE5LTQgNi4xOS00UzE3LjY3IDkuNTEgMTguMTkgMTJ6Ii8+PC9zdmc+";
+      default:
+        return "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9ImN1cnJlbnRDb2xvciI+PGNpcmNsZSBjeD0iMTIiIGN5PSIxMiIgcj0iMTAiLz48dGV4dCB4PSIxMiIgeT0iMTciIHRleHQtYW5jaG9yPSJtaWRkbGUiIGZpbGw9IndoaXRlIiBmb250LXNpemU9IjEyIj57cHJvdmlkZXIuaWQuY2hhckF0KDApLnRvVXBwZXJDYXNlKCl9PC90ZXh0Pjwvc3ZnPg==";
+    }
+  };
+  return {
+    providers: computed(() => providers.value),
+    enabledProviders,
+    loading: computed(() => loading2.value),
+    error: computed(() => error.value),
+    fetchProviders,
+    getProviderAuthUrl,
+    redirectToProvider,
+    getProviderById,
+    getProviderIcon
+  };
+}
+function useAuthenticatedFetch() {
+  const { config } = useStrandsConfig();
+  const { currentSession, refreshToken, getAuthHeaders } = useStrandsAuth();
+  const authenticatedFetch = async (url, options = {}) => {
+    const {
+      autoRefresh = true,
+      requireAuth = true,
+      baseURL,
+      ...fetchOptions
+    } = options;
+    if (requireAuth && !currentSession.value?.accessToken) {
+      throw new Error("User is not authenticated");
+    }
+    let fullUrl = url;
+    const resolvedBaseURL = baseURL || config.value.baseUrl;
+    if (resolvedBaseURL && typeof url === "string" && !url.startsWith("http")) {
+      fullUrl = new URL(url, resolvedBaseURL).toString();
+    }
+    const headers = new Headers(fetchOptions.headers);
+    if (currentSession.value?.accessToken) {
+      try {
+        const authHeaders = getAuthHeaders();
+        Object.entries(authHeaders).forEach(([key, value]) => {
+          headers.set(key, value);
+        });
+      } catch (error) {
+        console.warn("[Strands Auth] Failed to get auth headers:", error);
+        if (requireAuth) {
+          throw error;
+        }
+      }
+    }
+    const enhancedOptions = {
+      ...fetchOptions,
+      headers
+    };
+    let response = await fetch(fullUrl, enhancedOptions);
+    if (response.status === 401 && autoRefresh && currentSession.value?.refreshToken) {
+      console.log("[Strands Auth] Request failed with 401, attempting token refresh...");
+      try {
+        const refreshed = await refreshToken();
+        if (refreshed && currentSession.value?.accessToken) {
+          const newAuthHeaders = getAuthHeaders();
+          Object.entries(newAuthHeaders).forEach(([key, value]) => {
+            headers.set(key, value);
+          });
+          console.log("[Strands Auth] Retrying request with refreshed token");
+          response = await fetch(fullUrl, { ...enhancedOptions, headers });
+        }
+      } catch (refreshError) {
+        console.error("[Strands Auth] Token refresh failed:", refreshError);
+      }
+    }
+    return response;
+  };
+  const get = (url, options) => {
+    return authenticatedFetch(url, { ...options, method: "GET" });
+  };
+  const post = (url, body, options) => {
+    const headers = new Headers(options?.headers);
+    if (body && typeof body === "object" && !headers.has("Content-Type")) {
+      headers.set("Content-Type", "application/json");
+    }
+    return authenticatedFetch(url, {
+      ...options,
+      method: "POST",
+      headers,
+      body: typeof body === "object" ? JSON.stringify(body) : body
+    });
+  };
+  const put = (url, body, options) => {
+    const headers = new Headers(options?.headers);
+    if (body && typeof body === "object" && !headers.has("Content-Type")) {
+      headers.set("Content-Type", "application/json");
+    }
+    return authenticatedFetch(url, {
+      ...options,
+      method: "PUT",
+      headers,
+      body: typeof body === "object" ? JSON.stringify(body) : body
+    });
+  };
+  const del = (url, options) => {
+    return authenticatedFetch(url, { ...options, method: "DELETE" });
+  };
+  const patch = (url, body, options) => {
+    const headers = new Headers(options?.headers);
+    if (body && typeof body === "object" && !headers.has("Content-Type")) {
+      headers.set("Content-Type", "application/json");
+    }
+    return authenticatedFetch(url, {
+      ...options,
+      method: "PATCH",
+      headers,
+      body: typeof body === "object" ? JSON.stringify(body) : body
+    });
+  };
+  return {
+    authenticatedFetch,
+    get,
+    post,
+    put,
+    delete: del,
+    patch
+  };
+}
+const $authFetch = {
+  get: async (url, options) => {
+    const { get } = useAuthenticatedFetch();
+    return get(url, options);
+  },
+  post: async (url, body, options) => {
+    const { post } = useAuthenticatedFetch();
+    return post(url, body, options);
+  },
+  put: async (url, body, options) => {
+    const { put } = useAuthenticatedFetch();
+    return put(url, body, options);
+  },
+  delete: async (url, options) => {
+    const { delete: del } = useAuthenticatedFetch();
+    return del(url, options);
+  },
+  patch: async (url, body, options) => {
+    const { patch } = useAuthenticatedFetch();
+    return patch(url, body, options);
+  }
+};
+export {
+  $authFetch as $,
+  STRANDS_AUTH_DEFAULTS as S,
+  useStrandsMfa as a,
+  useStrandsAuth as b,
+  useOAuthProviders as c,
+  useGlobalDarkMode as d,
+  useAuthenticatedFetch as e,
+  provideStrandsConfig as p,
+  setStrandsConfig as s,
+  useStrandsConfig as u
+};