@ciromaciel/auth-react 1.0.0

package/dist/index.esm.js

@@ -0,0 +1,3531 @@
+import { create } from 'zustand';
+import { useState, useCallback, useEffect, useMemo, createContext } from 'react';
+import { useShallow } from 'zustand/react/shallow';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { Navigate, Outlet, useNavigate } from 'react-router-dom';
+import { Modal, Stack, Text, Group, Image, Title, Paper, Divider, Button, TextInput, Loader, Anchor, Center, Box, Avatar, Collapse, FileButton, Tooltip, ThemeIcon, Badge, rem, ActionIcon } from '@mantine/core';
+import { useForm } from '@mantine/form';
+import { IconBrandGoogle, IconArrowRight, IconUser, IconPhoto, IconTrash, IconCheck, IconPencil, IconMail, IconShield, IconDevices, IconDeviceMobile, IconLogout, IconUserCircle, IconSettings, IconCreditCard, IconShieldCheck } from '@tabler/icons-react';
+
+/**
+ * The identity switch — when the panel stops being one person and becomes
+ * another in the middle of a live session.
+ *
+ * It happens in both directions of an impersonation: entering (the response
+ * carries a `Set-Cookie` that changes who the server sees in that instant) and
+ * leaving (by the button, by the clock, or because another tab ended it). In
+ * every case the panel stays mounted for a short interval until the navigation
+ * — and during that interval the mounted screens refetch holding the old
+ * identity.
+ *
+ * The server answers those calls with 403 and 401, and it is right to: they are
+ * another person's resources, or a session that stopped being valid. What is
+ * wrong is SHOWING it — on screen it read as "Acesso negado: Sem permissão para
+ * esta organização" in the middle of a switch that was working.
+ *
+ * The flag lives on `window` because whoever sets it (the SDK) and whoever reads
+ * it (each panel's HTTP client) do not share a module. It is never turned off:
+ * the whole page is replaced right after, and `window` dies with it.
+ *
+ * Exported by the package so any panel can mark its own switches — the Auth
+ * panel marks the START of an impersonation, a moment only it knows about.
+ */
+
+const FLAG = '__riligarSwitchingIdentity';
+
+/**
+ * The event that announces: the person behind this session changed.
+ *
+ * The SDK knows WHEN the identity switches, but not what each panel keeps — and
+ * they all keep something account-shaped. The Auth panel persists the selected
+ * organization, and it was that persistence surviving the reload that made the
+ * panel ask for `/applications/<the operator's organization>` already as the
+ * target. The server refused with 403, correctly, and the screen showed "Acesso
+ * negado" AFTER the switch had finished — outside any transition window, which
+ * is why silencing the interceptor never fixed it.
+ *
+ * Each panel listens and clears what is its own. The SDK needs to know no key,
+ * and a new panel that persists something solves its own case without touching
+ * this file.
+ *
+ * Fired by `markIdentitySwitching`, which every identity switch already goes
+ * through — so a client of this package gets it by listening, with no call of
+ * its own to make and no knowledge of when a switch happens.
+ */
+const IDENTITY_CHANGED_EVENT = 'riligar:identity-changed';
+
+/**
+ * Announces the switch, giving listeners a chance to clear before the reload.
+ *
+ * Synchronous on purpose: `dispatchEvent` only returns once every listener has
+ * run, so the caller can reload on the next line knowing storage is already
+ * clean.
+ */
+function announceIdentityChange(detail) {
+  try {
+    window.dispatchEvent(new CustomEvent(IDENTITY_CHANGED_EVENT, {
+      detail
+    }));
+  } catch {
+    // No `window` (SSR, tests): there is no panel to notify.
+  }
+}
+
+/**
+ * Everything a panel remembers about an account, wiped on every switch.
+ *
+ * ALLOWLIST, NOT BLOCKLIST — and that is the whole point.
+ *
+ * The seven panels each persist something account-shaped, under names that
+ * follow no single pattern: `organizations` (the selected company),
+ * `hoster:pinned`, `rlg-payments-project-storage`,
+ * `riligar_storage_active_tenant`, per-product API keys. Listing them would be
+ * a blocklist, and a blocklist is wrong here in the way that hurts: a panel
+ * that persists something new is silently left out, and the next person to open
+ * that tab sees another account's data with nobody's name on it.
+ *
+ * So the rule is inverted. Everything goes, except the few keys that are about
+ * the BROWSER rather than about the person — the session token, which the SDK
+ * manages itself and rewrites on the next load, and per-device preferences that
+ * carry no account data.
+ *
+ * Dropping the rest costs a refetch. Keeping it costs showing one person's data
+ * under another person's name, which cannot be undone after it is on screen.
+ */
+const KEEP = new Set([
+// The SDK's own slot: cleared where it must be (ending an impersonation),
+// and rewritten from the shared cookie on the next load. Wiping it here too
+// would sign the operator out of a tab that only needed to forget the
+// target's lists.
+'auth:token',
+// Cross-tab logout beacon. It is a timestamp, not account data, and clearing
+// it would break the very synchronisation this file exists to serve.
+'auth:logout',
+// The switch beacon: a timestamp the sibling tabs listen for. Wiping it
+// would make the NEXT write look unchanged to the browser in some cases,
+// and the event that carries the switch would not fire.
+'auth:identity-switched']);
+function dropStoredAccountState() {
+  try {
+    const doomed = [];
+    for (let i = 0; i < window.localStorage.length; i++) {
+      const k = window.localStorage.key(i);
+      if (k && !KEEP.has(k)) doomed.push(k);
+    }
+    for (const k of doomed) window.localStorage.removeItem(k);
+
+    // `sessionStorage` too: it survives a reload in the same tab, which is
+    // exactly the window this function exists to close.
+    window.sessionStorage?.clear();
+  } catch {
+    // No storage (SSR, private window, blocked cookies): there is nothing
+    // persisted to leak.
+  }
+}
+
+/**
+ * The beacon sibling tabs listen for.
+ *
+ * `storage` only fires in OTHER tabs of the same origin, and only when a value
+ * actually changes — so a timestamp is what turns "this tab switched identity"
+ * into an event the siblings receive. The SDK writes it, the SDK reads it
+ * (`AuthProvider`), and every panel that mounts the provider follows along
+ * without writing a line: that is what makes it work for our own seven panels
+ * and for anyone else's app on the same footing.
+ *
+ * It cannot reach ANOTHER origin — no browser mechanism can. Those tabs catch up
+ * through the poll, which asks the server on its own schedule.
+ */
+const SWITCH_BEACON = 'auth:identity-switched';
+function markIdentitySwitching() {
+  try {
+    window[FLAG] = true;
+  } catch {
+    // No `window` (SSR, tests): there is no panel to notify.
+  }
+  try {
+    // Written BEFORE the wipe below, because the wipe removes it again —
+    // and it is the write itself, not the value, that the siblings hear.
+    window.localStorage.setItem(SWITCH_BEACON, String(Date.now()));
+  } catch {
+    // No storage: the sibling tabs fall back to the poll.
+  }
+  // Applies to EVERY identity switch — entering and leaving an impersonation —
+  // because in both directions everything remembered starts belonging to
+  // another account.
+  dropStoredAccountState();
+
+  /*
+   * Wiping storage is not enough on its own: a store that keeps its state in
+   * MEMORY and only mirrors it to storage — every `zustand/persist` store is
+   * one — survives the wipe untouched, and rewrites the old value on its next
+   * `set()`. That is the whole bug this event exists for: the Auth panel's
+   * selected organization stayed in memory across the switch, and the screen
+   * asked for `/applications/<the target's organization>` as the operator,
+   * which the server refused with 403 — correctly.
+   *
+   * Announced LAST, so a listener that reads storage sees it already clean.
+   */
+  announceIdentityChange({
+    reason: 'switch'
+  });
+}
+function clearIdentitySwitching() {
+  try {
+    window[FLAG] = false;
+  } catch {
+    // Same reasoning as above.
+  }
+}
+function isIdentitySwitching() {
+  try {
+    return Boolean(window[FLAG]);
+  } catch {
+    return false;
+  }
+}
+
+/**
+ * Should a 401 sign the person out — or is it the expected 401 of a switch?
+ *
+ * Every panel's HTTP client reacts to a 401 by signing out. On the server that
+ * `signOut` deletes EVERY session of the person's e-mail across all products
+ * (one account, one e-mail, many application rows) — the right thing for a real
+ * "sign out everywhere", and a catastrophe for a transient 401.
+ *
+ * Leaving an impersonation keeps the panel mounted for a moment while it
+ * reloads, and calls already in flight carry the dying impersonation token. The
+ * server answers 401, correctly. Acting on THAT 401 signed the operator out of
+ * everything — the account came back for a second and was then wiped by its own
+ * panel. Exiting from the Auth tab happened to dodge it; exiting from Functions,
+ * Monitors or Hoster did not, which is why it looked panel-specific.
+ *
+ * Pure and exported so each panel shares one decision instead of three copies of
+ * an inline `&& !isIdentitySwitching()`, and so a single test covers all of
+ * them. Pass the flag in (do not read it here) to keep it testable without a
+ * `window`.
+ */
+function shouldSignOutOn401(switching) {
+  return !switching;
+}
+
+// The default this package resolves to when an integration does not pass a URL.
+// It ships inside the published bundle, so a stale value here fails on the
+// customer's machine, not on ours.
+let API_BASE = 'https://auth.worker.myinfrastructure.click';
+let API_KEY = null;
+let INTERNAL_MODE = false; // Internal mode: no API key required (same-domain apps)
+
+// Permite configurar API key e modo interno externamente (chamado pelo AuthProvider)
+function configure({
+  apiKey,
+  apiUrl,
+  internal = false
+}) {
+  if (apiKey) API_KEY = apiKey;
+  if (apiUrl) API_BASE = apiUrl.endsWith('/') ? apiUrl.slice(0, -1) : apiUrl;
+  INTERNAL_MODE = internal;
+}
+const isInternal = () => INTERNAL_MODE;
+
+/** A URL da API de autenticação em uso. É a origem confiável por definição. */
+const getApiUrl = () => API_BASE;
+
+/** A chave onde o token de sessão é guardado. Exposta para quem precisa lê-lo. */
+const TOKEN_STORAGE_KEY = 'auth:token';
+
+// helper fetch pré-configurado
+async function api(route, opts = {}) {
+  // Garante que a rota comece com /
+  const cleanRoute = route.startsWith('/') ? route : `/${route}`;
+
+  // Constrói URL completa (API_BASE já teve trailing slash removido no configure)
+  const url = `${API_BASE}${cleanRoute}`;
+  const token = getStoredToken();
+  const headers = {
+    'Content-Type': 'application/json',
+    Accept: 'application/json',
+    ...opts.headers
+  };
+
+  // Adiciona Authorization header se tiver token
+  if (token) {
+    headers.Authorization = `Bearer ${token}`;
+  }
+
+  // Adiciona API Key se configurada e não estiver em modo interno
+  if (API_KEY && !INTERNAL_MODE) {
+    headers['X-API-Key'] = API_KEY;
+  }
+  const res = await fetch(url, {
+    headers,
+    credentials: 'include',
+    // Required for sending session cookies
+    ...opts
+  });
+
+  // Converte JSON automaticamente e lança erro legível
+  const data = res.status !== 204 ? await res.json().catch(() => ({})) : null;
+  if (!res.ok) {
+    /*
+     * O contrato: `{error: {code, message, details?}}`.
+     *
+     * `code` é o identificador estável — programe contra ele. `message` é
+     * a frase para o humano e pode mudar de redação a qualquer momento.
+     * `details` traz o que dá para agir (o limite estourado, o campo que
+     * faltou), e vai no Error para quem trata sem precisar do corpo.
+     */
+    const payloadError = data?.error;
+    const failure = new Error(payloadError?.message || res.statusText);
+    failure.res = res;
+    failure.data = data;
+    failure.status = res.status;
+    failure.code = payloadError?.code ?? null;
+    failure.details = payloadError?.details ?? null;
+    failure.retriable = Boolean(payloadError?.retriable);
+    throw failure;
+  }
+  return data;
+}
+
+// Gerenciamento de token no localStorage
+function getStoredToken() {
+  if (typeof window === 'undefined') return null;
+  return window.localStorage.getItem(TOKEN_STORAGE_KEY);
+}
+
+// Exportada: o store precisa DESCARTAR o token quando o servidor não
+// reconhece a sessão. Sem isso, um valor obsoleto sobrevive no localStorage e
+// o handoff do OAuth o envia no `#token=`, derrubando a autorização.
+function setStoredToken(token) {
+  if (typeof window === 'undefined') return;
+  if (token) {
+    window.localStorage.setItem(TOKEN_STORAGE_KEY, token);
+  } else {
+    window.localStorage.removeItem(TOKEN_STORAGE_KEY);
+  }
+}
+// Helper para processar resposta de autenticação e salvar token
+function handleAuthResponse(result) {
+  // Tenta encontrar o token em vários lugares possíveis
+  const token = result.token || result.session?.token || result.session?.sessionToken;
+  if (token) {
+    setStoredToken(token);
+  }
+  return result;
+}
+
+// Decodifica JWT (apenas payload, sem verificação de assinatura)
+function decodeJWT(token) {
+  try {
+    const parts = token.split('.');
+    if (parts.length !== 3) return null;
+
+    // Safe base64 decode
+    const base64Url = parts[1];
+    const base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
+
+    // Verifica ambiente para decodificar
+    const jsonPayload = typeof window !== 'undefined' ? window.atob(base64) : Buffer.from(base64, 'base64').toString();
+    return JSON.parse(jsonPayload);
+  } catch {
+    return null;
+  }
+}
+
+// Verifica se o token está expirado
+function isTokenExpired(token) {
+  const payload = decodeJWT(token);
+
+  // Se não for um JWT válido (payload null), assumimos que é um token opaco (session token)
+  // Nesse caso, deixamos o servidor validar via 401
+  if (!payload) return false;
+  if (!payload.exp) return false;
+  const now = Date.now();
+  const exp = payload.exp * 1000;
+  const isExpired = now >= exp;
+  if (isExpired) {
+    console.log('[AuthSDK] Token expired:', {
+      now,
+      exp,
+      diff: exp - now
+    });
+  }
+  return isExpired;
+}
+
+// Verifica se o usuário está autenticado
+function isAuthenticated() {
+  const token = getStoredToken();
+  const valid = token && !isTokenExpired(token);
+  return valid;
+}
+
+// Obtém dados do usuário do token
+function getCurrentUser() {
+  const token = getStoredToken();
+  if (!token || isTokenExpired(token)) return null;
+  const payload = decodeJWT(token);
+  return payload ? {
+    id: payload.sub,
+    email: payload.email,
+    name: payload.name,
+    ...payload
+  } : null;
+}
+
+/*--- sign in: ask for the code, trade the code ----*/
+//
+// These are the only two calls that authenticate. There is no separate sign-up:
+// someone who never signed in and someone who already did walk exactly the same
+// path, and `requestCode`'s answer is the same in both cases — it does not tell
+// whether the email already had an account.
+
+/**
+ * Asks for the sign-in code. The email goes out right away; the response does
+ * not wait for it.
+ *
+ * @param {string} email
+ * @param {{ name?: string }} [options] Name used only if the account is created now.
+ * @returns {Promise<{ sent: boolean, expiresIn: number, interval: number, deviceCode: string }>}
+ */
+const requestCode = async (email, {
+  name
+} = {}) => {
+  return await api('/auth/code/start', {
+    method: 'POST',
+    body: JSON.stringify({
+      email,
+      ...(name ? {
+        name
+      } : {})
+    })
+  });
+};
+
+/**
+ * Trades the code for the session. This is the whole sign-in.
+ *
+ * @param {string} email The same email that asked for the code.
+ * @param {string} code As the person typed it — case, spaces and the hyphen are optional.
+ * @returns {Promise<{ user: object, token: string, session: object }>}
+ */
+const verifyCode = async (email, code) => {
+  const result = await api('/auth/code/verify', {
+    method: 'POST',
+    body: JSON.stringify({
+      email,
+      code
+    })
+  });
+  return handleAuthResponse(result);
+};
+
+/**
+ * Variant for whoever CANNOT read the email — an agent waiting for someone else
+ * to present the code. Returns `{ pending: true, interval }` while nobody has
+ * approved; in the browser, use `verifyCode`.
+ *
+ * @param {string} deviceCode The value returned by `requestCode`.
+ */
+const pollCode = async deviceCode => {
+  try {
+    const result = await api('/auth/code/poll', {
+      method: 'POST',
+      body: JSON.stringify({
+        deviceCode
+      })
+    });
+    return handleAuthResponse(result);
+  } catch (error) {
+    // 428/429 are not failures: they mean "not yet" and "slow down".
+    // Whoever polls needs to tell those apart from a dead code, which is a
+    // real error.
+    if (error?.status === 428 || error?.status === 429) {
+      return {
+        pending: true,
+        interval: error?.details?.interval ?? 5
+      };
+    }
+    throw error;
+  }
+};
+const signOut = async () => {
+  try {
+    await api('/auth/sign-out', {
+      method: 'POST'
+    });
+  } catch {
+    // Ignores sign-out errors on the server
+  } finally {
+    setStoredToken(null);
+  }
+};
+const refreshToken = async () => {
+  try {
+    const result = await api('/auth/refresh', {
+      method: 'POST'
+    });
+    return handleAuthResponse(result);
+  } catch (error) {
+    setStoredToken(null);
+    throw error;
+  }
+};
+
+/*--- Impersonation ------------------------------*/
+/*
+ * Encerra a impersonação em curso.
+ *
+ * Não manda token nem id de sessão: o cookie de impersonação viaja sozinho
+ * (`credentials: 'include'`) e é ele que autoriza. Quem está dentro da
+ * impersonação é, por definição, quem pode fechá-la.
+ *
+ * O servidor responde limpando o cookie; depois disso o painel volta a ser o
+ * operador sozinho, e um reload basta para a tela acompanhar.
+ */
+const endImpersonation = async impersonationId => api(`/impersonation/${impersonationId}/end`, {
+  method: 'POST'
+});
+
+/*--- Session ------------------------------------*/
+// O cookie `riligar.session_token` é compartilhado por `.myinfrastructure.click`, então
+// um painel recém-aberto autentica aqui SEM ter nada no localStorage (que é
+// isolado por origem). Nesse caso semeamos o token local a partir da resposta:
+// `isAuthenticated()` e o refresh em background leem do localStorage, e sem
+// isto o painel ficaria autenticado no servidor mas "deslogado" no cliente —
+// e o token venceria sem nunca ser renovado naquela origem.
+// A gravação é INCONDICIONAL, e não só quando o slot está vazio. A chave é
+// fixa por origem, então um token de sessão já encerrada sobrevive a logout,
+// troca de conta e expiração — e `if (!getStoredToken())` nunca o substituía.
+// O servidor acabou de dizer qual é a sessão desta requisição; ele é a
+// autoridade, e o valor local que discorda dele é resíduo.
+//
+// Importa além do painel: o handoff do OAuth lê ESTE valor para montar o
+// `#token=`, então um resíduo aqui derruba a autorização inteira com
+// "Sessão inválida ou expirada", num ponto que não aponta para a causa.
+const getSession = async () => {
+  const result = await api('/auth/session');
+  const token = result?.token || result?.session?.token;
+  if (token && token !== getStoredToken()) setStoredToken(token);
+  return result;
+};
+const listSessions = async () => {
+  // As SESSÕES, não o envelope: a assinatura sempre devolveu a lista, e é a
+  // ergonomia certa para quem só quer renderizá-las.
+  const body = await api('/auth/list-sessions');
+  return Array.isArray(body?.items) ? body.items : [];
+};
+const revokeSession = async id => {
+  return await api('/auth/revoke-session-by-id', {
+    method: 'POST',
+    body: JSON.stringify({
+      id
+    })
+  });
+};
+const revokeOtherSessions = async () => {
+  return await api('/auth/revoke-other-sessions', {
+    method: 'POST'
+  });
+};
+
+/*--- Application Info ----------------------------*/
+const getApplicationInfo = async () => {
+  try {
+    // O recurso vem na RAIZ.
+    return (await api('/application/by-api-key')) || null;
+  } catch (error) {
+    console.warn('[AuthSDK] Failed to fetch application info:', error.message);
+    return null;
+  }
+};
+
+/*--- Profile Management ---------------------------*/
+const updateProfile = async data => {
+  return await api('/auth/update-user', {
+    method: 'POST',
+    body: JSON.stringify(data)
+  });
+};
+
+/*--- Social sign-in -------------------------------------------------------*/
+
+/**
+ * The providers this application has enabled.
+ *
+ * Public: it answers a screen where nobody is signed in yet. It carries only
+ * `{ provider, name }` — never the client id, which identifies the owner's
+ * project at Google.
+ *
+ * Returns `[]` on failure rather than throwing: a sign-in screen that cannot
+ * reach this endpoint must still render the email field, which is the path that
+ * always works.
+ */
+const getSocialProviders = async () => {
+  try {
+    const response = await api('/auth/providers');
+    return response?.items || [];
+  } catch (error) {
+    console.warn('[AuthSDK] Failed to fetch social providers:', error.message);
+    return [];
+  }
+};
+
+/**
+ * Leaves for the provider.
+ *
+ * A full-page navigation, not `fetch`: the person has to SEE Google's consent
+ * screen, and an XHR would be blocked by CORS anyway. The API key travels in the
+ * query string because a redirect carries no headers — it is the public `pu_`,
+ * which is already in the bundle.
+ *
+ * `redirect` is where to come back to; the worker validates it against the
+ * application's allowlist BEFORE leaving, and stores the validated value. It
+ * defaults to the current page.
+ */
+const startSocialSignIn = (provider, {
+  redirect
+} = {}) => {
+  const destination = redirect || window.location.href.split('#')[0];
+  const url = new URL(`${API_BASE}/auth/sign-in/${provider}`);
+  url.searchParams.set('redirect', destination);
+  if (API_KEY && !INTERNAL_MODE) url.searchParams.set('api_key', API_KEY);
+  window.location.assign(url.toString());
+};
+
+/**
+ * Reads the token the callback left in the fragment, and cleans the URL.
+ *
+ * The token comes back after `#` precisely so it never reaches a server, a log
+ * or a `Referer`. Once read it is removed from the address bar with
+ * `replaceState`, so a copied URL does not carry a live session.
+ *
+ * Returns the token when there was one, `null` otherwise.
+ */
+const consumeSocialToken = () => {
+  if (typeof window === 'undefined' || !window.location.hash) return null;
+  const params = new URLSearchParams(window.location.hash.slice(1));
+  const token = params.get('token');
+  if (!token) return null;
+
+  /*
+   * A social sign-in can land on a tab that already belongs to SOMEBODY ELSE.
+   *
+   * Coming back from Google replaces the session, and the person behind it may
+   * not be the one who left: signing in with a Google account whose email has
+   * no user here creates a NEW user, with an organization of its own.
+   *
+   * Swapping the token alone is not enough. Every panel keeps account-shaped
+   * state — the Auth panel persists the selected organization — and a
+   * `zustand/persist` store holds it in MEMORY, where clearing storage does
+   * not reach. The stale organization then rides the NEW token into the next
+   * request, and the server answers 403 "Sem permissão para esta organização"
+   * — correctly, about a switch that actually worked.
+   *
+   * That is the exact failure `markIdentitySwitching` exists for, and which
+   * impersonation already routes through. Social sign-in is one more identity
+   * switch and has to go through it too.
+   *
+   * Compared by `sub`, not by token string: a refresh rotates the token for
+   * the SAME person, and treating that as a switch would wipe their panel
+   * state for nothing.
+   */
+  const previous = getStoredToken();
+  if (previous && previous !== token) {
+    const before = decodeJWT(previous)?.sub;
+    const after = decodeJWT(token)?.sub;
+    // Only when we can read both and they disagree. An unreadable token is
+    // not evidence of a switch, and guessing here would clear state on a
+    // malformed value.
+    if (before && after && before !== after) markIdentitySwitching();
+  }
+  setStoredToken(token);
+  params.delete('token');
+  const rest = params.toString();
+  window.history.replaceState(null, '', `${window.location.pathname}${window.location.search}${rest ? `#${rest}` : ''}`);
+  return token;
+};
+
+/**
+ * The failure the callback reported, if any. Also clears it from the URL.
+ *
+ * The worker sends a short opaque code — never the provider's own error text,
+ * which echoes back parts of our request. Phrasing lives here, next to the other
+ * user-facing strings.
+ */
+const consumeSocialError = () => {
+  if (typeof window === 'undefined') return null;
+  const params = new URLSearchParams(window.location.search);
+  const reason = params.get('social_error');
+  if (!reason) return null;
+  params.delete('social_error');
+  const rest = params.toString();
+  window.history.replaceState(null, '', `${window.location.pathname}${rest ? `?${rest}` : ''}${window.location.hash}`);
+  return reason;
+};
+
+/** Starts linking a provider to the account of the CURRENT session. */
+const startSocialLink = async (provider, {
+  redirect
+} = {}) => {
+  const destination = redirect || window.location.href.split('#')[0];
+  const response = await api(`/auth/link/${provider}`, {
+    method: 'POST',
+    body: JSON.stringify({
+      redirect: destination
+    })
+  });
+  if (response?.authorizeUrl) window.location.assign(response.authorizeUrl);
+  return response;
+};
+const unlinkSocialProvider = async provider => {
+  return await api(`/auth/unlink/${provider}`, {
+    method: 'POST'
+  });
+};
+
+/** The providers linked to the current session's user. */
+const getLinkedProviders = async () => {
+  const response = await api('/auth/linked-providers');
+  return response?.items || [];
+};
+
+// ============================================================================
+// REDIRECT PÓS-LOGIN
+// ============================================================================
+//
+// Quem inicia um fluxo OAuth (o servidor MCP, por exemplo) manda o usuário ao
+// painel com `?redirect=` apontando de volta. Sem tratar esse parâmetro, o
+// login termina na home do painel e a autorização fica órfã.
+//
+// A lógica vive aqui, e não em cada aplicação, porque ela tem duas armadilhas
+// que não se quer reimplementar três vezes:
+//
+//  1. `redirect` sem allowlist transforma a tela de login em open redirect —
+//     um link `?redirect=https://phishing.example` levaria o usuário para lá
+//     logo após ele digitar a senha, num domínio que ele confia.
+//
+//  2. O token vive em `localStorage`, que é isolado POR ORIGEM. O worker do
+//     Auth (auth.worker.*) não consegue lê-lo do painel (produto.dashboard.*),
+//     então ele precisa ser entregue — e o fragmento (`#token=`) é o único
+//     canal que não chega ao servidor nem entra em log de acesso.
+// ============================================================================
+
+
+/**
+ * Origens para as quais é seguro redirecionar após o login.
+ *
+ * A origem da própria API entra sempre: é para lá que o fluxo OAuth volta, e
+ * o SDK já a conhece por `configure({ apiUrl })`. A origem atual também, por
+ * ser a mesma página. `extraOrigins` cobre o resto (um site institucional que
+ * inicie o login, por exemplo).
+ */
+function allowedOrigins(extraOrigins = []) {
+  const list = [];
+  try {
+    list.push(new URL(getApiUrl()).origin);
+  } catch {}
+  if (typeof window !== 'undefined') list.push(window.location.origin);
+  for (const raw of extraOrigins) {
+    try {
+      list.push(new URL(raw).origin);
+    } catch {}
+  }
+  return list;
+}
+const isLocalhost = hostname => hostname === 'localhost' || hostname === '127.0.0.1';
+
+/**
+ * Valida o `redirect` recebido e devolve o destino, ou `null`.
+ *
+ * Caminho interno (`/algo`) passa sempre — não sai do domínio. URL absoluta só
+ * passa se a origem constar na allowlist e for HTTPS: aceitar `http://` num
+ * host permitido exporia o token em trânsito.
+ */
+function resolveRedirect(raw, extraOrigins = []) {
+  if (!raw || typeof raw !== 'string') return null;
+
+  // `//` seria protocol-relative, que sai do domínio apesar de parecer path.
+  if (raw.startsWith('/') && !raw.startsWith('//')) return raw;
+  let url;
+  try {
+    url = new URL(raw);
+  } catch {
+    return null;
+  }
+
+  // Localhost passa em desenvolvimento: o destino é a máquina do próprio
+  // usuário, não um servidor de terceiro.
+  if (isLocalhost(url.hostname)) return raw;
+  if (url.protocol !== 'https:') return null;
+  return allowedOrigins(extraOrigins).includes(url.origin) ? raw : null;
+}
+
+/**
+ * Executa o redirect pós-login.
+ *
+ * Devolve `true` quando assumiu a navegação — o chamador então não deve
+ * navegar por conta própria. `false` significa "não havia redirect válido,
+ * siga o seu fluxo normal".
+ *
+ * @param {string|null} target destino já validado por `resolveRedirect`
+ * @param {(path: string) => void} navigate roteador da aplicação, para paths internos
+ * @param {boolean} withToken anexar o token no fragmento (necessário quando o
+ *   destino é outra origem que precisa da sessão, como o handoff do OAuth)
+ */
+function applyRedirect(target, navigate, {
+  withToken = true
+} = {}) {
+  if (!target) return false;
+
+  // Caminho interno: o roteador resolve, sem recarregar a página.
+  if (target.startsWith('/')) {
+    navigate?.(target, {
+      replace: true
+    });
+    return true;
+  }
+  if (typeof window === 'undefined') return false;
+  let finalUrl = target;
+  if (withToken) {
+    const token = window.localStorage.getItem(TOKEN_STORAGE_KEY);
+    // O fragmento nunca é enviado ao servidor: não aparece em log de
+    // acesso nem no Referer. É o canal certo para um token.
+    if (token) finalUrl = `${target}#token=${encodeURIComponent(token)}`;
+  }
+  window.location.replace(finalUrl);
+  return true;
+}
+
+/**
+ * Lê o `redirect` da URL atual, valida e devolve o destino (ou `null`).
+ *
+ * Atalho para o caso comum: o componente não precisa mexer em `URLSearchParams`
+ * nem lembrar o nome do parâmetro.
+ */
+function getRedirectFromLocation(extraOrigins = [], paramName = 'redirect') {
+  if (typeof window === 'undefined') return null;
+  const raw = new URLSearchParams(window.location.search).get(paramName);
+  return resolveRedirect(raw, extraOrigins);
+}
+
+// Shortest gap between two focus-driven session reads.
+const REVALIDATE_THROTTLE_MS = 5000;
+
+// Estado: { user, loading, error }
+const useAuthStore = create((set, get) => ({
+  user: null,
+  loading: true,
+  error: null,
+  // Timestamp of the last focus revalidation, for throttling.
+  lastRevalidatedAt: 0,
+  // Session management
+  sessions: [],
+  currentSession: null,
+  // Loading states granulares
+  loadingStates: {
+    requestCode: false,
+    verifyCode: false,
+    signOut: false,
+    updateProfile: false,
+    listSessions: false,
+    revokeSession: null // null or sessionId being revoked
+  },
+  // Application info (logo, nome, etc)
+  applicationInfo: null,
+  /*
+   * Preenchido quando ESTA sessão é emprestada — `/auth/session` devolve
+   * `{ actor, expiresAt }`. É o que a barra lê para avisar, em qualquer painel,
+   * que quem está logado não é quem está olhando.
+   */
+  impersonation: null,
+  // Helper para atualizar loading states
+  setLoading: (key, value) => set(state => ({
+    loadingStates: {
+      ...state.loadingStates,
+      [key]: value
+    }
+  })),
+  // Buscar informações da aplicação
+  fetchApplicationInfo: async () => {
+    try {
+      const appInfo = await getApplicationInfo();
+      set({
+        applicationInfo: appInfo
+      });
+    } catch (error) {
+      console.warn('[AuthStore] Failed to fetch application info:', error);
+      set({
+        applicationInfo: null
+      });
+    }
+  },
+  /*
+   * Reads the session from the server and mirrors it into the store.
+   *
+   * Shared by `init` (on mount) and `revalidate` (on focus). `trusted` says
+   * whether a failure is allowed to sign the user out: on mount there is
+   * nothing to lose, but on a revalidation the user is already signed in and
+   * a flaky network must not drop them.
+   */
+  syncSession: async ({
+    trusted
+  }) => {
+    try {
+      // Busca a sessão (que agora também traz applicationInfo)
+      const sessionData = await getSession();
+
+      // Se veio aplicação no redirecionamento/sessão, salva no store
+      if (sessionData?.application) {
+        set({
+          applicationInfo: sessionData.application
+        });
+      }
+
+      // `?? null` e não `|| undefined`: a ausência do campo é a resposta
+      // normal (ninguém impersonando) e tem que LIMPAR o estado anterior,
+      // senão a barra sobrevive ao encerramento.
+      set({
+        impersonation: sessionData?.impersonation ?? null
+      });
+      const user = sessionData?.user ?? null;
+      if (sessionData?.session) {
+        set({
+          currentSession: sessionData.session
+        });
+      }
+
+      // Se não encontrou sessão via cookies, verifica localStorage token (JWT)
+      //
+      // `isAuthenticated()` só confere o `exp` do JWT — não fala com o
+      // servidor. Uma sessão revogada tem `exp` no futuro e passaria por
+      // aqui: o painel se mostraria logado com um token que o servidor já
+      // não reconhece. Como o handoff do OAuth envia ESTE token no
+      // `#token=`, o resíduo derrubava a autorização com "Sessão inválida
+      // ou expirada" — longe da causa.
+      //
+      // O servidor acabou de responder sem sessão; ele é a autoridade.
+      if (!user) {
+        /*
+         * "No user" WITH a stored token is not a logout — it is a token
+         * that stopped being valid. The right answer is to ask again,
+         * without it.
+         *
+         * This is the path of whoever ended the impersonation in ANOTHER
+         * tab. `/auth/session` with a dead token answers 200 and WITHOUT
+         * a user (not 401: a session that does not exist is the normal
+         * "nobody signed in" path). This branch then concluded "logged
+         * out" and stopped there — while the operator's session was
+         * alive in the cookie, shared across the zone and never touched.
+         *
+         * The retry goes without `Authorization`, the cookie speaks, and
+         * the operator becomes themselves again. One attempt only: if
+         * this one also comes back without a user, there is no session
+         * behind it and logging out is correct.
+         */
+        if (isAuthenticated()) {
+          setStoredToken(null);
+          const semToken = await getSession().catch(() => null);
+          if (semToken?.user) {
+            const anterior = get().user;
+            const trocou = anterior && anterior.id !== semToken.user.id;
+            set({
+              user: semToken.user,
+              currentSession: semToken.session ?? null,
+              impersonation: semToken.impersonation ?? null,
+              loading: false
+            });
+            if (trocou && typeof window !== 'undefined') {
+              markIdentitySwitching();
+              window.location.reload();
+            }
+            return;
+          }
+        }
+        set({
+          user: null,
+          currentSession: null,
+          impersonation: null,
+          loading: false
+        });
+        return;
+      }
+
+      /*
+       * THE IDENTITY CHANGED UNDER THE SCREEN: drop everything and reload.
+       *
+       * This is the guard that makes the server the single truth. The
+       * seven panels hold data in memory and in their own stores —
+       * projects, lists, counters — and none of them knows when the person
+       * behind the session stopped being the same one.
+       *
+       * It happens for real when an impersonation is ended in ANOTHER tab:
+       * `localStorage` is per origin, so Hoster never learns that Functions
+       * ended it. On the next focus it revalidates, the server answers with
+       * the operator — and the screen was left with one person's footer and
+       * another's list, two people's data at once.
+       *
+       * Swapping `user` in the store would not be enough: whoever already
+       * read the list does not read it again. Reloading is the only way to
+       * guarantee that NOTHING of the previous identity survives — and it
+       * is cheap, because it only happens on the transition.
+       *
+       * `previous` comes from the state, not from a module variable: under
+       * SSR and in tests the module is shared, and the comparison has to be
+       * per store.
+       */
+      const previous = get().user;
+      const identityChanged = previous && previous.id !== user.id;
+      if (identityChanged && typeof window !== 'undefined') {
+        /*
+         * Mark the switch BEFORE reloading.
+         *
+         * The reload is not instantaneous: in-flight calls finish, and
+         * mounted screens still fire their own. All of them carry the old
+         * identity and get 403 — which surfaced as "Acesso negado: Sem
+         * permissão para esta organização" in the middle of a switch that
+         * was working.
+         *
+         * This guard reloaded without marking, and was the last place the
+         * notification escaped through.
+         */
+        markIdentitySwitching();
+        set({
+          user,
+          loading: false
+        });
+        window.location.reload();
+        return;
+      }
+      set({
+        user,
+        loading: false
+      });
+    } catch (error) {
+      // Só descartamos o token quando o SERVIDOR o recusou (401). Uma
+      // falha de rede não diz nada sobre a validade da sessão, e limpar
+      // aqui deslogaria quem só perdeu conexão por um instante.
+      const rejected = error?.res?.status === 401;
+
+      /*
+       * Token refused: drop it AND ASK AGAIN, without it.
+       *
+       * Clearing alone was not enough, and that is what made the operator
+       * lose their account when ending an impersonation in ANOTHER tab.
+       * `localStorage` is per origin: ending in Functions does not remove
+       * the target's token stored in Hoster and Auth. Coming back to that
+       * tab, it revalidated with a dead token, took a 401, cleared it — and
+       * stopped there, concluding "logged out".
+       *
+       * But the operator's session is alive in the cookie, shared across
+       * the zone and never touched. The second attempt goes without
+       * `Authorization`, the cookie speaks, and they become themselves
+       * again — which is what the person expected when ending it in any of
+       * the tabs.
+       *
+       * One attempt only: if this one fails too, there is no session
+       * behind it, and the path below (logging out) is correct.
+       */
+      if (rejected) {
+        setStoredToken(null);
+        try {
+          const semToken = await getSession();
+          if (semToken?.user) {
+            /*
+             * This path ALSO swaps the identity on screen.
+             *
+             * It is the one taken when the impersonation is ended in
+             * another tab: the target's token is refused, the cookie
+             * returns the operator — but the screen stays mounted
+             * with the target's lists, which nobody will re-read.
+             *
+             * Same guard as the ordinary revalidation: mark the
+             * switch to silence the in-flight 403s, and reload so
+             * nothing of the previous identity survives.
+             */
+            const anterior = get().user;
+            const trocou = anterior && anterior.id !== semToken.user.id;
+            set({
+              user: semToken.user,
+              currentSession: semToken.session ?? null,
+              impersonation: semToken.impersonation ?? null,
+              loading: false
+            });
+            if (trocou && typeof window !== 'undefined') {
+              markIdentitySwitching();
+              window.location.reload();
+            }
+            return;
+          }
+        } catch {
+          // Sem sessão atrás do token morto: segue para o caminho
+          // normal e desloga, que é o comportamento correto.
+        }
+      }
+
+      // An unreachable server says nothing about an established session.
+      // On a revalidation the user is already signed in: keep them, and
+      // try again on the next focus.
+      if (!rejected && !trusted) {
+        console.warn('[AuthStore] Revalidação falhou, mantendo a sessão:', error);
+        return;
+      }
+      console.error('Erro na inicialização:', error);
+      set({
+        user: null,
+        currentSession: null,
+        loading: false
+      });
+    }
+  },
+  /* Init ao montar o Provider */
+  init: async () => {
+    await get().syncSession({
+      trusted: true
+    });
+  },
+  /*
+   * Re-reads the session when the tab regains focus.
+   *
+   * `init` runs once, so a tab opened BEFORE the user signed in elsewhere
+   * stays on `user: null` until a manual refresh. The session cookie is
+   * shared across the zone, and localStorage is not — it is per origin — so
+   * the `storage` event never crosses between two dashboards. Asking the
+   * server on focus is what carries a sign-in (and a sign-out) between them.
+   *
+   * Throttled: `focus` and `visibilitychange` fire together, and alt-tabbing
+   * would otherwise turn into a burst of `/auth/session` calls.
+   */
+  revalidate: async ({
+    force = false
+  } = {}) => {
+    const now = Date.now();
+    // `force` skips the floor between reads: a caller on its own interval
+    // (the impersonation poll) already controls the frequency, and the floor
+    // exists for focus, which fires several times in a row when windows
+    // change.
+    if (!force && now - get().lastRevalidatedAt < REVALIDATE_THROTTLE_MS) return;
+    set({
+      lastRevalidatedAt: now
+    });
+    await get().syncSession({
+      trusted: false
+    });
+  },
+  /* Ações de Autenticação */
+  /* Sign in — ask for the code and trade it for the session. No third step. */
+
+  requestCode: async (email, options) => {
+    const {
+      setLoading
+    } = get();
+    setLoading('requestCode', true);
+    set({
+      error: null
+    });
+    try {
+      return await requestCode(email, options);
+    } catch (err) {
+      set({
+        error: err
+      });
+      throw err;
+    } finally {
+      setLoading('requestCode', false);
+    }
+  },
+  verifyCode: async (email, code) => {
+    const {
+      setLoading
+    } = get();
+    setLoading('verifyCode', true);
+    set({
+      error: null
+    });
+    try {
+      const result = await verifyCode(email, code);
+
+      // The session comes with the response; without it the "this device"
+      // badge cannot identify the current session.
+      if (result.session) set({
+        currentSession: result.session
+      });
+      set({
+        user: result.user || null,
+        loading: false
+      });
+      return result;
+    } catch (err) {
+      set({
+        error: err
+      });
+      throw err;
+    } finally {
+      setLoading('verifyCode', false);
+    }
+  },
+  signOut: async () => {
+    const {
+      setLoading
+    } = get();
+    setLoading('signOut', true);
+    try {
+      await signOut();
+      set({
+        user: null
+      });
+      // Sincronizar logout entre abas
+      if (typeof window !== 'undefined') {
+        window.localStorage.setItem('auth:logout', Date.now());
+      }
+    } finally {
+      setLoading('signOut', false);
+    }
+  },
+  /* Session */
+  getSession: async () => {
+    try {
+      const sessionData = await getSession();
+      // Store current session for comparison (includes id)
+      if (sessionData?.session) {
+        set({
+          currentSession: sessionData.session
+        });
+      }
+      return sessionData;
+    } catch (err) {
+      set({
+        error: err
+      });
+      throw err;
+    }
+  },
+  listSessions: async () => {
+    const {
+      setLoading
+    } = get();
+    setLoading('listSessions', true);
+    set({
+      error: null
+    });
+    try {
+      const result = await listSessions();
+      set({
+        sessions: result || []
+      });
+      setLoading('listSessions', false);
+      return result;
+    } catch (err) {
+      set({
+        error: err,
+        sessions: []
+      });
+      setLoading('listSessions', false);
+      throw err;
+    }
+  },
+  revokeSession: async sessionId => {
+    const {
+      setLoading,
+      currentSession,
+      sessions,
+      signOut
+    } = get();
+    setLoading('revokeSession', sessionId);
+    set({
+      error: null
+    });
+    try {
+      // Detect if current session OR last remaining session
+      const isCurrent = sessionId === currentSession?.id;
+      const isLast = sessions.length === 1 && sessions[0].id === sessionId;
+
+      // Se for a sessão atual ou a última, faz logout normal
+      if (isCurrent || isLast) {
+        await signOut();
+        // signOut já limpa loading states e erros no finally, mas
+        // como estamos dentro do fluxo deste método, garantimos:
+        setLoading('revokeSession', null);
+        return;
+      }
+      await revokeSession(sessionId);
+
+      // Remove a sessão revogada da lista local
+      set(state => ({
+        sessions: state.sessions.filter(s => s.id !== sessionId)
+      }));
+      setLoading('revokeSession', null);
+    } catch (err) {
+      set({
+        error: err
+      });
+      setLoading('revokeSession', null);
+      throw err;
+    }
+  },
+  revokeOtherSessions: async () => {
+    const {
+      setLoading,
+      listSessions
+    } = get();
+    setLoading('revokeSession', 'all');
+    set({
+      error: null
+    });
+    try {
+      await revokeOtherSessions();
+      // Refresh sessions list after revocation
+      await listSessions();
+      setLoading('revokeSession', null);
+    } catch (err) {
+      set({
+        error: err
+      });
+      setLoading('revokeSession', null);
+      throw err;
+    }
+  },
+  /* Refresh do token em background */
+  startRefresh: () => {
+    if (typeof window === 'undefined') return;
+    const refreshInterval = setInterval(async () => {
+      try {
+        // Se o usuário está autenticado mas o token está próximo do vencimento
+        if (isAuthenticated()) {
+          const token = window.localStorage.getItem('auth:token');
+          if (token) {
+            // Usa o decoder oficial do SDK que é mais seguro
+            const payload = decodeJWT(token);
+
+            // Se não for um JWT ou não tiver expiração, não fazemos refresh em background
+            // O backend cuidará da expiração da sessão opaca via 401 nas requisições normais
+            if (!payload || !payload.exp) return;
+            const now = Date.now() / 1000;
+            const timeUntilExpiry = payload.exp - now;
+
+            // Se o token expira em menos de 5 minutos, tenta o refresh
+            if (timeUntilExpiry < 300) {
+              try {
+                const refreshed = await refreshToken();
+                const user = getCurrentUser();
+                set({
+                  user
+                });
+                // O refresh rotaciona o token mantendo o mesmo id de sessão.
+                if (refreshed?.session) set({
+                  currentSession: refreshed.session
+                });
+              } catch (refreshErr) {
+                console.warn('[AuthStore] Falha ao renovar token:', refreshErr);
+                // Só desloga se for um erro de autenticação explícito (401)
+                if (refreshErr.res?.status === 401) {
+                  set({
+                    user: null
+                  });
+                  window.localStorage.removeItem('auth:token');
+                }
+              }
+            }
+          }
+        }
+      } catch (error) {
+        // Erros de processamento interno não devem deslogar o usuário
+        console.error('[AuthStore] Erro no ciclo de refresh automático:', error);
+      }
+    }, 4 * 60 * 1000); // Verifica a cada 4 minutos
+
+    // Limpa o intervalo quando necessário
+    if (typeof window !== 'undefined') {
+      window.addEventListener('beforeunload', () => {
+        clearInterval(refreshInterval);
+      });
+    }
+  },
+  /* Verifica se o token ainda é válido */
+  checkTokenValidity: () => {
+    if (!isAuthenticated()) {
+      set({
+        user: null
+      });
+      return false;
+    }
+    return true;
+  },
+  /* Atualizar usuário manualmente */
+  setUser: user => set({
+    user
+  }),
+  /* Profile Management */
+  updateProfile: async data => {
+    const {
+      setLoading
+    } = get();
+    setLoading('updateProfile', true);
+    set({
+      error: null
+    });
+    try {
+      const result = await updateProfile(data);
+      // Atualiza o user no store com os novos dados
+      set(state => ({
+        user: state.user ? {
+          ...state.user,
+          ...data
+        } : null
+      }));
+      setLoading('updateProfile', false);
+      return result;
+    } catch (err) {
+      set({
+        error: err
+      });
+      setLoading('updateProfile', false);
+      throw err;
+    }
+  }
+}));
+
+function remaining(expiresAt) {
+  if (!expiresAt) return null;
+  const ms = new Date(expiresAt).getTime() - Date.now();
+  if (ms <= 0) return null;
+  const totalSeconds = Math.floor(ms / 1000);
+  return `${Math.floor(totalSeconds / 60)}:${String(totalSeconds % 60).padStart(2, '0')}`;
+}
+
+/*
+ * A FLOATING PILL, NOT A STRIP AT THE TOP — and this is a layout decision, not
+ * a cosmetic one.
+ *
+ * The bar used to be `position: sticky; top: 0`, rendered just above the panel's
+ * own tree. That takes vertical space in the document flow, and all seven panels
+ * lay themselves out with Mantine's `AppShell`, which positions its Header and
+ * Navbar at offsets it computes from its OWN props (`header={{ height }}`, and
+ * that height is responsive — 56 on mobile, 0 on desktop in some panels). The
+ * strip pushed that whole construction down: the panel's header ended up under
+ * the bar, and the sidebar got clipped.
+ *
+ * The SDK cannot fix that by measuring: it would have to know each panel's
+ * header height, at every breakpoint, and stay in sync with seven layouts it
+ * does not own. Any number it picks is wrong somewhere.
+ *
+ * So the bar stops competing for the top of the page. `position: fixed` with
+ * `inset: auto 0 20px` takes it out of the flow entirely — it reserves no
+ * space, displaces nothing, and floats over the content at the BOTTOM, where no
+ * panel puts a fixed header. The visibility that the feature depends on is
+ * preserved: it is always on screen, centred, and impossible to scroll away
+ * from. The risk this component exists to cover is the operator FORGETTING they
+ * are inside someone else's account, and a floating pill answers that as well
+ * as a strip did — without breaking the screen underneath.
+ *
+ * `pointerEvents` is handled in two layers: the full-width wrapper lets clicks
+ * through (it spans the viewport and would otherwise swallow a row of the UI),
+ * and the pill itself takes them back so the button stays clickable.
+ */
+const styles = {
+  wrap: {
+    position: 'fixed',
+    left: 0,
+    right: 0,
+    bottom: 20,
+    zIndex: 2147483647,
+    display: 'flex',
+    justifyContent: 'center',
+    // The strip spans the viewport; without this it would eat clicks on
+    // whatever sits behind it for the full width of the screen.
+    pointerEvents: 'none',
+    // Mobile: never let the pill run under the home indicator.
+    paddingLeft: 'max(12px, env(safe-area-inset-left))',
+    paddingRight: 'max(12px, env(safe-area-inset-right))'
+  },
+  bar: {
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    flexWrap: 'wrap',
+    gap: 10,
+    padding: '10px 16px',
+    borderRadius: 999,
+    // The brand's black. It stands out by INVERSION, not by an alert
+    // colour: red would say "something went wrong", and the state is
+    // "you are borrowed".
+    background: '#11181C',
+    color: '#FFFFFF',
+    fontSize: 13,
+    fontFamily: 'inherit',
+    lineHeight: 1.4,
+    maxWidth: '100%',
+    // Detaches the pill from the content it floats over, which a flat strip
+    // did not need because it had an edge to sit against.
+    boxShadow: '0 8px 24px rgba(0, 0, 0, 0.28)',
+    pointerEvents: 'auto'
+  },
+  strong: {
+    fontWeight: 700
+  },
+  clock: {
+    fontVariantNumeric: 'tabular-nums',
+    opacity: 0.75
+  },
+  button: {
+    marginLeft: 4,
+    padding: '4px 12px',
+    border: 0,
+    borderRadius: 999,
+    background: '#FFFFFF',
+    color: '#11181C',
+    font: 'inherit',
+    fontSize: 12,
+    fontWeight: 700,
+    cursor: 'pointer'
+  }
+};
+function ImpersonationBanner() {
+  const impersonation = useAuthStore(s => s.impersonation);
+  const user = useAuthStore(s => s.user);
+  const [left, setLeft] = useState(() => remaining(impersonation?.expiresAt));
+  const [ending, setEnding] = useState(false);
+
+  /*
+   * Encerrar recarrega a página.
+   *
+   * The whole panel is already mounted with the target's data — lists,
+   * stores, caches. Swapping the identity underneath would leave half the
+   * screen with one person's data and half with another's. Reloading is the
+   * simplest way to make everything come back coherent, and it happens once,
+   * at the end of the session.
+   */
+  /*
+   * O vencimento, sem clique.
+   *
+   * It does not call `/impersonation/:id/end`: the session is already gone,
+   * and the route would answer 403 ("belongs to another session") because the
+   * presented token died. What is left to do is local — drop the target's
+   * token — and let the server say who the person is on the next load.
+   *
+   * The impersonation cookie needs no explicit clearing: it was issued with a
+   * `Max-Age` equal to the session TTL, so the browser discards it on its own.
+   * And even if it lingered a moment, `requireAuth` tries the candidates in
+   * order and falls through to the operator's session.
+   */
+  const endedByTimer = useCallback(() => {
+    markIdentitySwitching();
+    setStoredToken(null);
+    window.location.assign('/');
+  }, []);
+  const handleEnd = async () => {
+    if (!impersonation?.id) return;
+    setEnding(true);
+    markIdentitySwitching();
+    try {
+      await endImpersonation(impersonation.id);
+
+      /*
+       * The TARGET's token is in localStorage — the SDK wrote it there
+       * so the other products would send the right header. Ending without
+       * dropping it would leave the panel presenting itself as the target
+       * in every product that reads that key, even with the cookie gone.
+       *
+       * The reload below asks for the session again, and the operator's
+       * session cookie (never touched) rewrites the correct value.
+       */
+      setStoredToken(null);
+    } catch {
+      // If it fails, the session expires on its own within minutes.
+      // Reloading anyway avoids leaving the operator stuck in a bar that
+      // does not answer.
+    }
+    /*
+     * Goes to the panel's ROOT, instead of reloading the current URL.
+     *
+     * The URL where an impersonation ends usually belongs to the TARGET — a
+     * project of theirs in Hoster, an application of theirs in Auth.
+     * Reloading there returns the operator to a route that may not be
+     * theirs, and the screen answers 403 or sits in a skeleton forever.
+     *
+     * `/` is the home of every panel in the suite, and the only route that
+     * answers for any identity. Each product decides what it means.
+     */
+    window.location.assign('/');
+  };
+  useEffect(() => {
+    if (!impersonation) return;
+    const timer = setInterval(() => {
+      const restante = remaining(impersonation.expiresAt);
+      setLeft(restante);
+
+      /*
+       * Vencido: a tela tem que acompanhar, e sem ninguém clicar em nada.
+       *
+       * Until now the clock hit zero and nothing else happened: the bar
+       * stayed on screen, `localStorage` kept the target's dead token, and
+       * every product answered 401 — which panels read as the end of a
+       * session and handle by signing out. The operator lost their own
+       * account because a borrowed session expired.
+       *
+       * `endedByTimer` walks the same path as the button: drop the
+       * target's token and go to the root. What decides who shows up next
+       * is the SERVER — the operator's session cookie was never touched,
+       * so if it is alive the home loads as them; if there is no session
+       * behind it, `/auth/session` answers without a user and the panel
+       * sends them to the login, which is correct. There is nothing to
+       * guess here.
+       */
+      if (!restante) endedByTimer();
+    }, 1000);
+    return () => clearInterval(timer);
+  }, [impersonation, endedByTimer]);
+  if (!impersonation) return null;
+
+  // Durante o primeiro segundo `left` ainda é o valor de outra impersonação
+  // (ou nulo); derivar aqui evita um setState no corpo do efeito só para isso.
+  const clock = left ?? remaining(impersonation.expiresAt);
+  return /*#__PURE__*/jsx("div", {
+    style: styles.wrap,
+    children: /*#__PURE__*/jsxs("div", {
+      style: styles.bar,
+      role: "status",
+      children: [/*#__PURE__*/jsxs("span", {
+        children: ["Voc\xEA est\xE1 vendo como ", /*#__PURE__*/jsx("span", {
+          style: styles.strong,
+          children: user?.name || user?.email
+        }), impersonation.actor ? /*#__PURE__*/jsxs(Fragment, {
+          children: [" \xB7 sess\xE3o aberta por ", impersonation.actor]
+        }) : null]
+      }), clock ? /*#__PURE__*/jsxs("span", {
+        style: styles.clock,
+        children: ["encerra em ", clock]
+      }) : null, impersonation.id ? /*#__PURE__*/jsx("button", {
+        type: "button",
+        style: styles.button,
+        onClick: handleEnd,
+        disabled: ending,
+        children: ending ? 'Encerrando…' : 'Encerrar'
+      }) : null]
+    })
+  });
+}
+
+const AuthContext = /*#__PURE__*/createContext(); // só para ter o Provider em JSX
+
+// How often a tab asks the server who it is. Short enough for an identity
+// switch to surface on its own, long enough not to weigh on an idle panel.
+const IMPERSONATION_POLL_MS = 10 * 1000;
+function AuthProvider({
+  children,
+  apiKey,
+  // API Key para header X-API-Key (obrigatória exceto em modo internal)
+  apiUrl,
+  // URL do manager (opcional, padrão: http://auth.worker.myinfrastructure.click)
+  internal = false,
+  // Modo interno: não exige API Key (para aplicações same-domain como dashboard)
+  onError // Callback de erro global
+}) {
+  // Validação de props obrigatórias
+  // apiKey só é obrigatória se não estiver em modo internal
+  if (!internal && !apiKey) {
+    throw new Error('[@ciromaciel/auth-react] apiKey é obrigatória no AuthProvider. ' + 'Obtenha sua API Key no dashboard em https://auth.dashboard.myinfrastructure.click');
+  }
+  const init = useAuthStore(s => s.init);
+  const startRefresh = useAuthStore(s => s.startRefresh);
+  const revalidate = useAuthStore(s => s.revalidate);
+  const checkTokenValidity = useAuthStore(s => s.checkTokenValidity);
+
+  // Configura SDK com apiKey, apiUrl e modo interno
+  // Usamos useMemo para garantir que a configuração ocorra ANTES dos efeitos dos componentes filhos
+  useMemo(() => {
+    configure({
+      apiKey,
+      apiUrl,
+      internal
+    });
+
+    /*
+     * A social sign-in landing here brings its token in the fragment.
+     *
+     * It is consumed in this `useMemo`, BEFORE `init()` runs in the effect
+     * below: `init` reads the stored token to resolve the session, so a
+     * token still sitting in the URL at that moment would be missed, and the
+     * person would land signed out on the page they just signed into.
+     *
+     * Reading it also strips it from the address bar, so a copied URL never
+     * carries a live session.
+     */
+    consumeSocialToken();
+  }, [apiKey, apiUrl, internal]);
+  useEffect(() => {
+    init();
+    startRefresh();
+  }, [init, startRefresh]);
+
+  // Sincronização entre abas - escuta logout e mudanças no token
+  useEffect(() => {
+    if (typeof window === 'undefined') return;
+    const handleStorageChange = event => {
+      if (event.key === 'auth:logout') {
+        // Limpa o user do store - a aplicação redireciona automaticamente quando user é null
+        useAuthStore.setState({
+          user: null,
+          currentSession: null,
+          sessions: []
+        });
+      }
+      /*
+       * Another tab of this origin switched identity.
+       *
+       * It clears its own storage and reloads, but each tab has its own
+       * mounted screens — lists and counters that belong to whoever was
+       * signed in a moment ago. Wiping here and reloading is what makes a
+       * sibling tab follow along instead of showing the previous person's
+       * data under the new person's name.
+       *
+       * This is the SDK's job, not each app's: every consumer of
+       * `AuthProvider` gets it without writing anything, ours and our
+       * customers' alike.
+       */
+      if (event.key === 'auth:identity-switched') {
+        markIdentitySwitching();
+        window.location.assign('/');
+        return;
+      }
+
+      // The token changed in another tab of THIS origin.
+      //
+      // `checkTokenValidity` only reads the stored JWT's `exp`, which
+      // cannot tell a different person from the same one — and after an
+      // impersonation starts or ends, a different person is exactly what
+      // it is. Asking the server is what makes the sibling tab follow the
+      // switch instead of sitting on the previous identity's data.
+      //
+      // `force` skips the focus throttle: this is an event, not a stream,
+      // and a background tab may never get focus to catch up.
+      if (event.key === 'auth:token') {
+        revalidate({
+          force: true
+        });
+      }
+    };
+
+    // Escuta evento de sessão revogada (quando o usuário revoga sua própria sessão)
+    const handleSessionRevoked = () => {
+      // Limpa o usuário do store
+      useAuthStore.setState({
+        user: null,
+        currentSession: null,
+        sessions: []
+      });
+      // Dispara evento de logout para sincronizar entre abas
+      localStorage.setItem('auth:logout', Date.now());
+    };
+    window.addEventListener('storage', handleStorageChange);
+    window.addEventListener('auth:session-revoked', handleSessionRevoked);
+    return () => {
+      window.removeEventListener('storage', handleStorageChange);
+      window.removeEventListener('auth:session-revoked', handleSessionRevoked);
+    };
+  }, [revalidate]);
+
+  // Revalidate the session when the tab regains focus.
+  //
+  // `init` runs once: a tab opened BEFORE the user signed in on another
+  // dashboard stays on `user: null` until a manual refresh. The session
+  // cookie belongs to the zone, but localStorage is per origin — so the
+  // `storage` event never crosses from one dashboard to another. Asking the
+  // server on focus is what carries a sign-in (and a sign-out) between them.
+  useEffect(() => {
+    if (typeof window === 'undefined') return;
+    const handleFocus = () => {
+      if (document.visibilityState === 'visible') revalidate();
+    };
+    document.addEventListener('visibilitychange', handleFocus);
+    window.addEventListener('focus', handleFocus);
+    return () => {
+      document.removeEventListener('visibilitychange', handleFocus);
+      window.removeEventListener('focus', handleFocus);
+    };
+  }, [revalidate]);
+
+  // Verifica validade do token periodicamente
+  useEffect(() => {
+    if (typeof window === 'undefined') return;
+    const interval = setInterval(() => {
+      checkTokenValidity();
+    }, 30 * 1000); // Verifica a cada 30 segundos
+
+    return () => clearInterval(interval);
+  }, [checkTokenValidity]);
+
+  // Ask the server every so often — even with the tab in the background, and
+  // WITHOUT depending on knowing an impersonation is open.
+  //
+  // `checkTokenValidity` above only reads the `exp` of the stored JWT, and a
+  // target's token has an `exp` in the future: it stays "valid" after the
+  // impersonation ended. Focus revalidation does not help a tab nobody
+  // touched. That is what left Functions showing the target after ending
+  // elsewhere: nothing in that tab had a reason to ask again.
+  //
+  // Gating this on `impersonation` was the obvious move and the wrong one: it
+  // makes the recovery depend on the very state that goes stale. When the
+  // store lost `impersonation` while still holding the target as `user` — the
+  // bar disappeared and the data did not — the poll stopped with it, and the
+  // tab had no way back at all.
+  //
+  // Unconditional, the tab always has a way back. One request every ten
+  // seconds against a route that answers from the session is cheap; being
+  // stuck as another person is not.
+  useEffect(() => {
+    if (typeof window === 'undefined') return;
+    const interval = setInterval(() => revalidate({
+      force: true
+    }), IMPERSONATION_POLL_MS);
+    return () => clearInterval(interval);
+  }, [revalidate]);
+
+  // Contexto com onError callback
+  const contextValue = useMemo(() => ({
+    onError
+  }), [onError]);
+
+  /*
+   * The impersonation bar ships WITH the Provider.
+   *
+   * That is what makes all seven panels warn without any of them being
+   * changed: they all already wrap the app in `AuthProvider`. Letting each
+   * panel mount it by hand is how one of them gets left out — and the panel
+   * left out is precisely where the operator forgets whose account they are
+   * in.
+   *
+   * It renders nothing when no impersonation is open, so it costs nothing in
+   * the normal case.
+   */
+  return /*#__PURE__*/jsxs(AuthContext.Provider, {
+    value: contextValue,
+    children: [/*#__PURE__*/jsx(ImpersonationBanner, {}), children]
+  });
+}
+
+/* Hooks "facade" que a app vai usar */
+const useAuth = () => useAuthStore(useShallow(s => ({
+  user: s.user,
+  loading: s.loading,
+  error: s.error,
+  isAuthenticated: s.user !== null,
+  requestCode: s.requestCode,
+  verifyCode: s.verifyCode,
+  signOut: s.signOut
+})));
+
+/**
+ * Sign in: the two steps, and nothing else.
+ *
+ * `requestCode(email, { name })` sends the code. `verifyCode(email, code)`
+ * returns the session. There is no separate sign-up — the first entry creates
+ * the account.
+ */
+const useSignIn = () => useAuthStore(useShallow(s => ({
+  requestCode: s.requestCode,
+  verifyCode: s.verifyCode,
+  sending: s.loadingStates.requestCode,
+  verifying: s.loadingStates.verifyCode,
+  error: s.error
+})));
+
+// Auth Actions
+const useSignOut = () => useAuthStore(s => s.signOut);
+const useCheckToken = () => useAuthStore(s => s.checkTokenValidity);
+
+// Session Hook
+const useSession = () => useAuthStore(useShallow(s => ({
+  getSession: s.getSession,
+  user: s.user,
+  setUser: s.setUser
+})));
+
+// Loading States Hook
+const useAuthLoading = () => useAuthStore(s => s.loadingStates);
+
+// Profile Management Hook (novo nome estilo Clerk)
+const useUser = () => useAuthStore(useShallow(s => ({
+  user: s.user,
+  updateProfile: s.updateProfile,
+  loadingUpdateProfile: s.loadingStates.updateProfile,
+  error: s.error
+})));
+
+// Sessions Management Hook
+const useSessions = () => useAuthStore(useShallow(s => ({
+  currentSession: s.currentSession,
+  sessions: s.sessions,
+  getSession: s.getSession,
+  listSessions: s.listSessions,
+  revokeSession: s.revokeSession,
+  revokeOtherSessions: s.revokeOtherSessions,
+  loadingListSessions: s.loadingStates.listSessions,
+  loadingRevokeSession: s.loadingStates.revokeSession,
+  error: s.error
+})));
+
+/**
+ * The impersonation in progress, or `null`.
+ *
+ * Exposed so a panel can adapt what it OFFERS while the session is borrowed.
+ * The banner already says whose account this is; this is for the screens that
+ * would otherwise invite the target to do something only an administrator does
+ * — "create your first company" makes no sense for an end user being looked at.
+ *
+ * Returns the record (`{ id, actor, expiresAt }`), so a screen can name who
+ * opened the session without a second call.
+ */
+const useImpersonation = () => useAuthStore(s => s.impersonation);
+
+// Application Logo Hook
+const useApplicationLogo = () => {
+  const applicationInfo = useAuthStore(s => s.applicationInfo);
+  // Retorna o logo da aplicação ou null (componentes usam fallback padrão)
+  return applicationInfo?.image || null;
+};
+
+function Protect({
+  fallback = /*#__PURE__*/jsx("p", {
+    children: "\u231B Carregando..."
+  }),
+  redirectTo = '/login'
+}) {
+  const {
+    user,
+    loading
+  } = useAuth();
+  if (loading) return fallback;
+  if (!user) return /*#__PURE__*/jsx(Navigate, {
+    to: redirectTo,
+    replace: true
+  });
+  return /*#__PURE__*/jsx(Outlet, {});
+}
+
+function GuestOnly({
+  children,
+  fallback = null,
+  redirectTo = '/',
+  extraOrigins = []
+}) {
+  const {
+    user,
+    loading
+  } = useAuth();
+  if (loading) return fallback;
+  if (!user) return children ?? /*#__PURE__*/jsx(Outlet, {});
+  const to = getRedirectFromLocation(extraOrigins) || redirectTo;
+
+  // `//alvo` parece caminho e sai do domínio: é externo, e o roteador desta
+  // aplicação não o alcança.
+  const isInternal = to.startsWith('/') && !to.startsWith('//');
+  if (!isInternal) {
+    window.location.replace(to);
+    return fallback;
+  }
+  return /*#__PURE__*/jsx(Navigate, {
+    to: to,
+    replace: true
+  });
+}
+
+function AuthCard({
+  children,
+  title,
+  subtitle,
+  logo,
+  logoWidth = 133,
+  width = 350,
+  // Variant props
+  variant = 'card',
+  opened,
+  onClose,
+  modalProps = {},
+  ...props
+}) {
+  // Conteúdo interno compartilhado entre Card e Modal
+  const content = /*#__PURE__*/jsxs(Stack, {
+    gap: "sm",
+    children: [(logo || title || subtitle) && /*#__PURE__*/jsxs(Stack, {
+      gap: 6,
+      align: "center",
+      ta: "center",
+      children: [logo && (typeof logo === 'string' ? /*#__PURE__*/jsx(Image, {
+        src: logo,
+        alt: "Auth",
+        mx: "auto",
+        w: logoWidth,
+        fit: "contain"
+      }) : logo), title && /*#__PURE__*/jsx(Title, {
+        order: 3,
+        ta: "center",
+        children: title
+      }), subtitle && /*#__PURE__*/jsx(Text, {
+        size: "sm",
+        c: "dimmed",
+        ta: "center",
+        children: subtitle
+      })]
+    }), children]
+  });
+
+  // Renderizar como Modal
+  if (variant === 'modal') {
+    return /*#__PURE__*/jsx(Modal, {
+      opened: opened,
+      onClose: onClose,
+      size: width + 50,
+      withCloseButton: true,
+      radius: 0,
+      overlayProps: {
+        backgroundOpacity: 0.55,
+        blur: 3
+      },
+      title: /*#__PURE__*/jsxs(Group, {
+        gap: "sm",
+        wrap: "nowrap",
+        children: [logo && (typeof logo === 'string' ? /*#__PURE__*/jsx(Image, {
+          src: logo,
+          alt: "Auth",
+          h: logoWidth,
+          fit: "contain"
+        }) : logo), title && /*#__PURE__*/jsx(Title, {
+          order: 4,
+          children: title
+        })]
+      }),
+      ...modalProps,
+      children: /*#__PURE__*/jsxs(Stack, {
+        gap: "sm",
+        children: [subtitle && /*#__PURE__*/jsx(Text, {
+          size: "sm",
+          c: "dimmed",
+          children: subtitle
+        }), children]
+      })
+    });
+  }
+
+  // Renderizar como Card (default)
+  return /*#__PURE__*/jsx(Paper, {
+    withBorder: true,
+    shadow: "none",
+    p: 24
+    /*
+     * `w` fixo nao encolhe: num celular de 375px o cartao de 350px
+     * mais o padding da pagina estourava a tela e a coluna da direita
+     * ficava cortada. `maw` mantem a MESMA largura onde ela cabe e
+     * cede onde nao cabe.
+     */,
+    w: "100%",
+    maw: width,
+    radius: 0,
+    ...props,
+    children: content
+  });
+}
+
+const MARKS = {
+  google: IconBrandGoogle
+};
+
+/**
+ * The social sign-in buttons, driven by what the APPLICATION has enabled.
+ *
+ * WHY THE LIST IS FETCHED AND NOT PASSED IN
+ *
+ * The owner configures Google in the Auth panel. Asking the integrator to ALSO
+ * declare it in code would be two sources for one fact, and they would drift:
+ * turning the provider off in the panel would leave a button that fails. So the
+ * component asks the worker which providers are live.
+ *
+ * It renders NOTHING while it does not know, and nothing when the answer is
+ * empty — an application with no social provider sees no divider, no gap, no
+ * trace of this component.
+ */
+function SocialButtons({
+  labels = {},
+  redirect,
+  disabled = false
+}) {
+  const [providers, setProviders] = useState(null);
+  const [leaving, setLeaving] = useState(null);
+  useEffect(() => {
+    let active = true;
+    getSocialProviders().then(list => {
+      // The screen may have unmounted while the request was in flight.
+      if (active) setProviders(list);
+    });
+    return () => {
+      active = false;
+    };
+  }, []);
+
+  // `null` is "still asking", `[]` is "asked, and there are none". Both render
+  // nothing, but only the second is a final answer.
+  if (!providers || providers.length === 0) return null;
+  return /*#__PURE__*/jsxs(Stack, {
+    gap: "md",
+    children: [/*#__PURE__*/jsx(Divider, {
+      label: labels.socialDivider || 'ou',
+      labelPosition: "center"
+    }), providers.map(provider => {
+      const Mark = MARKS[provider.provider];
+      return /*#__PURE__*/jsx(Button, {
+        variant: "default",
+        fullWidth: true,
+        size: "md"
+        /*
+         * `aria-disabled`, not `disabled`: Mantine's `disabled`
+         * repaints the button grey and hides its label, and this
+         * button is what the person is trying to click. The
+         * handler below is what actually refuses.
+         */,
+        "aria-disabled": disabled || leaving !== null,
+        loading: leaving === provider.provider,
+        onClick: () => {
+          if (disabled || leaving !== null) return;
+          // Kept in state so a double click does not fire two
+          // navigations — the second would orphan the first
+          // `oauth_states` row.
+          setLeaving(provider.provider);
+          startSocialSignIn(provider.provider, {
+            redirect
+          });
+        },
+        children: /*#__PURE__*/jsxs(Group, {
+          gap: 10,
+          wrap: "nowrap",
+          justify: "center",
+          children: [Mark && /*#__PURE__*/jsx(Mark, {
+            size: 16,
+            stroke: 1.5
+          }), /*#__PURE__*/jsx(Text, {
+            fz: 14,
+            fw: 700,
+            children: labels.socialButton ? labels.socialButton(provider.name) : `Entrar com ${provider.name}`
+          })]
+        })
+      }, provider.provider);
+    })]
+  });
+}
+
+function Wordmark({
+  fz = 11,
+  c = 'gray.4',
+  ...props
+}) {
+  return /*#__PURE__*/jsx(Text, {
+    component: "span",
+    display: "block",
+    ta: "center",
+    fz: fz,
+    fw: 800,
+    lh: 1,
+    tt: "uppercase",
+    lts: "1.5px",
+    c: c,
+    ...props,
+    children: "Auth"
+  });
+}
+
+const TERMS_URL = 'https://myinfrastructure.click/legal/terms';
+
+/**
+ * The terms notice under the first step.
+ *
+ * It sits on step ONE and nowhere else: the account is born on the first
+ * `verify` and there is no separate sign-up screen to put it on — this form IS
+ * the sign-up for whoever has never entered. On step two the person already
+ * agreed by asking for the code; repeating it there would only push the code
+ * field down.
+ */
+function TermsNotice({
+  url,
+  text,
+  linkText
+}) {
+  if (!url) return null;
+  return /*#__PURE__*/jsxs(Text, {
+    size: "xs",
+    c: "dimmed",
+    ta: "center"
+    /*
+     * Tighter than the `gap="md"` of the Stack around it, and a hair
+     * tighter than default leading. This is fine print under the action,
+     * not a third step of the form — spaced like the field and the
+     * button it would read as one more thing to do.
+     */,
+    mt: -4,
+    lh: 1.4
+    /*
+     * Two short lines instead of one full-width line plus an orphan.
+     * At the card's 350px the sentence wrapped as "…todos os / nossos
+     * termos e condições", splitting the phrase away from the words that
+     * govern it. Balanced, the break falls where the meaning does.
+     */,
+    style: {
+      textWrap: 'balance'
+    },
+    children: [text, ' ', /*#__PURE__*/jsx(Anchor, {
+      href: url,
+      target: "_blank"
+      /*
+       * `noopener noreferrer` with `target="_blank"`: the same pair the
+       * footers of the house use for anything leaving the origin
+       * (`site-chrome.jsx`, `ProductLayout.jsx`). Opening in a new tab
+       * is not decoration here — the person is mid-sign-in, and
+       * navigating away would throw the typed email out.
+       */,
+      rel: "noopener noreferrer"
+      /*
+       * `inherit` takes the size and weight of the sentence around it,
+       * so the link does not turn into a bold island inside the fine
+       * print — but it also takes the COLOR, and in the Zen palette
+       * `primaryColor: 'gray'` paints the Anchor near-black. Against
+       * dimmed text that reads as emphasis, not as something to click.
+       *
+       * The underline is what says "link" here: it survives whatever
+       * `primaryColor` each panel sets, and it is the only affordance
+       * left once the colour matches the sentence.
+       */,
+      inherit: true,
+      c: "inherit",
+      underline: "always",
+      children: linkText
+    }), "."]
+  });
+}
+
+// The OAuth flow's pass-through screen.
+//
+// The panel is not the destination here: the user is authorizing an MCP client
+// and only passes through this origin because it is where the token lives. A
+// blank screen during the detour looks like a freeze; this one says what is
+// happening.
+function AuthTransition({
+  label = 'Conectando…'
+}) {
+  return /*#__PURE__*/jsx(Center, {
+    style: {
+      minHeight: '60vh'
+    },
+    children: /*#__PURE__*/jsxs(Stack, {
+      align: "center",
+      gap: "sm",
+      children: [/*#__PURE__*/jsx(Loader, {
+        size: "xs"
+      }), /*#__PURE__*/jsx(Text, {
+        size: "sm",
+        c: "dimmed",
+        children: label
+      })]
+    })
+  });
+}
+
+/**
+ * Sign in — the only path there is.
+ *
+ * Two steps: the email receives a code, the code becomes a session. There is no
+ * password, magic link, sign-up or recovery — first-time arrivals and returning
+ * people walk exactly this screen, and the account is born on the first entry.
+ *
+ * Nothing here builds a callback URL. The code is typed in this very tab, so
+ * there is no destination to validate — which is why the family of
+ * origin/redirect bugs does not reach this flow.
+ *
+ * @param {object} props
+ * @param {'card'|'modal'} [props.variant='card'] - Rendering mode
+ * @param {boolean} [props.opened] - Visibility (only for variant="modal")
+ * @param {function} [props.onClose] - Close callback (only for variant="modal")
+ */
+function SignIn({
+  // Configuration
+  logo,
+  // No default: it is computed below
+  logoWidth = 133,
+  title = 'Entrar',
+  subtitle = 'Enviaremos um código para o seu e-mail',
+  // Variant
+  variant = 'card',
+  opened,
+  onClose,
+  modalProps = {},
+  // Where to send someone who ALREADY has a session and lands on this screen.
+  // The landings link straight to /auth/signin without knowing a session
+  // exists; without this, a signed-in user faced the form again. `null`
+  // disables the detour.
+  authenticatedRedirect = '/',
+  // Shown while the session is being resolved and during the detour of an
+  // already authenticated person. Avoids flashing the form to someone who
+  // should never see it.
+  redirectingFallback = null,
+  // Callbacks
+  onSuccess,
+  // Post-sign-in redirect: by default the component honours `?redirect=` from
+  // the URL, validating against the API's origin and the current one.
+  // `redirectOrigins` adds domains; `handleRedirect={false}` hands control back
+  // to the app.
+  handleRedirect = true,
+  redirectOrigins = [],
+  onError,
+  onCodeSent,
+  // Custom labels
+  labels = {},
+  // The terms notice under the first step. `null` removes it — an internal
+  // panel behind a VPN has no one to present terms to.
+  termsUrl = TERMS_URL,
+  /*
+   * Social sign-in buttons.
+   *
+   * `'auto'` — the default — shows whatever the APPLICATION enabled in the
+   * Auth panel, and nothing at all when it enabled none. It is additive: an
+   * application with no provider configured renders exactly what it rendered
+   * before this prop existed, so the default does not break anyone.
+   *
+   * `false` opts out entirely, for a screen that wants the emailed code only.
+   */
+  socialLogin = 'auto',
+  ...cardProps
+}) {
+  const user = useAuthStore(s => s.user);
+  const authLoading = useAuthStore(s => s.loading);
+  const requestCode = useAuthStore(s => s.requestCode);
+  const verifyCode = useAuthStore(s => s.verifyCode);
+  const sending = useAuthStore(s => s.loadingStates.requestCode);
+  const verifying = useAuthStore(s => s.loadingStates.verifyCode);
+
+  // Which step we are on. The email is kept because the second step has to
+  // present it again: it is the (email, code) pair the server validates.
+  const [sentTo, setSentTo] = useState(null);
+  const [code, setCode] = useState('');
+  const [codeError, setCodeError] = useState(null);
+
+  // Hook that fetches the application's logo
+  const applicationLogo = useApplicationLogo();
+  const finalLogo = logo || applicationLogo || /*#__PURE__*/jsx(Wordmark, {});
+  const navigate = useNavigate();
+  const form = useForm({
+    initialValues: {
+      email: ''
+    },
+    validate: {
+      email: value => /^\S+@\S+$/.test(value) ? null : labels.invalidEmail || 'Email inválido'
+    }
+  });
+
+  // Whoever already has a session must not see the form. The landings point
+  // to /auth/signin unconditionally, and since the session became shared
+  // across `.myinfrastructure.click` (domain cookie) it is common to arrive here
+  // already authenticated — the panel used to learn that only after a
+  // redundant sign-in.
+  //
+  // It waits for `authLoading`: the provider's `init` resolves the session
+  // asynchronously (cookie → /auth/session). Deciding before that would flash
+  // the form to someone already signed in, or worse, redirect based on a
+  // `user` that has not loaded yet.
+  // `redirectOrigins` defaults to `[]` — a new array on every render. Used raw
+  // as a dependency, it would re-run the effect in a loop.
+  const redirectOriginsKey = JSON.stringify(redirectOrigins);
+  useEffect(() => {
+    if (authLoading || !user) return;
+
+    // `?redirect=` takes priority: whoever arrived through an OAuth flow
+    // needs to go back there, not to the panel's home. Same decision as the
+    // post-sign-in one, with the same origin validation.
+    const target = (handleRedirect ? getRedirectFromLocation(redirectOrigins) : null) || authenticatedRedirect;
+
+    // `authenticatedRedirect={null}` disables the courtesy detour for
+    // someone already signed in — but NOT the return of an OAuth flow, which
+    // is an authorization in progress, not a convenience. The guard above
+    // used to block both together.
+    if (!target) return;
+    applyRedirect(target, navigate);
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- redirectOrigins enters through the serialized key above
+  }, [authLoading, user, authenticatedRedirect, handleRedirect, redirectOriginsKey, navigate]);
+
+  // Step 1 — ask for the code.
+  const handleRequest = async values => {
+    if (sending) return;
+    try {
+      await requestCode(values.email);
+      setSentTo(values.email);
+      setCode('');
+      setCodeError(null);
+      onCodeSent?.(values.email);
+    } catch (error) {
+      onError?.(error);
+    }
+  };
+
+  // Step 2 — trade the code for the session.
+  //
+  // The redirect is decided AND EXECUTED before onSuccess.
+  //
+  // Deciding beforehand was not enough: the app usually calls `navigate('/')`
+  // inside onSuccess, so that navigation happened first and the following
+  // `applyRedirect` ran with the route already changed. `redirectHandled`
+  // protected against that, but only for whoever remembered to honour it — and
+  // half the panels did not, which made the OAuth handoff lose the `#token=`
+  // and end in "Sessão inválida ou expirada".
+  //
+  // Executing here, the OAuth flow's destination no longer depends on each
+  // application getting the contract right. `onSuccess` is still always called
+  // (the app still shows its notification), and `redirectHandled` still
+  // signals that navigation was taken over — now as information, not as a
+  // trap.
+  const handleVerify = async value => {
+    setCodeError(null);
+    try {
+      const result = await verifyCode(sentTo, value);
+      const target = handleRedirect ? getRedirectFromLocation(redirectOrigins) : null;
+      if (target) applyRedirect(target, navigate);
+      onSuccess?.(result?.user ?? null, {
+        result,
+        redirectHandled: !!target
+      });
+    } catch (error) {
+      // The code error belongs to the field, not to the global
+      // notification: the person is looking at the eight characters they
+      // just typed.
+      setCodeError(error?.message || labels.invalidCode || 'Código inválido.');
+      setCode('');
+      onError?.(error);
+    }
+  };
+
+  // Does not render the form for someone who already has a session: the effect
+  // above is redirecting, and showing the fields in that window would flash
+  // the screen "in between" — the symptom the landing linking straight here
+  // exposed. `authLoading` covers the instant before the cookie resolves.
+  //
+  // `?redirect=` counts on its own. In an OAuth flow the panel is a
+  // PASS-THROUGH, not a destination: the token lives in this origin's
+  // localStorage and the worker cannot reach it, so the browser has to come
+  // through here — but the user should not notice. Without this part of the
+  // condition, whoever arrived with an unresolved session still saw the panel
+  // screen before the detour.
+  const oauthPending = handleRedirect && !!getRedirectFromLocation(redirectOrigins);
+  const willRedirect = (!!authenticatedRedirect || oauthPending) && (authLoading || !!user);
+  if (willRedirect) return oauthPending ? redirectingFallback ?? /*#__PURE__*/jsx(AuthTransition, {}) : redirectingFallback;
+  return /*#__PURE__*/jsx(AuthCard, {
+    logo: finalLogo,
+    logoWidth: logoWidth,
+    title: title,
+    subtitle: sentTo ? labels.codeSent || 'Digite o código que enviamos' : subtitle,
+    variant: variant,
+    opened: opened,
+    onClose: onClose,
+    modalProps: modalProps,
+    ...cardProps,
+    children: !sentTo ? /*#__PURE__*/jsx("form", {
+      onSubmit: form.onSubmit(handleRequest),
+      children: /*#__PURE__*/jsxs(Stack, {
+        gap: "md",
+        children: [/*#__PURE__*/jsx(TextInput, {
+          label: labels.email || 'Email',
+          placeholder: labels.emailPlaceholder || 'seu@email.com',
+          type: "email",
+          autoFocus: true,
+          autoComplete: "email",
+          ...form.getInputProps('email'),
+          /*
+           * `readOnly`, not `disabled`: Mantine's `disabled`
+           * fades the field while the request is in flight, and
+           * the value the person just typed is what they are
+           * looking at. `readOnly` locks editing and leaves the
+           * field legible.
+           */
+          readOnly: sending
+        }), /*#__PURE__*/jsx(Button, {
+          type: "submit",
+          fullWidth: true
+          /*
+           * `aria-disabled`, never `disabled`: `disabled`
+           * repaints the button grey, and the white Loader
+           * vanishes inside it — the action IN PROGRESS ends up
+           * weighing less on screen than a button standing
+           * still. With `aria-disabled` the button stays black,
+           * the spinner shows, and the guard on submit blocks
+           * the repeated click.
+           *
+           * And the spinner goes in `leftSection`: Mantine's
+           * `loading` prop hides the label, and a button with
+           * no word does not say what is happening.
+           */,
+          "aria-disabled": sending,
+          leftSection: sending ? /*#__PURE__*/jsx(Loader, {
+            size: 14,
+            color: "gray.0"
+          }) : null,
+          rightSection: /*#__PURE__*/jsx(IconArrowRight, {
+            size: 16
+          }),
+          children: sending ? labels.sendingCode || 'Enviando…' : labels.sendCodeButton || 'Enviar código'
+        }), socialLogin !== false && /*#__PURE__*/jsx(SocialButtons, {
+          labels: labels,
+          disabled: sending
+        }), /*#__PURE__*/jsx(TermsNotice, {
+          url: termsUrl,
+          text: labels.termsNotice || 'Criando uma conta, você concorda com todos os nossos',
+          linkText: labels.termsLink || 'termos e condições'
+        })]
+      })
+    }) : /*#__PURE__*/jsxs(Stack, {
+      gap: "md",
+      children: [/*#__PURE__*/jsx(TextInput, {
+        label: labels.codeLabel || 'Código de acesso'
+        /*
+         * The email is the field's description, not the subtitle:
+         * as a subtitle it wrapped onto two lines and competed for
+         * weight with the title. Here it sits where the person
+         * checks it — right above what they are about to type.
+         */,
+        description: `${labels.codeSentTo || 'Enviado para'} ${sentTo}`,
+        placeholder: "ABCD-EFGH"
+        /*
+         * One field, not eight boxes. Eight boxes is the numeric
+         * OTP pattern; this code is alphanumeric and dictated
+         * aloud — in a single field paste works, the screen reader
+         * reads one thing, and the hyphen the person types is
+         * accepted (`normalizeUserCode` in the worker drops it).
+         */,
+        value: code,
+        onChange: event => {
+          setCode(event.currentTarget.value);
+          if (codeError) setCodeError(null);
+        },
+        onKeyDown: event => {
+          if (event.key === 'Enter' && code.trim()) handleVerify(code);
+        },
+        autoFocus: true,
+        autoComplete: "one-time-code",
+        readOnly: verifying,
+        error: codeError
+      }), /*#__PURE__*/jsx(Button, {
+        type: "button",
+        fullWidth: true
+        // Same reason as the previous step: `disabled` would fade
+        // the button exactly while signing in happens. With no
+        // code typed it stays genuinely disabled — there is no
+        // action in progress to hide there.
+        ,
+        "aria-disabled": verifying,
+        disabled: !code.trim(),
+        onClick: verifying ? undefined : () => handleVerify(code),
+        leftSection: verifying ? /*#__PURE__*/jsx(Loader, {
+          size: 14,
+          color: "gray.0"
+        }) : null,
+        rightSection: /*#__PURE__*/jsx(IconArrowRight, {
+          size: 16
+        }),
+        children: verifying ? labels.verifyingCode || 'Entrando…' : labels.confirmCode || 'Confirmar'
+      }), /*#__PURE__*/jsxs(Group, {
+        justify: "space-between",
+        gap: "xs",
+        children: [/*#__PURE__*/jsx(Anchor, {
+          size: "sm",
+          c: "dimmed",
+          onClick: () => {
+            setSentTo(null);
+            setCode('');
+            setCodeError(null);
+          },
+          children: labels.changeEmail || 'Usar outro e-mail'
+        }), /*#__PURE__*/jsx(Anchor, {
+          size: "sm",
+          c: "dimmed",
+          onClick: sending ? undefined : () => handleRequest({
+            email: sentTo
+          }),
+          children: sending ? labels.sendingCode || 'Enviando…' : labels.resendCode || 'Reenviar código'
+        })]
+      })]
+    })
+  });
+}
+
+function UserProfile({
+  // Variant
+  variant = 'modal',
+  opened,
+  onClose,
+  // Callbacks
+  onProfileUpdate,
+  onSessionRevoked,
+  onOtherSessionsRevoked,
+  onError,
+  // Features toggle
+  showAvatar = true,
+  showName = true,
+  showEmail = true,
+  showSessions = true,
+  // Customização
+  labels = {},
+  title = 'Account',
+  subtitle = 'Manage your account info.',
+  logo,
+  logoHeight = 28,
+  width = 500,
+  // Avatar config
+  maxAvatarSize = 500 * 1024,
+  // 500KB
+
+  // Custom sections (React nodes to render after built-in sections)
+  customSections,
+  ...containerProps
+}) {
+  // Local state - which section is expanded
+  const [editingSection, setEditingSection] = useState(null); // 'password' | 'email' | 'name' | 'avatar' | null
+
+  // Hook para profile
+  const {
+    user,
+    updateProfile,
+    loadingUpdateProfile
+  } = useUser();
+
+  // Hook para sessions
+  const {
+    currentSession,
+    sessions,
+    listSessions,
+    getSession,
+    revokeSession,
+    revokeOtherSessions,
+    loadingListSessions,
+    loadingRevokeSession
+  } = useSessions();
+
+  // Load sessions when opened (modal) or component mounts (card), and when sessions section is opened
+  useEffect(() => {
+    if (showSessions && (variant === 'card' || opened)) {
+      // Fetch current session first to get the session ID, then list all sessions
+      getSession().catch(err => console.warn('Failed to get current session:', err));
+      listSessions().catch(err => console.warn('Failed to load sessions:', err));
+    }
+  }, [opened, showSessions, variant]);
+
+  // Helper to parse user agent string
+  const parseUserAgent = ua => {
+    if (!ua) return {
+      browser: 'Unknown Browser',
+      os: 'Unknown OS'
+    };
+    let browser = 'Unknown Browser';
+    let os = 'Unknown OS';
+
+    // Detect browser
+    if (ua.includes('Chrome') && !ua.includes('Edg')) browser = 'Chrome';else if (ua.includes('Firefox')) browser = 'Firefox';else if (ua.includes('Safari') && !ua.includes('Chrome')) browser = 'Safari';else if (ua.includes('Edg')) browser = 'Edge';else if (ua.includes('Opera') || ua.includes('OPR')) browser = 'Opera';
+
+    // Detect OS
+    if (ua.includes('Windows')) os = 'Windows';else if (ua.includes('Mac OS')) os = 'macOS';else if (ua.includes('Linux')) os = 'Linux';else if (ua.includes('Android')) os = 'Android';else if (ua.includes('iPhone') || ua.includes('iPad')) os = 'iOS';
+    return {
+      browser,
+      os
+    };
+  };
+
+  // Session handlers
+  const handleRevokeSession = async sessionId => {
+    // Check if revoking current session
+    const isCurrentSession = sessionId === currentSession?.id || sessions.length === 1;
+
+    // If revoking current session, handle logout immediately after revocation
+    if (isCurrentSession) {
+      try {
+        await revokeSession(sessionId);
+        onSessionRevoked?.(sessionId);
+      } catch (error) {
+        onError?.(error);
+        // Even if it fails, we're revoking our own session, so just logout
+        // The server already revoked our session
+      }
+      // Clear auth state and redirect
+      localStorage.removeItem('auth:token');
+      window.dispatchEvent(new CustomEvent('auth:session-revoked'));
+      if (variant === 'modal') onClose?.();
+      return;
+    }
+
+    // Revoking another session
+    try {
+      await revokeSession(sessionId);
+      onSessionRevoked?.(sessionId);
+    } catch (error) {
+      // Check for 401 error (our SDK uses error.res, axios uses error.response)
+      const status = error.res?.status || error.response?.status;
+      if (status === 401) {
+        // This means our session was revoked, not the target one - do logout
+        localStorage.removeItem('auth:token');
+        window.dispatchEvent(new CustomEvent('auth:session-revoked'));
+        if (variant === 'modal') onClose?.();
+        return;
+      }
+      onError?.(error);
+    }
+  };
+  const handleRevokeOtherSessions = async () => {
+    try {
+      await revokeOtherSessions();
+      onOtherSessionsRevoked?.();
+    } catch (error) {
+      onError?.(error);
+    }
+  };
+
+  // Name form
+  const nameForm = useForm({
+    initialValues: {
+      name: ''
+    },
+    validate: {
+      name: v => !v ? labels.nameRequired || 'Nome obrigatório' : null
+    }
+  });
+
+  // Avatar state (base64)
+  const [avatarPreview, setAvatarPreview] = useState(null);
+  const [avatarFile, setAvatarFile] = useState(null);
+
+  // Handle file selection and convert to base64
+  const handleAvatarFileChange = file => {
+    if (!file) {
+      setAvatarPreview(null);
+      setAvatarFile(null);
+      return;
+    }
+
+    // Validate file type
+    if (!file.type.startsWith('image/')) {
+      onError?.(new Error(labels.avatarInvalidType || 'Por favor, selecione uma imagem válida'));
+      return;
+    }
+
+    // Validate file size
+    if (file.size > maxAvatarSize) {
+      onError?.(new Error(labels.avatarTooLarge || `Imagem muito grande. Máximo ${Math.round(maxAvatarSize / 1024)}KB.`));
+      return;
+    }
+    setAvatarFile(file);
+
+    // Convert to base64
+    const reader = new FileReader();
+    reader.onloadend = () => {
+      setAvatarPreview(reader.result);
+    };
+    reader.readAsDataURL(file);
+  };
+
+  // Populate forms when user data is available or section opens
+  useEffect(() => {
+    if (editingSection === 'name' && user?.name) {
+      nameForm.setValues({
+        name: user.name
+      });
+    }
+    if (editingSection === 'avatar' && user?.image) {
+      setAvatarPreview(user.image);
+    }
+  }, [editingSection, user]);
+  const handleToggleSection = section => {
+    if (editingSection === section) {
+      setEditingSection(null);
+      nameForm.reset();
+      setAvatarPreview(null);
+      setAvatarFile(null);
+    } else {
+      setEditingSection(section);
+    }
+  };
+  const handleChangeName = async values => {
+    try {
+      await updateProfile({
+        name: values.name
+      });
+      nameForm.reset();
+      setEditingSection(null);
+      onProfileUpdate?.({
+        name: values.name
+      });
+    } catch (error) {
+      onError?.(error);
+    }
+  };
+  const handleChangeAvatar = async () => {
+    if (!avatarPreview) {
+      // Optionally handle this validation error via callback or just return?
+      // Since it's a validation error before async call, we might want to expose it too?
+      // The original code used notifications. Let's send to onError for consistency or just return if it's UI state.
+      // Actually, for validation within the component, maybe we can just let it be silent or use form error if applicable?
+      // But this is outside form context. Let's use onError with a custom error object.
+      onError?.(new Error(labels.avatarRequired || 'Selecione uma imagem'));
+      return;
+    }
+    try {
+      await updateProfile({
+        image: avatarPreview
+      });
+      setAvatarPreview(null);
+      setAvatarFile(null);
+      setEditingSection(null);
+      onProfileUpdate?.({
+        image: avatarPreview
+      });
+    } catch (error) {
+      onError?.(error);
+    }
+  };
+  const handleRemoveAvatar = async () => {
+    try {
+      await updateProfile({
+        image: ''
+      });
+      setAvatarPreview(null);
+      setAvatarFile(null);
+      setEditingSection(null);
+      onProfileUpdate?.({
+        image: ''
+      });
+    } catch (error) {
+      onError?.(error);
+    }
+  };
+
+  // Reusable Section Header
+  const SectionHeader = ({
+    icon: Icon,
+    sectionTitle,
+    description
+  }) => /*#__PURE__*/jsxs(Group, {
+    gap: "sm",
+    mb: "lg",
+    children: [/*#__PURE__*/jsx(ThemeIcon, {
+      size: 36,
+      variant: "subtle",
+      color: "gray",
+      children: /*#__PURE__*/jsx(Icon, {
+        size: 28,
+        stroke: 1.5
+      })
+    }), /*#__PURE__*/jsxs(Stack, {
+      gap: 0,
+      children: [/*#__PURE__*/jsx(Text, {
+        fw: 600,
+        size: "sm",
+        children: sectionTitle
+      }), description && /*#__PURE__*/jsx(Text, {
+        size: "xs",
+        c: "dimmed",
+        children: description
+      })]
+    })]
+  });
+
+  // Reusable Row component
+  const SettingRow = ({
+    label,
+    children,
+    action,
+    actionLabel,
+    onClick,
+    expanded
+  }) => /*#__PURE__*/jsx(Box, {
+    py: "xs",
+    children: /*#__PURE__*/jsxs(Group, {
+      justify: "space-between",
+      wrap: "nowrap",
+      align: "center",
+      children: [/*#__PURE__*/jsxs(Group, {
+        gap: "xl",
+        wrap: "nowrap",
+        flex: 1,
+        children: [/*#__PURE__*/jsx(Text, {
+          size: "sm",
+          c: "dimmed",
+          w: 100,
+          children: label
+        }), /*#__PURE__*/jsx(Box, {
+          flex: 1,
+          children: children
+        })]
+      }), action && /*#__PURE__*/jsx(Tooltip, {
+        label: actionLabel || action,
+        position: "left",
+        children: /*#__PURE__*/jsx(Anchor, {
+          size: "xs",
+          fw: 300,
+          onClick: onClick,
+          c: "gray",
+          underline: "none",
+          children: expanded ? labels.cancel || 'Cancel' : action
+        })
+      })]
+    })
+  });
+
+  // Conteúdo interno compartilhado
+  const profileContent = /*#__PURE__*/jsxs(Fragment, {
+    children: [(showAvatar || showName || showEmail) && /*#__PURE__*/jsxs(Box, {
+      mb: "lg",
+      children: [/*#__PURE__*/jsx(SectionHeader, {
+        icon: IconUser,
+        sectionTitle: labels.profileSection || 'Profile',
+        description: labels.profileDescription || 'Your personal information'
+      }), /*#__PURE__*/jsxs(Stack, {
+        gap: "sm",
+        children: [showAvatar && /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsx(SettingRow, {
+            label: labels.avatar || 'Avatar',
+            action: labels.update || 'Update',
+            actionLabel: labels.updateAvatar || 'Update your profile picture',
+            onClick: () => handleToggleSection('avatar'),
+            expanded: editingSection === 'avatar',
+            children: /*#__PURE__*/jsx(Group, {
+              gap: "md",
+              children: /*#__PURE__*/jsx(Avatar, {
+                src: user?.image,
+                name: user?.name || user?.email,
+                size: 48,
+                radius: "xl"
+                // color="initials"
+              })
+            })
+          }), /*#__PURE__*/jsx(Collapse, {
+            in: editingSection === 'avatar',
+            children: /*#__PURE__*/jsx(Paper, {
+              p: "sm",
+              withBorder: true,
+              radius: "sm",
+              children: /*#__PURE__*/jsxs(Stack, {
+                gap: "md",
+                align: "center",
+                children: [/*#__PURE__*/jsx(FileButton, {
+                  onChange: handleAvatarFileChange,
+                  accept: "image/*",
+                  children: props => /*#__PURE__*/jsx(Tooltip, {
+                    label: labels.clickToChange || 'Clique para alterar',
+                    position: "bottom",
+                    children: /*#__PURE__*/jsxs(Box, {
+                      ...props,
+                      pos: "relative",
+                      style: {
+                        cursor: 'pointer'
+                      },
+                      children: [/*#__PURE__*/jsx(Avatar, {
+                        src: avatarPreview || user?.image,
+                        name: user?.name || user?.email,
+                        size: 80,
+                        radius: 80,
+                        color: "gray"
+                      }), /*#__PURE__*/jsx(ThemeIcon, {
+                        size: 26,
+                        radius: "xl",
+                        color: "gray",
+                        pos: "absolute",
+                        bottom: 0,
+                        right: 0,
+                        bd: "2px solid body",
+                        children: /*#__PURE__*/jsx(IconPhoto, {
+                          size: 14,
+                          stroke: 1.5
+                        })
+                      })]
+                    })
+                  })
+                }), /*#__PURE__*/jsx(Text, {
+                  size: "xs",
+                  c: "dimmed",
+                  ta: "center",
+                  children: labels.avatarHint || `Máximo ${Math.round(maxAvatarSize / 1024)}KB • JPG, PNG, GIF, WebP`
+                }), /*#__PURE__*/jsxs(Group, {
+                  justify: "center",
+                  gap: "xs",
+                  children: [user?.image && /*#__PURE__*/jsx(Button, {
+                    variant: "subtle",
+                    color: "gray",
+                    size: "xs",
+                    onClick: handleRemoveAvatar,
+                    loading: loadingUpdateProfile,
+                    loaderProps: {
+                      size: 12
+                    },
+                    leftSection: /*#__PURE__*/jsx(IconTrash, {
+                      size: 14,
+                      stroke: 1.5
+                    }),
+                    children: labels.remove || 'Remover'
+                  }), /*#__PURE__*/jsx(Button, {
+                    variant: "default",
+                    size: "xs",
+                    onClick: () => handleToggleSection('avatar'),
+                    children: labels.cancel || 'Cancelar'
+                  }), /*#__PURE__*/jsx(Button, {
+                    size: "xs",
+                    loading: loadingUpdateProfile,
+                    loaderProps: {
+                      size: 12
+                    },
+                    leftSection: /*#__PURE__*/jsx(IconCheck, {
+                      size: 14,
+                      stroke: 1.5
+                    }),
+                    onClick: handleChangeAvatar,
+                    disabled: !avatarPreview || avatarPreview === user?.image,
+                    children: labels.save || 'Salvar'
+                  })]
+                })]
+              })
+            })
+          })]
+        }), showName && /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsx(SettingRow, {
+            label: labels.name || 'Nome',
+            action: labels.change || 'Change',
+            actionLabel: labels.changeName || 'Change your display name',
+            onClick: () => handleToggleSection('name'),
+            expanded: editingSection === 'name',
+            children: /*#__PURE__*/jsxs(Group, {
+              gap: "xs",
+              children: [/*#__PURE__*/jsx(IconPencil, {
+                size: 18,
+                stroke: 1.5,
+                color: "var(--mantine-color-dimmed)"
+              }), /*#__PURE__*/jsx(Text, {
+                size: "sm",
+                children: user?.name || labels.notDefined || 'Não definido'
+              })]
+            })
+          }), /*#__PURE__*/jsx(Collapse, {
+            in: editingSection === 'name',
+            children: /*#__PURE__*/jsx(Paper, {
+              p: "sm",
+              withBorder: true,
+              radius: "sm",
+              children: /*#__PURE__*/jsx("form", {
+                onSubmit: nameForm.onSubmit(handleChangeName),
+                children: /*#__PURE__*/jsxs(Stack, {
+                  gap: "sm",
+                  children: [/*#__PURE__*/jsx(TextInput, {
+                    label: labels.name || 'Nome',
+                    placeholder: labels.namePlaceholder || 'Digite seu nome',
+                    leftSection: /*#__PURE__*/jsx(IconUser, {
+                      size: 16,
+                      stroke: 1.5
+                    }),
+                    ...nameForm.getInputProps('name')
+                  }), /*#__PURE__*/jsxs(Group, {
+                    justify: "flex-end",
+                    gap: "xs",
+                    children: [/*#__PURE__*/jsx(Button, {
+                      variant: "default",
+                      size: "xs",
+                      onClick: () => handleToggleSection('name'),
+                      children: labels.cancel || 'Cancelar'
+                    }), /*#__PURE__*/jsx(Button, {
+                      type: "submit",
+                      size: "xs",
+                      loading: loadingUpdateProfile,
+                      loaderProps: {
+                        size: 12
+                      },
+                      leftSection: /*#__PURE__*/jsx(IconCheck, {
+                        size: 14,
+                        stroke: 1.5
+                      }),
+                      children: labels.save || 'Salvar'
+                    })]
+                  })]
+                })
+              })
+            })
+          })]
+        }), showEmail && /*#__PURE__*/jsx(SettingRow, {
+          label: labels.email || 'Email',
+          children: /*#__PURE__*/jsxs(Group, {
+            gap: "xs",
+            children: [/*#__PURE__*/jsx(IconMail, {
+              size: 18,
+              stroke: 1.5,
+              color: "var(--mantine-color-dimmed)"
+            }), /*#__PURE__*/jsx(Text, {
+              size: "sm",
+              children: user?.email || 'email@exemplo.com'
+            })]
+          })
+        })]
+      })]
+    }), showSessions && /*#__PURE__*/jsxs(Box, {
+      mb: "md",
+      children: [/*#__PURE__*/jsx(SectionHeader, {
+        icon: IconShield,
+        sectionTitle: labels.securitySection || 'Security',
+        description: labels.securityDescription || 'Protect your account'
+      }), /*#__PURE__*/jsx(Stack, {
+        gap: "sm",
+        children: showSessions && /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsx(SettingRow, {
+            label: labels.sessions || 'Sessions',
+            action: editingSection === 'sessions' ? labels.close || 'Close' : labels.manage || 'Manage',
+            actionLabel: labels.manageSessions || 'Manage your active sessions',
+            onClick: () => handleToggleSection('sessions'),
+            expanded: editingSection === 'sessions',
+            children: /*#__PURE__*/jsxs(Group, {
+              gap: "xs",
+              children: [/*#__PURE__*/jsx(IconDevices, {
+                size: 18,
+                stroke: 1.5,
+                color: "var(--mantine-color-dimmed)"
+              }), /*#__PURE__*/jsx(Text, {
+                size: "sm",
+                c: "dimmed",
+                children: sessions.length > 0 ? `${sessions.length} active session${sessions.length > 1 ? 's' : ''}` : loadingListSessions ? 'Loading...' : 'No sessions'
+              })]
+            })
+          }), /*#__PURE__*/jsx(Collapse, {
+            in: editingSection === 'sessions',
+            children: /*#__PURE__*/jsx(Paper, {
+              p: "sm",
+              withBorder: true,
+              radius: "sm",
+              children: /*#__PURE__*/jsx(Stack, {
+                gap: "xs",
+                children: loadingListSessions ? /*#__PURE__*/jsx(Text, {
+                  size: "xs",
+                  c: "dimmed",
+                  ta: "center",
+                  py: "md",
+                  children: labels.loadingSessions || 'Carregando sessões...'
+                }) : sessions.length === 0 ? /*#__PURE__*/jsx(Text, {
+                  size: "xs",
+                  c: "dimmed",
+                  ta: "center",
+                  py: "md",
+                  children: labels.noSessionsFound || 'Nenhuma sessão encontrada'
+                }) : /*#__PURE__*/jsxs(Fragment, {
+                  children: [sessions.map(sessionItem => {
+                    const isCurrentSession = sessionItem.id === currentSession?.id;
+                    const deviceInfo = parseUserAgent(sessionItem.userAgent);
+                    const createdDate = new Date(sessionItem.createdAt);
+                    return /*#__PURE__*/jsx(Paper, {
+                      p: "xs",
+                      withBorder: isCurrentSession,
+                      bd: isCurrentSession ? '1px solid gray' : undefined,
+                      radius: "sm",
+                      children: /*#__PURE__*/jsxs(Group, {
+                        justify: "space-between",
+                        wrap: "nowrap",
+                        align: "center",
+                        children: [/*#__PURE__*/jsxs(Group, {
+                          gap: "sm",
+                          wrap: "nowrap",
+                          flex: 1,
+                          children: [/*#__PURE__*/jsx(ThemeIcon, {
+                            size: 32,
+                            variant: "subtle",
+                            color: "gray",
+                            children: /*#__PURE__*/jsx(IconDeviceMobile, {
+                              size: 18,
+                              stroke: 1.5
+                            })
+                          }), /*#__PURE__*/jsxs(Box, {
+                            flex: 1,
+                            children: [/*#__PURE__*/jsxs(Group, {
+                              gap: "xs",
+                              children: [/*#__PURE__*/jsx(Text, {
+                                size: "xs",
+                                fw: 600,
+                                children: deviceInfo.browser
+                              }), isCurrentSession && /*#__PURE__*/jsx(Badge, {
+                                size: "xs",
+                                variant: "light",
+                                color: "gray",
+                                children: labels.thisDevice || 'Este dispositivo'
+                              })]
+                            }), /*#__PURE__*/jsxs(Text, {
+                              size: "xs",
+                              c: "dimmed",
+                              children: [deviceInfo.os, " \u2022 ", sessionItem.ipAddress || labels.unknownIP || 'IP desconhecido']
+                            }), /*#__PURE__*/jsxs(Text, {
+                              size: "xs",
+                              c: "dimmed",
+                              children: [labels.createdAt || 'Criada em', " ", createdDate.toLocaleDateString('pt-BR'), " ", labels.at || 'às', ' ', createdDate.toLocaleTimeString('pt-BR', {
+                                hour: '2-digit',
+                                minute: '2-digit'
+                              })]
+                            })]
+                          })]
+                        }), /*#__PURE__*/jsx(Tooltip, {
+                          label: isCurrentSession ? labels.signOutAndEnd || 'Encerrar e sair' : labels.endSession || 'Encerrar sessão',
+                          children: /*#__PURE__*/jsx(Button, {
+                            variant: "subtle",
+                            color: "gray",
+                            size: "xs",
+                            onClick: () => handleRevokeSession(sessionItem.id),
+                            loading: loadingRevokeSession === sessionItem.id,
+                            loaderProps: {
+                              size: 12
+                            },
+                            leftSection: /*#__PURE__*/jsx(IconLogout, {
+                              size: 14,
+                              stroke: 1.5
+                            }),
+                            children: labels.end || 'Encerrar'
+                          })
+                        })]
+                      })
+                    }, sessionItem.id);
+                  }), sessions.length > 1 && /*#__PURE__*/jsx(Group, {
+                    justify: "flex-end",
+                    mt: "xs",
+                    children: /*#__PURE__*/jsx(Button, {
+                      variant: "subtle",
+                      color: "gray",
+                      size: "xs",
+                      onClick: handleRevokeOtherSessions,
+                      loading: loadingRevokeSession === 'all',
+                      loaderProps: {
+                        size: 12
+                      },
+                      leftSection: /*#__PURE__*/jsx(IconLogout, {
+                        size: 14,
+                        stroke: 1.5
+                      }),
+                      children: labels.endOtherSessions || 'Encerrar todas as outras sessões'
+                    })
+                  })]
+                })
+              })
+            })
+          })]
+        })
+      })]
+    }), customSections]
+  });
+
+  // Renderizar como Modal
+  if (variant === 'modal') {
+    return /*#__PURE__*/jsxs(Modal, {
+      opened: opened,
+      onClose: onClose,
+      size: width,
+      withCloseButton: true,
+      radius: "md",
+      overlayProps: {
+        backgroundOpacity: 0.5,
+        blur: 4
+      },
+      title: /*#__PURE__*/jsxs(Group, {
+        gap: "sm",
+        children: [/*#__PURE__*/jsx(ThemeIcon, {
+          size: 32,
+          variant: "subtle",
+          color: "gray",
+          children: /*#__PURE__*/jsx(IconUserCircle, {
+            size: 24,
+            stroke: 1.5
+          })
+        }), /*#__PURE__*/jsxs(Stack, {
+          gap: 0,
+          children: [/*#__PURE__*/jsx(Title, {
+            order: 5,
+            fw: 600,
+            children: title
+          }), /*#__PURE__*/jsx(Text, {
+            size: "xs",
+            c: "dimmed",
+            children: subtitle
+          })]
+        })]
+      }),
+      ...containerProps,
+      children: [/*#__PURE__*/jsx(Divider, {
+        mb: "md"
+      }), profileContent]
+    });
+  }
+
+  // Renderizar como Card
+  return /*#__PURE__*/jsx(Paper, {
+    withBorder: true
+    // shadow="md"
+    ,
+    p: "md",
+    w: width,
+    radius: "md",
+    ...containerProps,
+    children: /*#__PURE__*/jsxs(Stack, {
+      gap: "sm",
+      children: [/*#__PURE__*/jsxs(Group, {
+        gap: "sm",
+        children: [logo ? /*#__PURE__*/jsx(Image, {
+          src: logo,
+          alt: "Auth",
+          h: logoHeight,
+          fit: "contain"
+        }) : /*#__PURE__*/jsx(ThemeIcon, {
+          size: 32,
+          variant: "subtle",
+          color: "gray",
+          children: /*#__PURE__*/jsx(IconUserCircle, {
+            size: 24,
+            stroke: 1.5
+          })
+        }), /*#__PURE__*/jsxs(Stack, {
+          gap: 0,
+          children: [/*#__PURE__*/jsx(Title, {
+            order: 5,
+            fw: 600,
+            children: title
+          }), /*#__PURE__*/jsx(Text, {
+            size: "xs",
+            c: "dimmed",
+            children: subtitle
+          })]
+        })]
+      }), /*#__PURE__*/jsx(Divider, {}), profileContent]
+    })
+  });
+}
+
+function UserInformation({
+  user,
+  signOut,
+  onAccountClick,
+  onBillingClick,
+  accountLabel = 'Conta',
+  billingLabel = 'Assinatura',
+  padded = true,
+  size = 'sm',
+  style,
+  ...others
+}) {
+  if (!user) return null;
+
+  // Size mappings
+  const avatarSizeMap = {
+    sm: 32,
+    md: 40,
+    lg: 48
+  };
+  const fontSizeTitleMap = {
+    sm: 'sm',
+    md: 'md',
+    lg: 'lg'
+  };
+  const fontSizeEmailMap = {
+    sm: '10px',
+    md: 'xs',
+    lg: 'sm'
+  };
+  const btnSizeMap = {
+    sm: 'xs',
+    md: 'sm',
+    lg: 'md'
+  };
+  const gapMap = {
+    sm: 'xs',
+    md: 'sm',
+    lg: 'md'
+  };
+  const widthMap = {
+    sm: 280,
+    md: 320,
+    lg: 400
+  };
+  const name = user.fullName || user.name || 'User';
+  const email = user.primaryEmailAddress || user.email || '';
+  const initials = name.split(' ').map(n => n[0]).join('').toUpperCase().slice(0, 2);
+  return /*#__PURE__*/jsx(Box, {
+    p: padded ? gapMap[size] : 0,
+    w: widthMap[size],
+    style: style,
+    ...others,
+    children: /*#__PURE__*/jsxs(Stack, {
+      gap: gapMap[size],
+      children: [/*#__PURE__*/jsxs(Group, {
+        wrap: "nowrap",
+        gap: "xs",
+        children: [/*#__PURE__*/jsx(Avatar, {
+          src: user.imageUrl || user.image,
+          size: avatarSizeMap[size],
+          radius: "xl",
+          bg: "gray.1",
+          c: "gray.6",
+          styles: {
+            placeholder: {
+              fontSize: rem(avatarSizeMap[size] / 2.2),
+              fontWeight: 600
+            }
+          },
+          children: initials || 'CC'
+        }), /*#__PURE__*/jsxs(Box, {
+          style: {
+            flex: 1,
+            overflow: 'hidden'
+          },
+          children: [/*#__PURE__*/jsx(Text, {
+            size: fontSizeTitleMap[size],
+            fw: 700,
+            truncate: "end",
+            c: "dark.9",
+            lh: 1.1,
+            children: name
+          }), /*#__PURE__*/jsx(Text, {
+            size: fontSizeEmailMap[size],
+            c: "gray.5",
+            truncate: "end",
+            lh: 1.1,
+            children: email
+          })]
+        }), /*#__PURE__*/jsx(ActionIcon, {
+          size: btnSizeMap[size],
+          onClick: signOut,
+          children: /*#__PURE__*/jsx(IconLogout, {
+            size: 16,
+            stroke: 1.5
+          })
+        })]
+      }), /*#__PURE__*/jsxs(Group, {
+        grow: true,
+        children: [/*#__PURE__*/jsx(Button, {
+          variant: "default",
+          size: btnSizeMap[size],
+          leftSection: /*#__PURE__*/jsx(IconSettings, {
+            size: 16,
+            stroke: 1.5
+          }),
+          onClick: onAccountClick,
+          children: accountLabel
+        }), /*#__PURE__*/jsx(Button, {
+          variant: "default",
+          size: btnSizeMap[size],
+          leftSection: /*#__PURE__*/jsx(IconCreditCard, {
+            size: 16,
+            stroke: 1.5
+          }),
+          onClick: onBillingClick,
+          children: billingLabel
+        })]
+      }), /*#__PURE__*/jsxs(Group, {
+        justify: "center",
+        gap: 4,
+        opacity: 0.3,
+        children: [/*#__PURE__*/jsx(Text, {
+          size: "10px",
+          c: "gray.6",
+          fw: 600,
+          children: "Secured by"
+        }), /*#__PURE__*/jsxs(Group, {
+          gap: 2,
+          children: [/*#__PURE__*/jsx(IconShieldCheck, {
+            size: 10,
+            stroke: 2
+          }), /*#__PURE__*/jsx(Text, {
+            size: "10px",
+            fw: 800,
+            c: "dark.9",
+            children: "Auth"
+          })]
+        })]
+      })]
+    })
+  });
+}
+
+/**
+ * Renderiza children apenas quando o usuário está autenticado
+ * Equivalente ao <SignedIn> do Clerk
+ */
+function SignedIn({
+  children
+}) {
+  const {
+    user,
+    loading
+  } = useAuth();
+  if (loading || !user) return null;
+  return children;
+}
+
+/**
+ * Renderiza children apenas quando o usuário NÃO está autenticado
+ * Equivalente ao <SignedOut> do Clerk
+ */
+function SignedOut({
+  children
+}) {
+  const {
+    user,
+    loading
+  } = useAuth();
+  if (loading || user) return null;
+  return children;
+}
+
+/**
+ * Renderiza children enquanto a autenticação está carregando
+ * Equivalente ao <ClerkLoading> do Clerk
+ */
+function AuthLoading({
+  children
+}) {
+  const {
+    loading
+  } = useAuth();
+  if (!loading) return null;
+  return children;
+}
+
+/**
+ * Renderiza children quando a autenticação terminou de carregar
+ * Equivalente ao <ClerkLoaded> do Clerk
+ */
+function AuthLoaded({
+  children
+}) {
+  const {
+    loading
+  } = useAuth();
+  if (loading) return null;
+  return children;
+}
+
+function SignInButton({
+  children,
+  redirectTo = '/login',
+  ...props
+}) {
+  const navigate = useNavigate();
+  return /*#__PURE__*/jsx("button", {
+    onClick: () => navigate(redirectTo),
+    ...props,
+    children: children || 'Sign In'
+  });
+}
+
+function SignOutButton({
+  children,
+  onSignOut,
+  ...props
+}) {
+  const signOut = useSignOut();
+  const handleClick = async () => {
+    await signOut();
+    onSignOut?.();
+  };
+  return /*#__PURE__*/jsx("button", {
+    onClick: handleClick,
+    ...props,
+    children: children || 'Sign Out'
+  });
+}
+
+export { AuthCard, AuthLoaded, AuthLoading, AuthProvider, GuestOnly, IDENTITY_CHANGED_EVENT, Protect, SignIn, SignInButton, SignOutButton, SignedIn, SignedOut, SocialButtons, TOKEN_STORAGE_KEY, UserInformation, UserProfile, Wordmark, announceIdentityChange, applyRedirect, clearIdentitySwitching, configure, consumeSocialError, consumeSocialToken, decodeJWT, endImpersonation, getApiUrl, getApplicationInfo, getCurrentUser, getLinkedProviders, getRedirectFromLocation, getSession, getSocialProviders, isAuthenticated, isIdentitySwitching, isInternal, listSessions, markIdentitySwitching, pollCode, refreshToken, requestCode, resolveRedirect, revokeOtherSessions, revokeSession, setStoredToken, shouldSignOutOn401, signOut, startSocialLink, startSocialSignIn, unlinkSocialProvider, updateProfile, useApplicationLogo, useAuth, useAuthLoading, useAuthStore, useCheckToken, useImpersonation, useSession, useSessions, useSignIn, useSignOut, useUser, verifyCode };
+//# sourceMappingURL=index.esm.js.map