@better-auth-ui/heroui 1.6.7 → 1.6.9

package/dist/components/auth/api-key/api-keys.js

@@ -1,41 +1,22 @@
-import { apiKeyPlugin as e } from "../../../lib/auth/api-key-plugin.js";
-import { ApiKey as t } from "./api-key.js";
-import { ApiKeySkeleton as n } from "./api-key-skeleton.js";
-import { ApiKeysEmpty as r } from "./api-keys-empty.js";
-import { CreateApiKeyDialog as i } from "./create-api-key-dialog.js";
-import { useAuth as a, useAuthPlugin as o, useListApiKeys as s } from "@better-auth-ui/react";
-import { Button as c, Card as l, cn as u } from "@heroui/react";
-import { useState as d } from "react";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
-//#region src/components/auth/api-key/api-keys.tsx
-function m({ className: m, variant: h }) {
-	let { authClient: g } = a(), { localization: _ } = o(e), { data: v, isPending: y } = s(g), [b, x] = d(!1);
-	return /* @__PURE__ */ p("div", {
-		className: u("flex flex-col gap-3", m),
-		children: [
-			/* @__PURE__ */ p("div", {
-				className: "flex items-end justify-between gap-3",
-				children: [/* @__PURE__ */ f("h2", {
-					className: "text-sm font-semibold truncate",
-					children: _.apiKeys
-				}), /* @__PURE__ */ f(c, {
-					className: "shrink-0",
-					size: "sm",
-					isDisabled: y,
-					onPress: () => x(!0),
-					children: _.createApiKey
-				})]
-			}),
-			/* @__PURE__ */ f(l, {
-				variant: h,
-				children: /* @__PURE__ */ f(l.Content, { children: y ? /* @__PURE__ */ f(n, {}) : v?.apiKeys.length ? v?.apiKeys.map((e, n) => /* @__PURE__ */ p("div", { children: [n > 0 && /* @__PURE__ */ f("div", { className: "border-b border-dashed -mx-4 my-4" }), /* @__PURE__ */ f(t, { apiKey: e })] }, e.id)) : /* @__PURE__ */ f(r, { onCreatePress: () => x(!0) }) })
-			}),
-			/* @__PURE__ */ f(i, {
-				isOpen: b,
-				onOpenChange: x
-			})
-		]
-	});
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useAuth, useAuthPlugin, useListApiKeys } from "@better-auth-ui/react";
+import { Button, Card, cn } from "@heroui/react";
+import { useState } from "react";
+import { apiKeyPlugin } from "../../../lib/auth/api-key-plugin";
+import { ApiKey } from "./api-key";
+import { ApiKeySkeleton } from "./api-key-skeleton";
+import { ApiKeysEmpty } from "./api-keys-empty";
+import { CreateApiKeyDialog } from "./create-api-key-dialog";
+export function ApiKeys({ className, variant, organizationId, isPending: isPendingProp, hideCreate, hideDelete }) {
+    const { authClient } = useAuth();
+    const { localization: apiKeyLocalization } = useAuthPlugin(apiKeyPlugin);
+    const { data: listData, isPending: isListPending } = useListApiKeys(authClient, {
+        enabled: !isPendingProp,
+        ...(organizationId
+            ? { query: { organizationId, configId: "organization" } }
+            : {})
+    });
+    const isPending = isPendingProp || isListPending;
+    const [createOpen, setCreateOpen] = useState(false);
+    return (_jsxs("div", { className: cn("flex flex-col gap-3", className), children: [_jsxs("div", { className: "flex items-end justify-between gap-3", children: [_jsx("h2", { className: "text-sm font-semibold truncate", children: apiKeyLocalization.apiKeys }), !hideCreate && (_jsx(Button, { className: "shrink-0", size: "sm", isDisabled: isPending, onPress: () => setCreateOpen(true), children: apiKeyLocalization.createApiKey }))] }), _jsx(Card, { variant: variant, children: _jsx(Card.Content, { children: isPending ? (_jsx(ApiKeySkeleton, {})) : !listData?.apiKeys.length ? (_jsx(ApiKeysEmpty, { onCreatePress: () => setCreateOpen(true), hideCreate: hideCreate })) : (listData?.apiKeys.map((key, index) => (_jsxs("div", { children: [index > 0 && (_jsx("div", { className: "border-b border-dashed -mx-4 my-4" })), _jsx(ApiKey, { apiKey: key, hideDelete: hideDelete, organizationId: organizationId })] }, key.id)))) }) }), !hideCreate && (_jsx(CreateApiKeyDialog, { isOpen: createOpen, onOpenChange: setCreateOpen, organizationId: organizationId }))] }));
 }
