# @andco/sdk-svelte

> Provider, contexto y botón para Svelte 5.


```bash
npm install @andco/sdk @andco/sdk-svelte
```

Requiere Svelte 5: el estado de la sesión se expone con runes.

## AndcoProvider

```svelte
<AndcoProvider {clientOptions} {initialSession}>
  {@render children()}
</AndcoProvider>
```

| Prop | Qué es |
| --- | --- |
| `clientOptions` | opciones con las que construir la instancia |
| `client` | una instancia que la aplicación ya tiene |
| `initialSession` | una sesión ya resuelta |

## useAndcoSession

```ts
useAndcoSession(): { readonly current: AndcoSession | null | undefined }
```

Se lee con `.current` y es reactivo. Los tres estados son los mismos del resto del SDK. Cambia en **cada** republicación, incluida una rotación silenciosa de token — a diferencia de `useAndco`, que deliberadamente no cambia en ese caso. Úsalo cuando necesites la credencial como dato, por ejemplo una expiración.

```svelte
{#if session.current === undefined}
  <p>Cargando…</p>
{:else if session.current}
  <p>{session.current.user.email}</p>
{:else}
  <p>Sin sesión</p>
{/if}
```

## useAndcoUser

```ts
useAndcoUser(): { readonly current: AndcoUser | null | undefined }
```

Comparte los tres estados de la sesión, pero cambia solo cuando cambia la persona — identificador, nombre, correo o avatar — nunca por un Grant ampliado ni por una rotación de token.

## useAndco

```ts
useAndco(): { readonly current: AndcoClient | AndcoClientAuthed }
```

`current` cambia exactamente cuando cambia la Identidad Autorizada — inicio de sesión, cierre de sesión, un Grant ampliado — y se mantiene igual ante una rotación de token. Mientras no hay Identidad Autorizada, `current` es la instancia sin autorizar, así que la referencia también es estable en la transición de sin-resolver a anónimo; para observar esa transición usa `useAndcoSession`. Devuelto detrás de un getter porque la reactividad de una rune no sobrevive al retorno por valor.

## useAndcoAuthed

```ts
useAndcoAuthed(): { readonly current: AndcoClientAuthed | null }
```

La misma regla de cambio que `useAndco`, pero `current` es `null` mientras no hay Identidad Autorizada, para que el camino "hacer esto solo si hay sesión" no necesite una comprobación aparte.

## setAndcoContext

```ts
setAndcoContext(context: AndcoSvelteContext): void
```

`AndcoSvelteContext` es `{ client: AndcoClient; session: AndcoSession | null | undefined }` — la instancia estable más la sesión cruda, no un `AndcoSessionClient`. Para proveer la instancia sin el componente, por ejemplo desde un layout que ya la construyó.

## AndcoButton y AndcoIntentButton

```svelte
<AndcoButton
  authorization={{ scopes: ["openid", "email"] }}
  onComplete={() => location.reload()}
  onError={(error) => (message = error.message)}
/>
```

Los callbacks son props `on*`, que es lo idiomático en Svelte 5. Las demás props son las mismas que en React y Vue.

## Con SvelteKit

El provider necesita `window`. En un layout con renderizado en servidor, entrégale la sesión que el servidor resolvió:

```svelte
<AndcoProvider {clientOptions} initialSession={data.andcoSession}>
  {@render children()}
</AndcoProvider>
```