vue-clerk

Patch Changes

• 4a22b11: Add custom <UserProfileLink /> to <UserButton />

Patch Changes

• 4ebc2cc: Support roles and permissions in Nuxt middleware

  Examples:

  Allow users that have the org:invoices:create permission

  definePageMeta({
    middleware: "auth",
    auth: {
      permission: "org:invoices:create",
    },
  });
  

  Allow users with the org:billing role

  definePageMeta({
    middleware: "auth",
    auth: {
      role: "org:billing",
    },
  });
  

Minor changes

• 6c77ccb: Introduce Nuxt module

  Usage:

  export default defineNuxtConfig({
    modules: ["vue-clerk/nuxt"],
  });
  

  <script setup>
    const { data: user } = await useCurrentUser()
  </script>
  
  <template>
    <SignedIn>
      <h1>Hello, {{ user?.fullName }}</h1>
      <UserButton />
    </SignedIn>
    <SignedOut>
      <SignInButton mode="modal" />
    </SignedOut>
  </template>
  

  // server/api/me.ts
  import { clerkClient, getAuth } from '#clerk'
  
  export default eventHandler((event) => {
    const { userId } = getAuth(event);
  
    if (!userId) {
      setResponseStatus(event, 403);
      return;
    }
  
    return clerkClient(event).users.getUser(userId);
  });
  

Patch Changes

• f526231: Fix <UserButton /> component trying to account for custom menu items even when empty
• ffff2e4: Bump @clerk/shared to 2.5.3 and @clerk/types to 4.15.0

Minor Changes

• 7863158: Add custom pages and links to <UserProfile /> component

  Usage:

  <script setup>
  import { UserProfile } from "vue-clerk";
  </script>
  
  <template>
    <UserProfile>
      <UserProfile.Page label="Custom page" url="custom">
        <template #labelIcon>
          <CustomIcon />
        </template>
        <CustomPage />
      </UserProfile.Page>
    </UserProfile>
  </template>
  

• 4c5fcd8: Add custom page support in <UserButton /> and improve menu items rendering

  Usage:

  <script setup>
  import { UserButton } from "vue-clerk";
  </script>
  
  <template>
    <UserButton>
      <UserButton.MenuItems>
        <UserButton.Action label="Help" open="help">
          <template #labelIcon>
            <HelpIcon />
          </template>
        </UserButton.Action>
      </UserButton.MenuItems>
      <UserButton.UserProfilePage label="Help" url="help">
        <template #labelIcon>
          <HelpIcon />
        </template>
        <div>
          <h1>Help Page</h1>
          <p>This is the custom help page</p>
        </div>
      </UserButton.UserProfilePage>
    </UserButton>
  </template>
  

• f84f404: Add custom pages and links to <OrganizationProfile /> component

  Usage:

  <script setup>
  import { OrganizationProfile } from "vue-clerk";
  </script>
  
  <template>
    <OrganizationProfile>
      <OrganizationProfile.Page label="Custom page" url="custom">
        <template #labelIcon>
          <CustomIcon />
        </template>
        <CustomPage />
      </OrganizationProfile.Page>
    </OrganizationProfile>
  </template>
  

Patch Changes

• 562f4e9: Add helper function to update Clerk options

  Usage:

  import { updateClerkOptions } from "vue-clerk";
  import { frFR } from "@clerk/localizations";
  
  updateClerkOptions({
    localization: frFR,
    appearance: {
      elements: {
        formButtonPrimary: "bg-slate-500 hover:bg-slate-400 text-sm",
      },
    },
  });
  

Patch Changes

• b1bc743: Improve calls to addListener in user-level

Patch Changes

• be4aca9: Bump @clerk/types from 4.13.1 to 4.14.0
• 07c2d12: Bump @clerk/shared from 2.5.1 to 2.5.2

Patch Changes

• a49e0be: Use Clerk JS script loader functions from @clerk/shared

Patch Changes

• b291789: feat: Add custom menu items to <UserButton /> component

  Example usage:

  <template>
    <UserButton>
      <UserButton.MenuItems>
        <UserButton.Link label="Terms" href="/terms">
          <template #labelIcon>
            <TermsIcon />
          </template>
        </UserButton.Link>
        <UserButton.Action label="Chat Modal" @click="openChatModal">
          <template #labelIcon>
            <ChatIcon />
          </template>
        </UserButton.Action>
      </UserButton.MenuItems>
    </UserButton>
  </template>
  

Patch Changes

• 4d69257: chore(deps): bump @clerk/types from 4.12.1 to 4.13.0
• b215ddb: chore(deps): bump @clerk/shared from 2.4.5 to 2.5.0
• f43df06: fix: Temporary add unexported Transferable type

Patch Changes

• 2f3603f: Bump @clerk/shared and @clerk/types versions

Patch Changes

• 5a96cb7: Fix UI component props not mounting

Patch Changes

• ca81318: Fix incorrect UI components mount and unmount functions

Patch Changes

• 138596c: Clean up UI components and add compile-time tests
• b8ac6ae: Bump @clerk/shared to 2.4.1 and @clerk/types to 4.9.1

Patch Changes

• 85edb7f: Add GoogleOneTap component

Patch Changes

• a040391: Add reusable polymorphic ref composable
• d00284c: Introduce unstyled polymorphic components

Patch Changes

• 50327fc: Bump clerk dependencies

Patch Changes

• 3a0a8f7: fix: vue-tsc typeerror on build

compare changes

🏡 Chore

• Minify build and remove unused files (3791178)

❤️ Contributors

• Wobsoriano (@wobsoriano)