-//#endregion
-export { m as ApiKeys };

package/dist/components/auth/api-key/create-api-key-dialog.d.ts

@@ -1,5 +1,7 @@
 export type CreateApiKeyDialogProps = {
     isOpen: boolean;
     onOpenChange: (open: boolean) => void;
+    /** Create an organization-owned key by passing the organization id. */
+    organizationId?: string;
 };
-export declare function CreateApiKeyDialog({ isOpen, onOpenChange }: CreateApiKeyDialogProps): import("react/jsx-runtime").JSX.Element;
+export declare function CreateApiKeyDialog({ isOpen, onOpenChange, organizationId }: CreateApiKeyDialogProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/auth/api-key/create-api-key-dialog.js

@@ -1,74 +1,44 @@
-import { apiKeyPlugin as e } from "../../../lib/auth/api-key-plugin.js";
-import { NewApiKeyDialog as t } from "./new-api-key-dialog.js";
-import { useAuth as n, useAuthPlugin as r, useCreateApiKey as i } from "@better-auth-ui/react";
-import { Key as a } from "@gravity-ui/icons";
-import { AlertDialog as o, Button as s, FieldError as c, Form as l, Input as u, Label as d, Spinner as f, TextField as p } from "@heroui/react";
-import { useState as m } from "react";
-import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
-//#region src/components/auth/api-key/create-api-key-dialog.tsx
-function v({ isOpen: v, onOpenChange: y }) {
-	let { authClient: b, localization: x } = n(), { localization: S } = r(e), { mutate: C, isPending: w } = i(b), [T, E] = m(!1), [D, O] = m(null), [k, A] = m(null), j = (e) => {
-		e || (O(null), A(null)), y(e);
-	};
-	return /* @__PURE__ */ _(h, { children: [/* @__PURE__ */ g(o.Backdrop, {
-		isOpen: v,
-		onOpenChange: j,
-		children: /* @__PURE__ */ g(o.Container, { children: /* @__PURE__ */ g(o.Dialog, { children: /* @__PURE__ */ _(l, {
-			onSubmit: (e) => {
-				e.preventDefault();
-				let t = new FormData(e.target).get("name");
-				C(t ? { name: t.trim() } : void 0, { onSuccess: (e) => {
-					j(!1), O(t), A(e.key), E(!0);
-				} });
-			},
-			children: [
-				/* @__PURE__ */ g(o.CloseTrigger, {}),
-				/* @__PURE__ */ _(o.Header, { children: [/* @__PURE__ */ g(o.Icon, {
-					status: "default",
-					children: /* @__PURE__ */ g(a, {})
-				}), /* @__PURE__ */ g(o.Heading, { children: S.createApiKey })] }),
-				/* @__PURE__ */ _(o.Body, {
-					className: "overflow-visible",
-					children: [/* @__PURE__ */ g("p", {
-						className: "text-muted text-sm",
-						children: S.apiKeysDescription
-					}), /* @__PURE__ */ _(p, {
-						className: "mt-4",
-						id: "name",
-						name: "name",
-						isDisabled: w,
-						children: [
-							/* @__PURE__ */ g(d, { children: S.name }),
-							/* @__PURE__ */ g(u, {
-								autoFocus: !0,
-								placeholder: x.settings.optional,
-								variant: "secondary"
-							}),
-							/* @__PURE__ */ g(c, {})
-						]
-					})]
-				}),
-				/* @__PURE__ */ _(o.Footer, { children: [/* @__PURE__ */ g(s, {
-					slot: "close",
-					variant: "tertiary",
-					isDisabled: w,
-					children: x.settings.cancel
-				}), /* @__PURE__ */ _(s, {
-					type: "submit",
-					isPending: w,
-					children: [w && /* @__PURE__ */ g(f, {
-						color: "current",
-						size: "sm"
-					}), S.createApiKey]
-				})] })
-			]
-		}) }) })
-	}), /* @__PURE__ */ g(t, {
-		isOpen: T,
-		onOpenChange: E,
-		secretKey: k,
-		name: D
-	})] });
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useAuth, useAuthPlugin, useCreateApiKey } from "@better-auth-ui/react";
+import { Key } from "@gravity-ui/icons";
+import { AlertDialog, Button, FieldError, Form, Input, Label, Spinner, TextField } from "@heroui/react";
+import { useState } from "react";
+import { apiKeyPlugin } from "../../../lib/auth/api-key-plugin";
+import { NewApiKeyDialog } from "./new-api-key-dialog";
+export function CreateApiKeyDialog({ isOpen, onOpenChange, organizationId }) {
+    const { authClient, localization } = useAuth();
+    const { localization: apiKeyLocalization } = useAuthPlugin(apiKeyPlugin);
+    const { mutate: createApiKey, isPending: isCreating } = useCreateApiKey(authClient);
+    const [isNewKeyDialogOpen, setIsNewKeyDialogOpen] = useState(false);
+    const [keyName, setKeyName] = useState(null);
+    const [secretKey, setSecretKey] = useState(null);
+    const handleOpenChange = (open) => {
+        if (!open) {
+            setKeyName(null);
+            setSecretKey(null);
+        }
+        onOpenChange(open);
+    };
+    const handleSubmit = (e) => {
+        e.preventDefault();
+        const formData = new FormData(e.target);
+        const name = formData.get("name")?.trim();
+        const payload = name || organizationId
+            ? {
+                ...(name ? { name } : {}),
+                ...(organizationId
+                    ? { organizationId, configId: "organization" }
+                    : {})
+            }
+            : undefined;
+        createApiKey(payload, {
+            onSuccess: (result) => {
+                handleOpenChange(false);
+                setKeyName(name);
+                setSecretKey(result.key);
+                setIsNewKeyDialogOpen(true);
+            }
+        });
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(AlertDialog.Backdrop, { isOpen: isOpen, onOpenChange: handleOpenChange, children: _jsx(AlertDialog.Container, { children: _jsx(AlertDialog.Dialog, { children: _jsxs(Form, { onSubmit: handleSubmit, children: [_jsx(AlertDialog.CloseTrigger, {}), _jsxs(AlertDialog.Header, { children: [_jsx(AlertDialog.Icon, { status: "default", children: _jsx(Key, {}) }), _jsx(AlertDialog.Heading, { children: apiKeyLocalization.createApiKey })] }), _jsxs(AlertDialog.Body, { className: "overflow-visible", children: [_jsx("p", { className: "text-muted text-sm", children: apiKeyLocalization.apiKeysDescription }), _jsxs(TextField, { className: "mt-4", id: "name", name: "name", isDisabled: isCreating, children: [_jsx(Label, { children: apiKeyLocalization.name }), _jsx(Input, { autoFocus: true, placeholder: localization.settings.optional, variant: "secondary" }), _jsx(FieldError, {})] })] }), _jsxs(AlertDialog.Footer, { children: [_jsx(Button, { slot: "close", variant: "tertiary", isDisabled: isCreating, children: localization.settings.cancel }), _jsxs(Button, { type: "submit", isPending: isCreating, children: [isCreating && _jsx(Spinner, { color: "current", size: "sm" }), apiKeyLocalization.createApiKey] })] })] }) }) }) }), _jsx(NewApiKeyDialog, { isOpen: isNewKeyDialogOpen, onOpenChange: setIsNewKeyDialogOpen, secretKey: secretKey, name: keyName })] }));
 }
