diff --git a/.gitignore b/.gitignore
index e112f76f..13c8bddc 100644
--- a/.gitignore
+++ b/.gitignore
@@ -135,3 +135,6 @@ dist
# Webstorm project files
.idea
+
+public/r
+registry/
diff --git a/.husky/pre-commit b/.husky/pre-commit
new file mode 100644
index 00000000..35db75dc
--- /dev/null
+++ b/.husky/pre-commit
@@ -0,0 +1,14 @@
+# 1. Generate the registry
+pnpm registry:generate
+
+# 2. Copy registry.json to root
+pnpm copy-registry
+
+# 3. Build the registry
+pnpm registry:build
+
+# 4. Delete docs/public/r
+pnpm delete-docs-r
+
+# 5. Copy public/r to docs/public/r
+pnpm copy-public-to-docs
diff --git a/docs/content/docs/components/accept-invitation-card.mdx b/docs/content/docs/components/accept-invitation-card.mdx
index 2151bdfe..0eecd45e 100644
--- a/docs/content/docs/components/accept-invitation-card.mdx
+++ b/docs/content/docs/components/accept-invitation-card.mdx
@@ -4,6 +4,31 @@ title:
The `` component handles the organization invitation acceptance flow. It displays invitation details and allows users to accept or reject organization invitations.
+## Installation
+
+
+
+ ```shell
+ npx shadcn@latest add https://better-auth-ui.com/r/accept-invitation-card.json
+ ```
+
+
+ ```shell
+ pnpx shadcn@latest add https://better-auth-ui.com/r/accept-invitation-card.json
+ ```
+
+
+ ```shell
+ yarn shadcn add https://better-auth-ui.com/r/accept-invitation-card.json
+ ```
+
+
+ ```shell
+ bunx shadcn@latest add https://better-auth-ui.com/r/accept-invitation-card.json
+ ```
+
+
+
## Usage
This component is typically used on a dedicated invitation acceptance page:
@@ -58,7 +83,7 @@ export default function AcceptInvitationPage() {
### With Custom Class Names
```tsx
-
description: A collection of account management cards for user profile settings
---
+## Installation
+
+
+
+ ```shell
+ npx shadcn@latest add https://better-auth-ui.com/r/account-settings-cards.json
+ ```
+
+
+ ```shell
+ pnpx shadcn@latest add https://better-auth-ui.com/r/account-settings-cards.json
+ ```
+
+
+ ```shell
+ yarn shadcn add https://better-auth-ui.com/r/account-settings-cards.json
+ ```
+
+
+ ```shell
+ bunx shadcn@latest add https://better-auth-ui.com/r/account-settings-cards.json
+ ```
+
+
+
## Import
```tsx
@@ -95,4 +120,4 @@ The component supports full localization through the `localization` prop:
- [``](/docs/components/settings-cards) - Parent component with navigation
- [``](/docs/components/update-avatar-card) - Individual avatar update card
- [``](/docs/components/update-name-card) - Individual name update card
-- [``](/docs/components/accounts-card) - Linked accounts management
\ No newline at end of file
+- [``](/docs/components/accounts-card) - Linked accounts management
diff --git a/docs/content/docs/components/accounts-card.mdx b/docs/content/docs/components/accounts-card.mdx
index 335aee7c..b6c81140 100644
--- a/docs/content/docs/components/accounts-card.mdx
+++ b/docs/content/docs/components/accounts-card.mdx
@@ -3,6 +3,31 @@ title:
description: Displays and manages linked social accounts
---
+## Installation
+
+
+
+ ```shell
+ npx shadcn@latest add https://better-auth-ui.com/r/accounts-card.json
+ ```
+
+
+ ```shell
+ pnpx shadcn@latest add https://better-auth-ui.com/r/accounts-card.json
+ ```
+
+
+ ```shell
+ yarn shadcn add https://better-auth-ui.com/r/accounts-card.json
+ ```
+
+
+ ```shell
+ bunx shadcn@latest add https://better-auth-ui.com/r/accounts-card.json
+ ```
+
+
+
## Import
```tsx
@@ -44,4 +69,4 @@ export function AccountSettings() {
- Unlink existing social accounts
- Shows provider icons and account information
- Built-in loading states
-- Prevents unlinking if it's the only authentication method
\ No newline at end of file
+- Prevents unlinking if it's the only authentication method
diff --git a/docs/content/docs/components/api-keys-card.mdx b/docs/content/docs/components/api-keys-card.mdx
index 2c650609..976cb114 100644
--- a/docs/content/docs/components/api-keys-card.mdx
+++ b/docs/content/docs/components/api-keys-card.mdx
@@ -4,6 +4,31 @@ title:
The `` component provides a complete interface for managing API keys, including creating, viewing, and deleting API keys for programmatic access to your application.
+## Installation
+
+
+
+ ```shell
+ npx shadcn@latest add https://better-auth-ui.com/r/api-keys-card.json
+ ```
+
+
+ ```shell
+ pnpx shadcn@latest add https://better-auth-ui.com/r/api-keys-card.json
+ ```
+
+
+ ```shell
+ yarn shadcn add https://better-auth-ui.com/r/api-keys-card.json
+ ```
+
+
+ ```shell
+ bunx shadcn@latest add https://better-auth-ui.com/r/api-keys-card.json
+ ```
+
+
+
## Usage
```tsx
@@ -39,7 +64,7 @@ export function APIKeysSettingsPage() {
### With Custom Class Names
```tsx
-
The `` component renders its children only during an authentication session loading. This provides an easy way for you to insert loading states or skeleton loaders into your UI, enhancing user experience during data fetching.
+## Installation
+
+
+
+ ```shell
+ npx shadcn@latest add https://better-auth-ui.com/r/auth-loading.json
+ ```
+
+
+ ```shell
+ pnpx shadcn@latest add https://better-auth-ui.com/r/auth-loading.json
+ ```
+
+
+ ```shell
+ yarn shadcn add https://better-auth-ui.com/r/auth-loading.json
+ ```
+
+
+ ```shell
+ bunx shadcn@latest add https://better-auth-ui.com/r/auth-loading.json
+ ```
+
+
+
## Usage
Wrap loading placeholders or loader components with `` to conditionally render them whenever authentication session data is being fetched.
@@ -82,4 +107,4 @@ export function YourCustomSkeleton() {
}
```
-This example skeleton provides placeholder components resembling the size and shape of loaded content, greatly reducing UI flicker and enhancing user-perceived loading performance.
\ No newline at end of file
+This example skeleton provides placeholder components resembling the size and shape of loaded content, greatly reducing UI flicker and enhancing user-perceived loading performance.
diff --git a/docs/content/docs/components/auth-ui-provider.mdx b/docs/content/docs/components/auth-ui-provider.mdx
index 08c588d3..d03df8c9 100644
--- a/docs/content/docs/components/auth-ui-provider.mdx
+++ b/docs/content/docs/components/auth-ui-provider.mdx
@@ -4,6 +4,31 @@ title:
The `` wraps your application with authentication context, providing essential hooks, settings, and methods required by authentication-related components and hooks throughout your app.
+## Installation
+
+
+
+ ```shell
+ npx shadcn@latest add https://better-auth-ui.com/r/auth-ui-provider.json
+ ```
+
+
+ ```shell
+ pnpx shadcn@latest add https://better-auth-ui.com/r/auth-ui-provider.json
+ ```
+
+
+ ```shell
+ yarn shadcn add https://better-auth-ui.com/r/auth-ui-provider.json
+ ```
+
+
+ ```shell
+ bunx shadcn@latest add https://better-auth-ui.com/r/auth-ui-provider.json
+ ```
+
+
+
## Usage
```tsx title="providers.tsx"
@@ -104,4 +129,4 @@ export default function RootLayout({ children }: { children: React.ReactNode })