Update to Clerk

{
  "name": "clerk-vue-patterns",
  "description": "Vue 3 patterns with Clerk — composables (useAuth, useUser, useClerk, useOrganization), Vue Router guards, Pinia auth store integration. Triggers on: vue clerk, useAuth vue, clerk composables, vue router clerk guard, pinia auth clerk. For Nuxt, use clerk-nuxt-patterns instead.",
  "included_files": [
    {
      "relative_path": "evals/evals.json",
      "size_in_bytes": 2093
    },
    {
      "relative_path": "references/composables.md",
      "size_in_bytes": 2204
    },
    {
      "relative_path": "references/pinia-integration.md",
      "size_in_bytes": 1461
    },
    {
      "relative_path": "references/vue-router-guards.md",
      "size_in_bytes": 1657
    },
    {
      "relative_path": "templates/vue-basic-auth/index.html",
      "size_in_bytes": 294
    },
    {
      "relative_path": "templates/vue-basic-auth/package.json",
      "size_in_bytes": 337
    },
    {
      "relative_path": "templates/vue-basic-auth/src/App.vue",
      "size_in_bytes": 304
    },
    {
      "relative_path": "templates/vue-basic-auth/src/main.ts",
      "size_in_bytes": 390
    },
    {
      "relative_path": "templates/vue-basic-auth/src/style.css",
      "size_in_bytes": 0
    },
    {
      "relative_path": "templates/vue-basic-auth/vite.config.ts",
      "size_in_bytes": 127
    }
  ],
  "skill_md_contents": "---\nname: clerk-vue-patterns\ndescription: 'Vue 3 patterns with Clerk — composables (useAuth, useUser,\n  useClerk, useOrganization), Vue Router guards, Pinia auth store\n  integration. Triggers on: vue clerk, useAuth vue, clerk composables,\n  vue router clerk guard, pinia auth clerk. For Nuxt, use clerk-nuxt-patterns instead.'\nlicense: MIT\nallowed-tools: WebFetch\nmetadata:\n  author: clerk\n  version: 1.0.0\n---\n\n# Vue Patterns\n\nSDK: `@clerk/vue` v2+ (Vue 3). For Nuxt, use `clerk-nuxt-patterns`.\n\n## What Do You Need?\n\n| Task | Reference |\n|------|-----------|\n| Composables: useAuth, useUser, useOrganization | references/composables.md |\n| Vue Router navigation guards | references/vue-router-guards.md |\n| Pinia store with auth state | references/pinia-integration.md |\n\n## Mental Model\n\nVue uses composables from `@clerk/vue`:\n\n- **`useAuth()`** — reactive `isSignedIn`, `userId`, `signOut`\n- **`useUser()`** — reactive `user` object\n- **`useClerk()`** — full Clerk instance for advanced operations\n- **`useOrganization()`** — reactive `organization`, `membership`\n\n## Setup\n\n### Vue (Plain)\n\n```ts\n// main.ts\nimport { clerkPlugin } from '@clerk/vue'\nimport { createApp } from 'vue'\nimport App from './App.vue'\n\nconst app = createApp(App)\napp.use(clerkPlugin, {\n  publishableKey: import.meta.env.VITE_CLERK_PUBLISHABLE_KEY,\n})\napp.mount('#app')\n```\n\n## Composables Usage\n\n```vue\n<script setup lang=\"ts\">\nimport { useAuth, useUser } from '@clerk/vue'\n\nconst { isSignedIn, userId, signOut } = useAuth()\nconst { user } = useUser()\n</script>\n\n<template>\n  <div v-if=\"isSignedIn\">\n    <p>Hello {{ user?.firstName }}</p>\n    <button @click=\"signOut()\">Sign Out</button>\n  </div>\n  <SignInButton v-else />\n</template>\n```\n\n## Org Switching\n\n```vue\n<script setup lang=\"ts\">\nimport { useOrganizationList } from '@clerk/vue'\n\nconst { userMemberships, setActive } = useOrganizationList()\n</script>\n\n<template>\n  <button\n    v-for=\"mem in userMemberships.data ?? []\"\n    :key=\"mem.organization.id\"\n    @click=\"setActive({ organization: mem.organization.id })\"\n  >\n    {{ mem.organization.name }}\n  </button>\n</template>\n```\n\n## Common Pitfalls\n\n| Symptom | Cause | Fix |\n|---------|-------|-----|\n| Composables return `undefined` | Not inside `ClerkProvider` tree | Ensure `app.use(clerkPlugin, { publishableKey })` is called |\n| `userId` reactive but not updating | Destructuring loses reactivity | Use `const { userId } = useAuth()` (toRefs-style composable, reactive) |\n## Import Map\n\n| What | Import |\n|------|--------|\n| Composables | `@clerk/vue` |\n| Plugin setup | `@clerk/vue` |\n| Components | `@clerk/vue` |\n\n## See Also\n\n- `clerk-setup` - Initial Clerk install\n- `clerk-custom-ui` - Custom flows & appearance\n- `clerk-orgs` - B2B organizations\n\n## Docs\n\n- [Vue SDK](https://clerk.com/docs/vue/getting-started/quickstart)\n"
}