-//#endregion
-export { v as CreateApiKeyDialog };

package/dist/components/auth/api-key/delete-api-key-dialog.d.ts

@@ -1,7 +1,9 @@
-import { ListedApiKey } from '@better-auth-ui/react';
+import { type ListedApiKey } from "@better-auth-ui/react";
 export type DeleteApiKeyDialogProps = {
     isOpen: boolean;
     onOpenChange: (open: boolean) => void;
     apiKey: ListedApiKey;
+    /** Scope the delete payload to an organization (sets `configId`). */
+    organizationId?: string;
 };
-export declare function DeleteApiKeyDialog({ isOpen, onOpenChange, apiKey }: DeleteApiKeyDialogProps): import("react/jsx-runtime").JSX.Element;
+export declare function DeleteApiKeyDialog({ isOpen, onOpenChange, apiKey, organizationId }: DeleteApiKeyDialogProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/auth/api-key/delete-api-key-dialog.js

@@ -1,51 +1,17 @@
-import { apiKeyPlugin as e } from "../../../lib/auth/api-key-plugin.js";
-import { useAuth as t, useAuthPlugin as n, useDeleteApiKey as r } from "@better-auth-ui/react";
-import { Key as i } from "@gravity-ui/icons";
-import { AlertDialog as a, Button as o, Input as s, Label as c, Spinner as l, TextField as u } from "@heroui/react";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-//#region src/components/auth/api-key/delete-api-key-dialog.tsx
-function p({ isOpen: p, onOpenChange: m, apiKey: h }) {
-	let { authClient: g, localization: _ } = t(), { localization: v } = n(e), y = `${h.start}${"*".repeat(16)}`, { mutate: b, isPending: x } = r(g, { onSuccess: () => m(!1) });
-	return /* @__PURE__ */ d(a.Backdrop, {
-		isOpen: p,
-		onOpenChange: m,
-		children: /* @__PURE__ */ d(a.Container, { children: /* @__PURE__ */ f(a.Dialog, { children: [
-			/* @__PURE__ */ d(a.CloseTrigger, {}),
-			/* @__PURE__ */ f(a.Header, { children: [/* @__PURE__ */ d(a.Icon, {
-				status: "danger",
-				children: /* @__PURE__ */ d(i, {})
-			}), /* @__PURE__ */ d(a.Heading, { children: v.deleteApiKey })] }),
-			/* @__PURE__ */ f(a.Body, {
-				className: "flex flex-col gap-4 overflow-visible",
-				children: [/* @__PURE__ */ d("p", {
-					className: "text-muted text-sm",
-					children: v.deleteApiKeyWarning
-				}), /* @__PURE__ */ f(u, {
-					value: y,
-					className: "font-mono text-xs",
-					variant: "secondary",
-					children: [/* @__PURE__ */ d(c, { children: h.name || v.apiKey }), /* @__PURE__ */ d(s, {
-						readOnly: !0,
-						className: "font-mono text-xs"
-					})]
-				})]
-			}),
-			/* @__PURE__ */ f(a.Footer, { children: [/* @__PURE__ */ d(o, {
-				slot: "close",
-				variant: "tertiary",
-				isDisabled: x,
-				children: _.settings.cancel
-			}), /* @__PURE__ */ f(o, {
-				variant: "danger",
-				onPress: () => b({ keyId: h.id }),
-				isPending: x,
-				children: [x && /* @__PURE__ */ d(l, {
-					color: "current",
-					size: "sm"
-				}), v.deleteApiKey]
-			})] })
-		] }) })
-	});
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useAuth, useAuthPlugin, useDeleteApiKey } from "@better-auth-ui/react";
+import { Key } from "@gravity-ui/icons";
+import { AlertDialog, Button, Input, Label, Spinner, TextField } from "@heroui/react";
+import { apiKeyPlugin } from "../../../lib/auth/api-key-plugin";
+export function DeleteApiKeyDialog({ isOpen, onOpenChange, apiKey, organizationId }) {
+    const { authClient, localization } = useAuth();
+    const { localization: apiKeyLocalization } = useAuthPlugin(apiKeyPlugin);
+    const preview = `${apiKey.start}${"*".repeat(16)}`;
+    const { mutate: deleteApiKey, isPending: isDeleting } = useDeleteApiKey(authClient, {
+        onSuccess: () => onOpenChange(false)
+    });
+    return (_jsx(AlertDialog.Backdrop, { isOpen: isOpen, onOpenChange: onOpenChange, children: _jsx(AlertDialog.Container, { children: _jsxs(AlertDialog.Dialog, { children: [_jsx(AlertDialog.CloseTrigger, {}), _jsxs(AlertDialog.Header, { children: [_jsx(AlertDialog.Icon, { status: "danger", children: _jsx(Key, {}) }), _jsx(AlertDialog.Heading, { children: apiKeyLocalization.deleteApiKey })] }), _jsxs(AlertDialog.Body, { className: "flex flex-col gap-4 overflow-visible", children: [_jsx("p", { className: "text-muted text-sm", children: apiKeyLocalization.deleteApiKeyWarning }), _jsxs(TextField, { value: preview, className: "font-mono text-xs", variant: "secondary", children: [_jsx(Label, { children: apiKey.name || apiKeyLocalization.apiKey }), _jsx(Input, { readOnly: true, className: "font-mono text-xs" })] })] }), _jsxs(AlertDialog.Footer, { children: [_jsx(Button, { slot: "close", variant: "tertiary", isDisabled: isDeleting, children: localization.settings.cancel }), _jsxs(Button, { variant: "danger", onPress: () => deleteApiKey({
+                                    keyId: apiKey.id,
+                                    ...(organizationId ? { configId: "organization" } : {})
+                                }), isPending: isDeleting, children: [isDeleting && _jsx(Spinner, { color: "current", size: "sm" }), apiKeyLocalization.deleteApiKey] })] })] }) }) }));
 }
-//#endregion
-export { p as DeleteApiKeyDialog };

package/dist/components/auth/api-key/new-api-key-dialog.js

@@ -1,60 +1,24 @@
-import { apiKeyPlugin as e } from "../../../lib/auth/api-key-plugin.js";
-import { useAuth as t, useAuthPlugin as n } from "@better-auth-ui/react";
-import { Check as r, Copy as i, Key as a } from "@gravity-ui/icons";
-import { AlertDialog as o, Button as s, InputGroup as c, Label as l, TextField as u, toast as d } from "@heroui/react";
-import { useState as f } from "react";
-import { jsx as p, jsxs as m } from "react/jsx-runtime";
-//#region src/components/auth/api-key/new-api-key-dialog.tsx
-function h({ isOpen: h, onOpenChange: g, name: _, secretKey: v }) {
-	let { localization: y } = t(), { localization: b } = n(e), [x, S] = f(!1);
-	return /* @__PURE__ */ p(o.Backdrop, {
-		isOpen: h,
-		onOpenChange: g,
-		children: /* @__PURE__ */ p(o.Container, { children: /* @__PURE__ */ m(o.Dialog, { children: [
-			/* @__PURE__ */ p(o.CloseTrigger, {}),
-			/* @__PURE__ */ m(o.Header, { children: [/* @__PURE__ */ p(o.Icon, {
-				status: "warning",
-				children: /* @__PURE__ */ p(a, {})
-			}), /* @__PURE__ */ p(o.Heading, { children: b.newApiKey })] }),
-			/* @__PURE__ */ m(o.Body, {
-				className: "flex flex-col gap-4 overflow-visible",
-				children: [/* @__PURE__ */ p("p", {
-					className: "text-muted text-sm",
-					children: b.newApiKeyWarning
-				}), /* @__PURE__ */ m(u, {
-					value: v ?? "",
-					className: "font-mono text-xs",
-					children: [/* @__PURE__ */ p(l, { children: _ || b.apiKey }), /* @__PURE__ */ m(c, {
-						variant: "secondary",
-						children: [/* @__PURE__ */ p(c.Input, {
-							readOnly: !0,
-							className: "font-mono text-xs"
-						}), /* @__PURE__ */ p(c.Suffix, {
-							className: "px-0",
-							children: /* @__PURE__ */ p(s, {
-								isIconOnly: !0,
-								"aria-label": y.settings.copyToClipboard,
-								size: "sm",
-								variant: "ghost",
-								onPress: async () => {
-									if (v) try {
-										await navigator.clipboard.writeText(v), S(!0), setTimeout(() => S(!1), 1500);
-									} catch (e) {
-										d.danger(e instanceof Error ? e.message : String(e));
-									}
-								},
-								children: p(x ? r : i, {})
-							})
-						})]
-					})]
-				})]
-			}),
-			/* @__PURE__ */ p(o.Footer, { children: /* @__PURE__ */ p(s, {
-				slot: "close",
-				children: b.dismissNewKey
-			}) })
-		] }) })
-	});
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useAuth, useAuthPlugin } from "@better-auth-ui/react";
+import { Check, Copy, Key } from "@gravity-ui/icons";
+import { AlertDialog, Button, InputGroup, Label, TextField, toast } from "@heroui/react";
+import { useState } from "react";
+import { apiKeyPlugin } from "../../../lib/auth/api-key-plugin";
+export function NewApiKeyDialog({ isOpen, onOpenChange, name, secretKey }) {
+    const { localization } = useAuth();
+    const { localization: apiKeyLocalization } = useAuthPlugin(apiKeyPlugin);
+    const [copied, setCopied] = useState(false);
+    const copySecretKey = async () => {
+        if (!secretKey)
+            return;
+        try {
+            await navigator.clipboard.writeText(secretKey);
+            setCopied(true);
+            setTimeout(() => setCopied(false), 1500);
+        }
+        catch (error) {
+            toast.danger(error instanceof Error ? error.message : String(error));
+        }
+    };
+    return (_jsx(AlertDialog.Backdrop, { isOpen: isOpen, onOpenChange: onOpenChange, children: _jsx(AlertDialog.Container, { children: _jsxs(AlertDialog.Dialog, { children: [_jsx(AlertDialog.CloseTrigger, {}), _jsxs(AlertDialog.Header, { children: [_jsx(AlertDialog.Icon, { status: "warning", children: _jsx(Key, {}) }), _jsx(AlertDialog.Heading, { children: apiKeyLocalization.newApiKey })] }), _jsxs(AlertDialog.Body, { className: "flex flex-col gap-4 overflow-visible", children: [_jsx("p", { className: "text-muted text-sm", children: apiKeyLocalization.newApiKeyWarning }), _jsxs(TextField, { value: secretKey ?? "", className: "font-mono text-xs", children: [_jsx(Label, { children: name || apiKeyLocalization.apiKey }), _jsxs(InputGroup, { variant: "secondary", children: [_jsx(InputGroup.Input, { readOnly: true, className: "font-mono text-xs" }), _jsx(InputGroup.Suffix, { className: "px-0", children: _jsx(Button, { isIconOnly: true, "aria-label": localization.settings.copyToClipboard, size: "sm", variant: "ghost", onPress: copySecretKey, children: copied ? _jsx(Check, {}) : _jsx(Copy, {}) }) })] })] })] }), _jsx(AlertDialog.Footer, { children: _jsx(Button, { slot: "close", children: apiKeyLocalization.dismissNewKey }) })] }) }) }));
 }
-//#endregion
-export { h as NewApiKeyDialog };

package/dist/components/auth/api-key/organization-api-keys.d.ts

@@ -0,0 +1,14 @@
+import type { CardProps } from "@heroui/react";
+export type OrganizationApiKeysProps = {
+    className?: string;
+    variant?: CardProps["variant"];
+};
+/**
+ * {@link ApiKeys} scoped to the active organization.
+ *
+ * Hidden for members whose role isn't `owner`. Better Auth's
+ * `/organization/has-permission` endpoint isn't usable for `apiKey:*` checks
+ * (it doesn't pass `allowCreatorAllPermissions` and the default org AC has no
+ * `apiKey` statements), so we gate on role directly.
+ */
+export declare function OrganizationApiKeys({ className, variant }: OrganizationApiKeysProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/auth/api-key/organization-api-keys.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useActiveOrganization, useAuth, useListOrganizationMembers, useSession } from "@better-auth-ui/react";
+import { ApiKeys } from "./api-keys";
+/**
+ * {@link ApiKeys} scoped to the active organization.
+ *
+ * Hidden for members whose role isn't `owner`. Better Auth's
+ * `/organization/has-permission` endpoint isn't usable for `apiKey:*` checks
+ * (it doesn't pass `allowCreatorAllPermissions` and the default org AC has no
+ * `apiKey` statements), so we gate on role directly.
+ */
+export function OrganizationApiKeys({ className, variant }) {
+    const { authClient } = useAuth();
+    const { data: session } = useSession(authClient);
+    const { data: activeOrganization, isPending: activeOrganizationPending } = useActiveOrganization(authClient);
+    const { data: membersData } = useListOrganizationMembers(authClient);
+    const canManageApiKeys = membersData?.members.some((member) => member.role === "owner" && member.userId === session?.user.id);
+    if (!canManageApiKeys) {
+        return null;
+    }
+    return (_jsx(ApiKeys, { className: className, variant: variant, organizationId: activeOrganization?.id, isPending: activeOrganizationPending }));
+}

package/dist/components/auth/auth-provider.d.ts

@@ -1,4 +1,4 @@
-import { AuthClient, AuthProviderProps as AuthProviderPropsPrimitive } from '@better-auth-ui/react';
+import { type AuthClient, type AuthProviderProps as AuthProviderPropsPrimitive } from "@better-auth-ui/react";
 export type AuthProviderProps<TAuthClient = AuthClient> = AuthProviderPropsPrimitive<TAuthClient>;
 /**
  * Heroui-flavored `AuthProvider`. Wraps the primitive provider with a

package/dist/components/auth/auth-provider.js

@@ -1,17 +1,11 @@
-import { ErrorToaster as e } from "./error-toaster.js";
-import { AuthProvider as t } from "@better-auth-ui/react";
-import { RouterProvider as n } from "@heroui/react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-//#region src/components/auth/auth-provider.tsx
-function a({ children: a, navigate: o, ...s }) {
-	return /* @__PURE__ */ r(t, {
-		navigate: o,
-		...s,
-		children: /* @__PURE__ */ i(n, {
-			navigate: (e) => o({ to: e }),
-			children: [a, /* @__PURE__ */ r(e, {})]
-		})
-	});
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AuthProvider as AuthProviderPrimitive } from "@better-auth-ui/react";
+import { RouterProvider } from "@heroui/react";
+import { ErrorToaster } from "./error-toaster";
+/**
+ * Heroui-flavored `AuthProvider`. Wraps the primitive provider with a
+ * heroui `RouterProvider` and the heroui `ErrorToaster`.
+ */
+export function AuthProvider({ children, navigate, ...config }) {
+    return (_jsx(AuthProviderPrimitive, { navigate: navigate, ...config, children: _jsxs(RouterProvider, { navigate: (path) => navigate({ to: path }), children: [children, _jsx(ErrorToaster, {})] }) }));
 }
