Svelte

@kavachos/svelte provides reactive Svelte stores and a SvelteKit hooks integration. It works with Svelte 4+, SvelteKit, and plain Vite setups.

Installation

pnpm add @kavachos/svelte

Setup

Create a client instance and export the stores from a shared module:

src/lib/kavach.ts

import { createKavachClient } from '@kavachos/svelte'; 

export const {
  session,
  user,
  signIn,
  signOut,
  signUp,
  agents,
} = createKavachClient({ 
  basePath: '/api/kavach', 
}); 

SvelteKit setup

In SvelteKit, expose the session on the server side via hooks.server.ts so the initial page load is never unauthenticated:

src/hooks.server.ts

import { createKavachHooks } from '@kavachos/svelte/sveltekit'; 

export const { handle } = createKavachHooks({ 
  basePath: '/api/kavach', 
}); 

Access the session in +layout.server.ts:

src/routes/+layout.server.ts

import type { LayoutServerLoad } from './$types';

export const load: LayoutServerLoad = async ({ locals }) => {
  return { session: locals.session }; // populated by the hook
};

Session store

src/routes/+page.svelte

<script lang="ts">
  import { session } from '$lib/kavach';
</script>

{#if $session.isLoading}
  <p>Loading...</p>
{:else if $session.data}
  <p>Signed in as {$session.data.user.email}</p>
{:else}
  <a href="/sign-in">Sign in</a>
{/if}

src/routes/sign-in/+page.svelte

<script lang="ts">
  import { signIn } from '$lib/kavach';

  let email = '';
  let password = '';
  let error = '';

  async function handleSubmit() {
    const result = await signIn({ email, password });
    if (!result.success) {
      error = result.error.message;
    }
  }
</script>

import { signUp } from '$lib/kavach';

const result = await signUp({ email, password, name });

Sign out

import { signOut } from '$lib/kavach';

await signOut();

createAgentStore

Manage agent identities in reactive Svelte stores:

<script lang="ts">
  import { createAgentStore } from '@kavachos/svelte';

  const { agents, createAgent, revokeAgent, isLoading } = createAgentStore({
    basePath: '/api/kavach',
  });

  async function addAgent() {
    await createAgent({ name: 'My assistant', permissions: ['read:data'] });
  }
</script>

{#each $agents as agent}
  <div>{agent.name} <button on:click={() => revokeAgent(agent.id)}>Revoke</button></div>
{/each}

Client configuration reference

string

default:"'/api/kavach'"

Base path where your KavachOS handler is mounted.

RequestInit

Options passed to every internal fetch call.

MCP and gateway

Framework adapters

Client SDKs

Infra

Installation

Setup

SvelteKit setup

Session store

createAgentStore

Client configuration reference

​Installation

​Setup

​SvelteKit setup

​Session store

​Sign in / sign up / sign out

​createAgentStore

​Client configuration reference

Installation

Setup

SvelteKit setup

Session store

Sign in / sign up / sign out

createAgentStore

Client configuration reference