Name: KavachOS
Author: KavachOS

@kavachos/vue provides Vue 3 composables and an app plugin for building auth UIs. It works with Vite, Nuxt, and any Vue 3 setup.

Installation

pnpm add @kavachos/vue

Setup

main.ts

import { createApp } from 'vue';
import { createKavachPlugin } from '@kavachos/vue'; 
import App from './App.vue';

const app = createApp(App);

app.use(createKavachPlugin({ 
  basePath: '/api/kavach', 
})); 

app.mount('#app');

Nuxt setup

In Nuxt, create a plugin file:

plugins/kavach.client.ts

import { createKavachPlugin } from '@kavachos/vue';

export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.vueApp.use(createKavachPlugin({
    basePath: '/api/kavach',
  }));
});

useSession

Returns the current session state. Reactive — updates when the user signs in or out.

components/NavBar.vue

<script setup lang="ts">
import { useSession } from '@kavachos/vue';

const { session, isLoading } = useSession();
</script>

<template>
  <nav>
    <span v-if="isLoading">Loading...</span>
    <span v-else-if="session">{{ session.user.name }}</span>
    <a v-else href="/sign-in">Sign in</a>
  </nav>
</template>

useUser

Returns the current user object, or null if signed out.

<script setup lang="ts">
import { useUser } from '@kavachos/vue';

const { user } = useUser();
</script>

useSignIn / useSignUp / useSignOut

pages/sign-in.vue

<script setup lang="ts">
import { useSignIn } from '@kavachos/vue';

const { signIn, isLoading, error } = useSignIn();

async function handleSubmit(email: string, password: string) {
  await signIn({ email, password });
  // Redirect on success — composable does not navigate automatically
}
</script>

import { useSignUp } from '@kavachos/vue';

const { signUp, isLoading, error } = useSignUp();
await signUp({ email, password, name });

Sign out

import { useSignOut } from '@kavachos/vue';

const { signOut } = useSignOut();
await signOut();

useAgents

Lists and manages agent identities for the current user.

import { useAgents } from '@kavachos/vue';

const { agents, createAgent, revokeAgent, isLoading } = useAgents();

// Create a new agent
await createAgent({ name: 'My AI assistant', permissions: ['read:data'] });

Plugin configuration reference

Prop

Type

Vue

On this page