-//#endregion
-export { a as AuthProvider };

package/dist/components/auth/auth.d.ts

@@ -1,6 +1,6 @@
-import { AuthView } from '@better-auth-ui/core';
-import { CardProps } from '@heroui/react';
-import { SocialLayout } from './provider-buttons';
+import type { AuthView } from "@better-auth-ui/core";
+import type { CardProps } from "@heroui/react";
+import type { SocialLayout } from "./provider-buttons";
 export type AuthProps = {
     className?: string;
     path?: string;

package/dist/components/auth/auth.js

@@ -1,63 +1,88 @@
-import { ForgotPassword as e } from "./forgot-password.js";
-import { ResetPassword as t } from "./reset-password.js";
-import { SignIn as n } from "./sign-in.js";
-import { SignOut as r } from "./sign-out.js";
-import { SignUp as i } from "./sign-up.js";
-import { useAuth as a } from "@better-auth-ui/react";
-import { useEffect as o } from "react";
-import { jsx as s } from "react/jsx-runtime";
-//#region src/components/auth/auth.tsx
-var c = [
-	"signUp",
-	"forgotPassword",
-	"resetPassword"
-], l = {
-	signIn: n,
-	signOut: r,
-	signUp: i,
-	forgotPassword: e,
-	resetPassword: t
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useAuth } from "@better-auth-ui/react";
+import { useEffect } from "react";
+import { ForgotPassword } from "./forgot-password";
+import { ResetPassword } from "./reset-password";
+import { SignIn } from "./sign-in";
+import { SignOut } from "./sign-out";
+import { SignUp } from "./sign-up";
+/**
+ * Built-in views that only make sense when email + password auth is enabled.
+ * When it's disabled, the `<Auth>` router redirects these to `signIn` so a
+ * plugin's `fallbackViews.auth.signIn` (e.g. magic link) takes over.
+ */
+const PASSWORD_ONLY_VIEWS = ["signUp", "forgotPassword", "resetPassword"];
+const AUTH_VIEWS = {
+    signIn: SignIn,
+    signOut: SignOut,
+    signUp: SignUp,
+    forgotPassword: ForgotPassword,
+    resetPassword: ResetPassword
 };
-function u({ path: e, socialLayout: t, socialPosition: n, view: r, ...i }) {
-	let { basePaths: u, emailAndPassword: d, plugins: f, viewPaths: p, navigate: m } = a();
-	if (!r && !e) throw Error("[Better Auth UI] Either `view` or `path` must be provided");
-	let h = r || Object.keys(p.auth).find((t) => p.auth[t] === e), g = !d?.enabled && h && c.includes(h);
-	if (o(() => {
-		g && m({
-			to: `${u.auth}/${p.auth.signIn}`,
-			replace: !0
-		});
-	}, [
-		g,
-		m,
-		u.auth,
-		p.auth.signIn
-	]), g) return null;
-	for (let a of f) {
-		let o = a.viewPaths?.auth, c = r ?? h ?? (o && Object.keys(o).find((t) => o[t] === e));
-		if (!c) continue;
-		let l = a.views?.auth?.[c];
-		if (l) return /* @__PURE__ */ s(l, {
-			socialLayout: t,
-			socialPosition: n,
-			...i
-		});
-	}
-	if (h === "signIn" && !d?.enabled) {
-		let e = f.find((e) => e.fallbackViews?.auth?.signIn)?.fallbackViews?.auth?.signIn;
-		if (e) return /* @__PURE__ */ s(e, {
-			socialLayout: t,
-			socialPosition: n,
-			...i
-		});
-	}
-	let _ = h ? l[h] : void 0;
-	if (!_) throw Error(`[Better Auth UI] Unknown view "${h}". Valid views are: ${Object.keys(l).join(", ")}`);
-	return /* @__PURE__ */ s(_, {
-		socialLayout: t,
-		socialPosition: n,
-		...i
-	});
+/**
+ * Render the appropriate authentication view based on the provided `view` or `path`.
+ *
+ * @param path - Route path used to resolve an auth view when `view` is not provided
+ * @param socialLayout - Social layout to apply to sign-in/sign-up/magic-link views
+ * @param socialPosition - Position for social buttons ("top" or "bottom")
+ * @param variant - Variant to apply to the card
+ * @param view - Explicit auth view to render (e.g., "signIn", "signUp")
+ * @returns The React element for the resolved authentication view
+ */
+export function Auth({ path, socialLayout, socialPosition, view, ...props }) {
+    const { basePaths, emailAndPassword, plugins, viewPaths, navigate } = useAuth();
+    if (!view && !path) {
+        throw new Error("[Better Auth UI] Either `view` or `path` must be provided");
+    }
+    const authView = view ||
+        Object.keys(viewPaths.auth).find((key) => viewPaths.auth[key] === path);
+    // When email + password auth is disabled, password-only views (signUp,
+    // forgotPassword, resetPassword) have no meaning. Redirect them to signIn,
+    // where a plugin's `fallbackViews.auth.signIn` (e.g. magic link) takes
+    // over as the primary entry point.
+    const shouldRedirectToSignIn = !emailAndPassword?.enabled &&
+        authView &&
+        PASSWORD_ONLY_VIEWS.includes(authView);
+    useEffect(() => {
+        if (shouldRedirectToSignIn) {
+            navigate({
+                to: `${basePaths.auth}/${viewPaths.auth.signIn}`,
+                replace: true
+            });
+        }
+    }, [shouldRedirectToSignIn, navigate, basePaths.auth, viewPaths.auth.signIn]);
+    if (shouldRedirectToSignIn) {
+        return null;
+    }
+    // 1. Plugin overrides (`views.auth[currentView]`) — first plugin wins,
+    //    including over built-in views. Resolves the view key from `view`,
+    //    then `authView` (built-in path match), then plugin-introduced paths
+    //    (e.g. `magicLink` → `/auth/magic-link`).
+    for (const plugin of plugins) {
+        const pluginAuthPaths = plugin.viewPaths?.auth;
+        const pluginView = view ??
+            authView ??
+            (pluginAuthPaths &&
+                Object.keys(pluginAuthPaths).find((key) => pluginAuthPaths[key] === path));
+        if (!pluginView)
+            continue;
+        const PluginView = plugin.views?.auth?.[pluginView];
+        if (!PluginView)
+            continue;
+        return (_jsx(PluginView, { socialLayout: socialLayout, socialPosition: socialPosition, ...props }));
+    }
+    // 2. Plugin fallbacks — only when the built-in `signIn` isn't viable
+    //    (password auth is off). Used by `magicLinkPlugin` to render the
+    //    magic-link form as the primary passwordless sign-in surface.
+    if (authView === "signIn" && !emailAndPassword?.enabled) {
+        const Fallback = plugins.find((plugin) => plugin.fallbackViews?.auth?.signIn)?.fallbackViews?.auth?.signIn;
+        if (Fallback) {
+            return (_jsx(Fallback, { socialLayout: socialLayout, socialPosition: socialPosition, ...props }));
+        }
+    }
+    const AuthView = authView ? AUTH_VIEWS[authView] : undefined;
+    if (!AuthView) {
+        throw new Error(`[Better Auth UI] Unknown view "${authView}". Valid views are: ${Object.keys(AUTH_VIEWS).join(", ")}`);
+    }
+    return (_jsx(AuthView, { socialLayout: socialLayout, socialPosition: socialPosition, ...props }));
 }
-//#endregion
-export { u as Auth };

package/dist/components/auth/delete-user/danger-zone.d.ts

@@ -1,11 +1,11 @@
-import { CardProps } from '@heroui/react';
-import { ComponentProps } from 'react';
+import { type CardProps } from "@heroui/react";
+import type { ComponentProps } from "react";
 export type DangerZoneProps = {
     className?: string;
     variant?: CardProps["variant"];
 };
 /**
- * Renders the danger zone heading and {@link DeleteUser}.
+ * Renders the danger zone heading and {@link DeleteAccount}.
  * Registered as a `securityCard` by `deleteUserPlugin()`; gate by registering the plugin.
  */
 export declare function DangerZone({ className, variant, ...props }: DangerZoneProps & ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;