Vue adapter

Install

pnpm add @rw3iss/auth-client vue

Install the plugin

import { createApp } from 'vue';
import { rw3issAuthPlugin } from '@rw3iss/auth-client/vue';
import App from './App.vue';

createApp(App)
    .use(rw3issAuthPlugin, {
        apiBaseUrl: 'https://auth.ryanweiss.net/api/v1',
        appCode: 'marketplace-buyer',
    })
    .mount('#app');

Read auth state

<script setup lang="ts">
import { useAuth } from '@rw3iss/auth-client/vue';
const { user, isAuthenticated, logout } = useAuth();
</script>

<template>
    <div v-if="isAuthenticated">
        {{ user.email }}
        <button @click="logout()">Sign out</button>
    </div>
    <a v-else href="/login">Sign in</a>
</template>

The Vue composable returns ref/computed so the template is auto-reactive.