@better-auth-ui/heroui 1.6.2 → 1.6.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (213) hide show
  1. package/dist/components/auth/additional-field.d.ts +4 -0
  2. package/dist/components/auth/additional-field.js +270 -0
  3. package/dist/components/auth/auth-provider.d.ts +4 -6
  4. package/dist/components/auth/auth-provider.js +12 -11
  5. package/dist/components/auth/auth.d.ts +1 -1
  6. package/dist/components/auth/auth.js +54 -28
  7. package/dist/components/{settings/security → auth/delete-user}/danger-zone.d.ts +3 -4
  8. package/dist/components/{settings/security → auth/delete-user}/danger-zone.js +1 -1
  9. package/dist/components/{settings/security → auth/delete-user}/delete-user.d.ts +1 -1
  10. package/dist/components/auth/delete-user/delete-user.js +95 -0
  11. package/dist/components/{email → auth/email}/email-changed-email.d.ts +2 -2
  12. package/dist/components/{email → auth/email}/email-changed-email.js +7 -7
  13. package/dist/components/{email → auth/email}/email-verification-email.d.ts +2 -2
  14. package/dist/components/{email → auth/email}/email-verification-email.js +7 -7
  15. package/dist/components/auth/email/magic-link-email.d.ts +3 -0
  16. package/dist/components/{email → auth/email}/magic-link-email.js +7 -7
  17. package/dist/components/auth/email/new-device-email.d.ts +3 -0
  18. package/dist/components/{email → auth/email}/new-device-email.js +7 -7
  19. package/dist/components/auth/email/otp-email.d.ts +3 -0
  20. package/dist/components/{email → auth/email}/otp-email.js +6 -6
  21. package/dist/components/{email → auth/email}/password-changed-email.d.ts +2 -2
  22. package/dist/components/{email → auth/email}/password-changed-email.js +7 -7
  23. package/dist/components/{email → auth/email}/reset-password-email.d.ts +2 -2
  24. package/dist/components/{email → auth/email}/reset-password-email.js +7 -7
  25. package/dist/components/auth/error-toaster.d.ts +1 -0
  26. package/dist/components/auth/error-toaster.js +17 -0
  27. package/dist/components/auth/forgot-password.d.ts +2 -2
  28. package/dist/components/auth/forgot-password.js +42 -42
  29. package/dist/components/auth/magic-link/magic-link-button.d.ts +11 -0
  30. package/dist/components/auth/magic-link/magic-link-button.js +20 -0
  31. package/dist/components/auth/magic-link/magic-link.d.ts +16 -0
  32. package/dist/components/auth/magic-link/magic-link.js +87 -0
  33. package/dist/components/{settings/account → auth/multi-session}/manage-account.d.ts +2 -6
  34. package/dist/components/auth/multi-session/manage-account.js +49 -0
  35. package/dist/components/{settings/account → auth/multi-session}/manage-accounts.d.ts +1 -1
  36. package/dist/components/auth/multi-session/manage-accounts.js +34 -0
  37. package/dist/components/{user/switch-account-menu.d.ts → auth/multi-session/switch-account-submenu-content.d.ts} +3 -3
  38. package/dist/components/auth/multi-session/switch-account-submenu-content.js +29 -0
  39. package/dist/components/{user/switch-account-item.d.ts → auth/multi-session/switch-account-submenu-item.d.ts} +2 -2
  40. package/dist/components/auth/multi-session/switch-account-submenu-item.js +20 -0
  41. package/dist/components/auth/multi-session/switch-account-submenu.d.ts +13 -0
  42. package/dist/components/auth/multi-session/switch-account-submenu.js +24 -0
  43. package/dist/components/auth/passkey/passkey-button.d.ts +6 -0
  44. package/dist/components/auth/passkey/passkey-button.js +24 -0
  45. package/dist/components/auth/passkey/passkey.js +45 -0
  46. package/dist/components/{settings/security → auth/passkey}/passkeys.d.ts +1 -1
  47. package/dist/components/auth/passkey/passkeys.js +106 -0
  48. package/dist/components/auth/provider-button.d.ts +13 -0
  49. package/dist/components/auth/provider-button.js +25 -0
  50. package/dist/components/auth/provider-buttons.d.ts +3 -10
  51. package/dist/components/auth/provider-buttons.js +14 -22
  52. package/dist/components/auth/reset-password.d.ts +1 -1
  53. package/dist/components/auth/reset-password.js +110 -110
  54. package/dist/components/{settings → auth/settings}/account/account-settings.d.ts +5 -2
  55. package/dist/components/auth/settings/account/account-settings.js +20 -0
  56. package/dist/components/auth/settings/account/change-avatar.js +89 -0
  57. package/dist/components/{settings → auth/settings}/account/change-email.d.ts +1 -1
  58. package/dist/components/{settings → auth/settings}/account/change-email.js +17 -20
  59. package/dist/components/{settings → auth/settings}/account/user-profile.d.ts +3 -4
  60. package/dist/components/auth/settings/account/user-profile.js +86 -0
  61. package/dist/components/auth/settings/security/active-session.js +59 -0
  62. package/dist/components/{settings → auth/settings}/security/active-sessions.d.ts +1 -1
  63. package/dist/components/auth/settings/security/active-sessions.js +34 -0
  64. package/dist/components/{settings → auth/settings}/security/change-password.d.ts +1 -1
  65. package/dist/components/auth/settings/security/change-password.js +189 -0
  66. package/dist/components/auth/settings/security/linked-account.js +56 -0
  67. package/dist/components/{settings → auth/settings}/security/linked-accounts.d.ts +1 -1
  68. package/dist/components/auth/settings/security/linked-accounts.js +45 -0
  69. package/dist/components/{settings → auth/settings}/security/security-settings.d.ts +1 -1
  70. package/dist/components/auth/settings/security/security-settings.js +22 -0
  71. package/dist/components/auth/settings/settings.js +45 -0
  72. package/dist/components/auth/sign-in.d.ts +1 -1
  73. package/dist/components/auth/sign-in.js +64 -100
  74. package/dist/components/auth/sign-out.js +11 -11
  75. package/dist/components/auth/sign-up.d.ts +1 -1
  76. package/dist/components/auth/sign-up.js +123 -157
  77. package/dist/components/{settings/account → auth/theme}/appearance.d.ts +3 -6
  78. package/dist/components/auth/theme/appearance.js +72 -0
  79. package/dist/components/auth/theme/theme-toggle-item.d.ts +5 -0
  80. package/dist/components/auth/theme/theme-toggle-item.js +58 -0
  81. package/dist/components/auth/user/user-avatar.js +29 -0
  82. package/dist/components/{user → auth/user}/user-button.d.ts +2 -6
  83. package/dist/components/auth/user/user-button.js +55 -0
  84. package/dist/components/auth/user/user-view.js +37 -0
  85. package/dist/components/auth/username/sign-in-username.d.ts +14 -0
  86. package/dist/components/auth/username/sign-in-username.js +142 -0
  87. package/dist/components/auth/username/username-field.d.ts +8 -0
  88. package/dist/components/auth/username/username-field.js +51 -0
  89. package/dist/email.d.ts +7 -0
  90. package/dist/email.js +9 -0
  91. package/dist/index.d.ts +13 -27
  92. package/dist/index.js +22 -36
  93. package/dist/lib/auth/auth-plugin.d.ts +44 -0
  94. package/dist/lib/auth/delete-user-plugin.d.ts +17 -0
  95. package/dist/lib/auth/delete-user-plugin.js +10 -0
  96. package/dist/lib/auth/magic-link-plugin.d.ts +31 -0
  97. package/dist/lib/auth/magic-link-plugin.js +13 -0
  98. package/dist/lib/auth/multi-session-plugin.d.ts +18 -0
  99. package/dist/lib/auth/multi-session-plugin.js +12 -0
  100. package/dist/lib/auth/passkey-plugin.d.ts +20 -0
  101. package/dist/lib/auth/passkey-plugin.js +12 -0
  102. package/dist/lib/auth/theme-plugin.d.ts +68 -0
  103. package/dist/lib/auth/theme-plugin.js +23 -0
  104. package/dist/lib/auth/username-plugin.d.ts +63 -0
  105. package/dist/lib/auth/username-plugin.js +18 -0
  106. package/dist/plugins.d.ts +20 -0
  107. package/dist/plugins.js +21 -0
  108. package/package.json +22 -22
  109. package/src/components/auth/additional-field.tsx +554 -0
  110. package/src/components/auth/auth-provider.tsx +8 -5
  111. package/src/components/auth/auth.tsx +100 -36
  112. package/src/components/{settings/security → auth/delete-user}/danger-zone.tsx +3 -10
  113. package/src/components/{settings/security → auth/delete-user}/delete-user.tsx +31 -24
  114. package/src/components/{email → auth/email}/email-changed-email.tsx +2 -2
  115. package/src/components/{email → auth/email}/email-verification-email.tsx +2 -2
  116. package/src/components/{email → auth/email}/magic-link-email.tsx +2 -2
  117. package/src/components/{email → auth/email}/new-device-email.tsx +2 -2
  118. package/src/components/{email → auth/email}/otp-email.tsx +2 -2
  119. package/src/components/{email → auth/email}/password-changed-email.tsx +2 -2
  120. package/src/components/{email → auth/email}/reset-password-email.tsx +2 -2
  121. package/src/components/auth/error-toaster.tsx +25 -0
  122. package/src/components/auth/forgot-password.tsx +15 -13
  123. package/src/components/auth/magic-link/magic-link-button.tsx +61 -0
  124. package/src/components/auth/{magic-link.tsx → magic-link/magic-link.tsx} +52 -57
  125. package/src/components/{settings/account → auth/multi-session}/manage-account.tsx +15 -15
  126. package/src/components/{settings/account → auth/multi-session}/manage-accounts.tsx +16 -12
  127. package/src/components/{user/switch-account-menu.tsx → auth/multi-session/switch-account-submenu-content.tsx} +19 -17
  128. package/src/components/{user/switch-account-item.tsx → auth/multi-session/switch-account-submenu-item.tsx} +18 -8
  129. package/src/components/auth/multi-session/switch-account-submenu.tsx +50 -0
  130. package/src/components/auth/passkey/passkey-button.tsx +56 -0
  131. package/src/components/{settings/security → auth/passkey}/passkey.tsx +21 -9
  132. package/src/components/auth/passkey/passkeys.tsx +196 -0
  133. package/src/components/auth/provider-button.tsx +65 -0
  134. package/src/components/auth/provider-buttons.tsx +23 -45
  135. package/src/components/auth/reset-password.tsx +14 -9
  136. package/src/components/{settings → auth/settings}/account/account-settings.tsx +15 -13
  137. package/src/components/{settings → auth/settings}/account/change-avatar.tsx +4 -5
  138. package/src/components/{settings → auth/settings}/account/change-email.tsx +5 -6
  139. package/src/components/auth/settings/account/user-profile.tsx +171 -0
  140. package/src/components/{settings → auth/settings}/security/active-session.tsx +8 -6
  141. package/src/components/{settings → auth/settings}/security/active-sessions.tsx +5 -10
  142. package/src/components/{settings → auth/settings}/security/change-password.tsx +22 -14
  143. package/src/components/{settings → auth/settings}/security/linked-account.tsx +10 -16
  144. package/src/components/{settings → auth/settings}/security/linked-accounts.tsx +4 -9
  145. package/src/components/{settings → auth/settings}/security/security-settings.tsx +7 -6
  146. package/src/components/{settings → auth/settings}/settings.tsx +2 -2
  147. package/src/components/auth/sign-in.tsx +39 -80
  148. package/src/components/auth/sign-out.tsx +2 -2
  149. package/src/components/auth/sign-up.tsx +110 -147
  150. package/src/components/{settings/account → auth/theme}/appearance.tsx +18 -25
  151. package/src/components/auth/theme/theme-toggle-item.tsx +110 -0
  152. package/src/components/{user → auth/user}/user-avatar.tsx +12 -4
  153. package/src/components/{user → auth/user}/user-button.tsx +15 -88
  154. package/src/components/{user → auth/user}/user-view.tsx +12 -4
  155. package/src/components/auth/username/sign-in-username.tsx +283 -0
  156. package/src/components/auth/username/username-field.tsx +122 -0
  157. package/src/email.ts +9 -0
  158. package/src/index.tsx +13 -27
  159. package/src/lib/auth/auth-plugin.ts +67 -0
  160. package/src/lib/auth/delete-user-plugin.ts +15 -0
  161. package/src/lib/auth/magic-link-plugin.ts +26 -0
  162. package/src/lib/auth/multi-session-plugin.ts +17 -0
  163. package/src/lib/auth/passkey-plugin.ts +17 -0
  164. package/src/lib/auth/theme-plugin.ts +86 -0
  165. package/src/lib/auth/username-plugin.tsx +30 -0
  166. package/src/plugins.ts +23 -0
  167. package/dist/components/auth/magic-link-button.d.ts +0 -13
  168. package/dist/components/auth/magic-link-button.js +0 -16
  169. package/dist/components/auth/magic-link.d.ts +0 -17
  170. package/dist/components/auth/magic-link.js +0 -111
  171. package/dist/components/auth/passkey-button.d.ts +0 -4
  172. package/dist/components/auth/passkey-button.js +0 -24
  173. package/dist/components/email/magic-link-email.d.ts +0 -3
  174. package/dist/components/email/new-device-email.d.ts +0 -3
  175. package/dist/components/email/otp-email.d.ts +0 -3
  176. package/dist/components/settings/account/account-settings.js +0 -23
  177. package/dist/components/settings/account/appearance.js +0 -71
  178. package/dist/components/settings/account/change-avatar.js +0 -89
  179. package/dist/components/settings/account/manage-account.js +0 -51
  180. package/dist/components/settings/account/manage-accounts.js +0 -33
  181. package/dist/components/settings/account/user-profile.js +0 -106
  182. package/dist/components/settings/security/active-session.js +0 -62
  183. package/dist/components/settings/security/active-sessions.js +0 -34
  184. package/dist/components/settings/security/change-password.js +0 -192
  185. package/dist/components/settings/security/delete-user.js +0 -97
  186. package/dist/components/settings/security/linked-account.js +0 -62
  187. package/dist/components/settings/security/linked-accounts.js +0 -45
  188. package/dist/components/settings/security/passkey.js +0 -43
  189. package/dist/components/settings/security/passkeys.js +0 -53
  190. package/dist/components/settings/security/security-settings.js +0 -25
  191. package/dist/components/settings/settings.js +0 -45
  192. package/dist/components/user/switch-account-item.js +0 -20
  193. package/dist/components/user/switch-account-menu.js +0 -28
  194. package/dist/components/user/user-avatar.js +0 -29
  195. package/dist/components/user/user-button.js +0 -91
  196. package/dist/components/user/user-view.js +0 -37
  197. package/dist/core.d.ts +0 -1
  198. package/dist/core.js +0 -1
  199. package/dist/react-exports.d.ts +0 -1
  200. package/dist/react-exports.js +0 -1
  201. package/src/components/auth/magic-link-button.tsx +0 -43
  202. package/src/components/auth/passkey-button.tsx +0 -36
  203. package/src/components/settings/account/user-profile.tsx +0 -218
  204. package/src/components/settings/security/passkeys.tsx +0 -104
  205. package/src/core.ts +0 -1
  206. package/src/react-exports.ts +0 -1
  207. /package/dist/components/{settings/security → auth/passkey}/passkey.d.ts +0 -0
  208. /package/dist/components/{settings → auth/settings}/account/change-avatar.d.ts +0 -0
  209. /package/dist/components/{settings → auth/settings}/security/active-session.d.ts +0 -0
  210. /package/dist/components/{settings → auth/settings}/security/linked-account.d.ts +0 -0
  211. /package/dist/components/{settings → auth/settings}/settings.d.ts +0 -0
  212. /package/dist/components/{user → auth/user}/user-avatar.d.ts +0 -0
  213. /package/dist/components/{user → auth/user}/user-view.d.ts +0 -0
@@ -1,62 +0,0 @@
1
- import { providerIcons as e, useAccountInfo as t, useAuth as n, useLinkSocial as r, useUnlinkAccount as i } from "@better-auth-ui/react";
2
- import { Button as a, Skeleton as o, Spinner as s, cn as c, toast as l } from "@heroui/react";
3
- import { jsx as u, jsxs as d } from "react/jsx-runtime";
4
- import { Link as f, LinkSlash as p, PlugConnection as m } from "@gravity-ui/icons";
5
- import { getProviderName as h } from "@better-auth-ui/core";
6
- //#region src/components/settings/security/linked-account.tsx
7
- function g({ account: g, provider: _ }) {
8
- let { baseURL: v, localization: y } = n(), { data: b, isPending: x } = t(g?.accountId, {
9
- enabled: !!g,
10
- throwOnError: (e) => (e.error && l.danger(e.error.message), !1)
11
- }), { mutate: S, isPending: C } = r({ onError: (e) => l.danger(e.error?.message || e.message) }), { mutate: w, isPending: T } = i({
12
- onError: (e) => l.danger(e.error?.message || e.message),
13
- onSuccess: () => l.success(y.settings.accountUnlinked)
14
- }), E = e[_], D = h(_), O = b?.data?.login || b?.data?.username || b?.user?.email || b?.user?.name || g?.accountId;
15
- return /* @__PURE__ */ d("div", {
16
- className: "flex items-center gap-3",
17
- children: [
18
- /* @__PURE__ */ u("div", {
19
- className: c("flex size-10 shrink-0 items-center justify-center rounded-xl bg-surface-secondary"),
20
- children: u(E || m, { className: c("size-4.5", !g && "opacity-50") })
21
- }),
22
- /* @__PURE__ */ d("div", {
23
- className: "flex flex-col min-w-0",
24
- children: [/* @__PURE__ */ u("span", {
25
- className: "text-sm font-medium leading-tight",
26
- children: D
27
- }), g && x ? /* @__PURE__ */ u(o, { className: "h-3 w-24 my-0.5 rounded-lg" }) : /* @__PURE__ */ u("span", {
28
- className: "text-xs text-muted truncate",
29
- children: g ? O : y.settings.linkProvider.replace("{{provider}}", D)
30
- })]
31
- }),
32
- g ? /* @__PURE__ */ d(a, {
33
- className: "ml-auto shrink-0",
34
- variant: "outline",
35
- size: "sm",
36
- onPress: () => w({ providerId: g.providerId }),
37
- isPending: T,
38
- "aria-label": y.settings.unlinkProvider.replace("{{provider}}", D),
39
- children: [T ? /* @__PURE__ */ u(s, {
40
- color: "current",
41
- size: "sm"
42
- }) : /* @__PURE__ */ u(p, {}), y.settings.unlinkProvider.replace("{{provider}}", "").trim()]
43
- }) : /* @__PURE__ */ d(a, {
44
- className: "ml-auto shrink-0",
45
- variant: "outline",
46
- size: "sm",
47
- onPress: () => S({
48
- provider: _,
49
- callbackURL: `${v}${window.location.pathname}`
50
- }),
51
- isPending: C,
52
- "aria-label": y.settings.linkProvider.replace("{{provider}}", D),
53
- children: [C ? /* @__PURE__ */ u(s, {
54
- color: "current",
55
- size: "sm"
56
- }) : /* @__PURE__ */ u(f, {}), y.settings.link]
57
- })
58
- ]
59
- });
60
- }
61
- //#endregion
62
- export { g as LinkedAccount };
@@ -1,45 +0,0 @@
1
- import { LinkedAccount as e } from "./linked-account.js";
2
- import { useAuth as t, useListAccounts as n } from "@better-auth-ui/react";
3
- import { Card as r, Skeleton as i, cn as a, toast as o } from "@heroui/react";
4
- import { jsx as s, jsxs as c } from "react/jsx-runtime";
5
- //#region src/components/settings/security/linked-accounts.tsx
6
- function l({ className: i, variant: l, ...d }) {
7
- let { localization: f, socialProviders: p } = t(), { data: m, isPending: h } = n({ throwOnError: (e) => (e.error && o.danger(e.error.message), !1) }), g = [...(m?.filter((e) => e.providerId !== "credential"))?.map((e) => ({
8
- key: e.id,
9
- account: e,
10
- provider: e.providerId
11
- })) ?? [], ...p?.map((e) => ({
12
- key: e,
13
- account: void 0,
14
- provider: e
15
- })) ?? []];
16
- return /* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("h2", {
17
- className: a("text-sm font-semibold mb-3"),
18
- children: f.settings.linkedAccounts
19
- }), /* @__PURE__ */ s(r, {
20
- className: a(i),
21
- variant: l,
22
- ...d,
23
- children: /* @__PURE__ */ s(r.Content, {
24
- className: "gap-0",
25
- children: h ? p?.map((e, t) => /* @__PURE__ */ c("div", { children: [t > 0 && /* @__PURE__ */ s("div", { className: "border-b border-dashed -mx-4 md:-mx-6 my-4" }), /* @__PURE__ */ s(u, {})] }, e)) : g.map((t, n) => /* @__PURE__ */ c("div", { children: [n > 0 && /* @__PURE__ */ s("div", { className: "border-b border-dashed -mx-4 md:-mx-6 my-4" }), /* @__PURE__ */ s(e, {
26
- account: t.account,
27
- provider: t.provider
28
- })] }, t.key))
29
- })
30
- })] });
31
- }
32
- function u() {
33
- return /* @__PURE__ */ s("div", {
34
- className: "flex items-center justify-between",
35
- children: /* @__PURE__ */ c("div", {
36
- className: "flex items-center gap-3",
37
- children: [/* @__PURE__ */ s(i, { className: "size-10 rounded-xl" }), /* @__PURE__ */ c("div", {
38
- className: "flex flex-col gap-1",
39
- children: [/* @__PURE__ */ s(i, { className: "h-4 w-20 rounded-lg" }), /* @__PURE__ */ s(i, { className: "h-3 w-32 rounded-lg" })]
40
- })]
41
- })
42
- });
43
- }
44
- //#endregion
45
- export { l as LinkedAccounts };
@@ -1,43 +0,0 @@
1
- import { useAuth as e, useDeletePasskey as t } from "@better-auth-ui/react";
2
- import { Button as n, Spinner as r, toast as i } from "@heroui/react";
3
- import { jsx as a, jsxs as o } from "react/jsx-runtime";
4
- import { Fingerprint as s, Xmark as c } from "@gravity-ui/icons";
5
- //#region src/components/settings/security/passkey.tsx
6
- function l({ passkey: l }) {
7
- let { localization: u } = e(), { mutate: d, isPending: f } = t({ onError: (e) => i.danger(e.error?.message || e.message) });
8
- return /* @__PURE__ */ o("div", {
9
- className: "flex items-center gap-3",
10
- children: [
11
- /* @__PURE__ */ a("div", {
12
- className: "flex size-10 shrink-0 items-center justify-center rounded-xl bg-surface-secondary",
13
- children: /* @__PURE__ */ a(s, { className: "size-4.5" })
14
- }),
15
- /* @__PURE__ */ o("div", {
16
- className: "flex flex-col min-w-0",
17
- children: [/* @__PURE__ */ a("span", {
18
- className: "text-sm font-medium leading-tight",
19
- children: l.name || u.auth.passkey
20
- }), /* @__PURE__ */ a("span", {
21
- className: "text-xs text-muted",
22
- children: new Date(l.createdAt).toLocaleString(void 0, {
23
- dateStyle: "medium",
24
- timeStyle: "short"
25
- })
26
- })]
27
- }),
28
- /* @__PURE__ */ o(n, {
29
- className: "ml-auto shrink-0",
30
- variant: "outline",
31
- size: "sm",
32
- isPending: f,
33
- onPress: () => d({ id: l.id }),
34
- children: [f ? /* @__PURE__ */ a(r, {
35
- color: "current",
36
- size: "sm"
37
- }) : /* @__PURE__ */ a(c, {}), u.settings.delete]
38
- })
39
- ]
40
- });
41
- }
42
- //#endregion
43
- export { l as Passkey };
@@ -1,53 +0,0 @@
1
- import { Passkey as e } from "./passkey.js";
2
- import { useAddPasskey as t, useAuth as n, useListUserPasskeys as r } from "@better-auth-ui/react";
3
- import { Button as i, Card as a, Skeleton as o, Spinner as s, cn as c, toast as l } from "@heroui/react";
4
- import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
5
- //#region src/components/settings/security/passkeys.tsx
6
- function p({ className: o, variant: p, ...h }) {
7
- let { localization: g } = n(), { data: _, isPending: v } = r({ throwOnError: (e) => (e.error && l.danger(e.error.message), !1) }), { mutate: y, isPending: b } = t({ onError: (e) => l.danger(e.error?.message || e.message) });
8
- return /* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h2", {
9
- className: c("text-sm font-semibold mb-3"),
10
- children: g.settings.passkeys
11
- }), /* @__PURE__ */ d(a, {
12
- className: c(o),
13
- variant: p,
14
- ...h,
15
- children: /* @__PURE__ */ f(a.Content, {
16
- className: "gap-0",
17
- children: [/* @__PURE__ */ f("div", {
18
- className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between",
19
- children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("p", {
20
- className: "text-sm font-medium leading-tight",
21
- children: g.settings.passkeysDescription
22
- }), /* @__PURE__ */ d("p", {
23
- className: "text-muted text-xs mt-0.5",
24
- children: g.settings.passkeysInstructions
25
- })] }), /* @__PURE__ */ f(i, {
26
- className: "shrink-0",
27
- size: "sm",
28
- isPending: b,
29
- isDisabled: v,
30
- onPress: () => y(),
31
- children: [b && /* @__PURE__ */ d(s, {
32
- color: "current",
33
- size: "sm"
34
- }), g.settings.addPasskey]
35
- })]
36
- }), v ? /* @__PURE__ */ f(u, { children: [/* @__PURE__ */ d("div", { className: "border-b border-dashed -mx-4 md:-mx-6 my-4" }), /* @__PURE__ */ d(m, {})] }) : _?.map((t) => /* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("div", { className: "border-b border-dashed -mx-4 md:-mx-6 my-4" }), /* @__PURE__ */ d(e, { passkey: t })] }, t.id))]
37
- })
38
- })] });
39
- }
40
- function m() {
41
- return /* @__PURE__ */ d("div", {
42
- className: "flex items-center justify-between",
43
- children: /* @__PURE__ */ f("div", {
44
- className: "flex items-center gap-3",
45
- children: [/* @__PURE__ */ d(o, { className: "size-10 rounded-xl" }), /* @__PURE__ */ f("div", {
46
- className: "flex flex-col gap-1",
47
- children: [/* @__PURE__ */ d(o, { className: "h-4 w-24 rounded-lg" }), /* @__PURE__ */ d(o, { className: "h-3 w-20 rounded-lg" })]
48
- })]
49
- })
50
- });
51
- }
52
- //#endregion
53
- export { p as Passkeys };
@@ -1,25 +0,0 @@
1
- import { ActiveSessions as e } from "./active-sessions.js";
2
- import { ChangePassword as t } from "./change-password.js";
3
- import { DangerZone as n } from "./danger-zone.js";
4
- import { LinkedAccounts as r } from "./linked-accounts.js";
5
- import { Passkeys as i } from "./passkeys.js";
6
- import { useAuth as a } from "@better-auth-ui/react";
7
- import { cn as o } from "@heroui/react";
8
- import { jsx as s, jsxs as c } from "react/jsx-runtime";
9
- //#region src/components/settings/security/security-settings.tsx
10
- function l({ className: l, variant: u, ...d }) {
11
- let { deleteUser: f, emailAndPassword: p, passkey: m, socialProviders: h } = a();
12
- return /* @__PURE__ */ c("div", {
13
- className: o("flex w-full flex-col gap-4 md:gap-6", l),
14
- ...d,
15
- children: [
16
- p?.enabled && /* @__PURE__ */ s(t, { variant: u }),
17
- !!h?.length && /* @__PURE__ */ s(r, { variant: u }),
18
- m && /* @__PURE__ */ s(i, { variant: u }),
19
- /* @__PURE__ */ s(e, { variant: u }),
20
- f?.enabled && /* @__PURE__ */ s(n, { variant: u })
21
- ]
22
- });
23
- }
24
- //#endregion
25
- export { l as SecuritySettings };
@@ -1,45 +0,0 @@
1
- import { AccountSettings as e } from "./account/account-settings.js";
2
- import { SecuritySettings as t } from "./security/security-settings.js";
3
- import { useAuth as n, useAuthenticate as r } from "@better-auth-ui/react";
4
- import { Tabs as i, cn as a } from "@heroui/react";
5
- import { jsx as o, jsxs as s } from "react/jsx-runtime";
6
- import { useMemo as c } from "react";
7
- //#region src/components/settings/settings.tsx
8
- function l({ className: l, hideNav: u, path: d, variant: f, view: p, ...m }) {
9
- let { basePaths: h, localization: g, viewPaths: _ } = n();
10
- if (r(), !p && !d) throw Error("[Better Auth UI] Either `view` or `path` must be provided");
11
- let v = c(() => Object.fromEntries(Object.entries(_.settings).map(([e, t]) => [t, e])), [_.settings]), y = p || (d ? v[d] : void 0);
12
- return /* @__PURE__ */ s(i, {
13
- className: a(l),
14
- orientation: "horizontal",
15
- selectedKey: y,
16
- ...m,
17
- children: [
18
- /* @__PURE__ */ o(i.ListContainer, { children: /* @__PURE__ */ s(i.List, {
19
- "aria-label": g.settings.settings,
20
- className: "overflow-auto w-fit",
21
- children: [/* @__PURE__ */ s(i.Tab, {
22
- id: "account",
23
- href: `${h.settings}/${_.settings.account}`,
24
- children: [g.settings.account, /* @__PURE__ */ o(i.Indicator, {})]
25
- }), /* @__PURE__ */ s(i.Tab, {
26
- id: "security",
27
- href: `${h.settings}/${_.settings.security}`,
28
- children: [g.settings.security, /* @__PURE__ */ o(i.Indicator, {})]
29
- })]
30
- }) }),
31
- /* @__PURE__ */ o(i.Panel, {
32
- id: "account",
33
- className: "px-0",
34
- children: /* @__PURE__ */ o(e, { variant: f })
35
- }),
36
- /* @__PURE__ */ o(i.Panel, {
37
- id: "security",
38
- className: "px-0",
39
- children: /* @__PURE__ */ o(t, { variant: f })
40
- })
41
- ]
42
- });
43
- }
44
- //#endregion
45
- export { l as Settings };
@@ -1,20 +0,0 @@
1
- import { UserView as e } from "./user-view.js";
2
- import { useSetActiveSession as t } from "@better-auth-ui/react";
3
- import { Dropdown as n, Spinner as r, toast as i } from "@heroui/react";
4
- import { jsx as a, jsxs as o } from "react/jsx-runtime";
5
- //#region src/components/user/switch-account-item.tsx
6
- function s({ deviceSession: s }) {
7
- let { mutate: c, isPending: l } = t({ onError: (e) => i.danger(e.error?.message || e.message) });
8
- return /* @__PURE__ */ o(n.Item, {
9
- className: "px-2",
10
- isDisabled: l,
11
- onPress: () => c({ sessionToken: s.session.token }),
12
- children: [/* @__PURE__ */ a(e, { user: s.user }), l && /* @__PURE__ */ a(r, {
13
- color: "current",
14
- size: "sm",
15
- className: "ml-auto"
16
- })]
17
- });
18
- }
19
- //#endregion
20
- export { s as SwitchAccountItem };
@@ -1,28 +0,0 @@
1
- import { UserView as e } from "./user-view.js";
2
- import { SwitchAccountItem as t } from "./switch-account-item.js";
3
- import { useAuth as n, useListDeviceSessions as r, useSession as i } from "@better-auth-ui/react";
4
- import { Dropdown as a, Label as o, Separator as s, toast as c } from "@heroui/react";
5
- import { jsx as l, jsxs as u } from "react/jsx-runtime";
6
- import { Check as d, CirclePlus as f } from "@gravity-ui/icons";
7
- //#region src/components/user/switch-account-menu.tsx
8
- function p() {
9
- let { basePaths: p, viewPaths: m, localization: h } = n(), { data: g } = i(), { data: _, isPending: v } = r({ throwOnError: (e) => (e.error && c.danger(e.error.message), !1) });
10
- return /* @__PURE__ */ l(a.Popover, {
11
- className: "min-w-40 md:min-w-56 max-w-[48svw]",
12
- children: /* @__PURE__ */ u(a.Menu, { children: [
13
- /* @__PURE__ */ u(a.Item, {
14
- className: "px-2",
15
- children: [/* @__PURE__ */ l(e, { isPending: v }), !v && /* @__PURE__ */ l(d, { className: "ml-auto" })]
16
- }),
17
- _?.filter((e) => e.session.id !== g?.session?.id).map((e) => /* @__PURE__ */ l(t, { deviceSession: e }, e.session.id)),
18
- /* @__PURE__ */ l(s, {}),
19
- /* @__PURE__ */ u(a.Item, {
20
- textValue: h.auth.addAccount,
21
- href: `${p.auth}/${m.auth.signIn}`,
22
- children: [/* @__PURE__ */ l(f, { className: "text-muted" }), /* @__PURE__ */ l(o, { children: h.auth.addAccount })]
23
- })
24
- ] })
25
- });
26
- }
27
- //#endregion
28
- export { p as SwitchAccountMenu };
@@ -1,29 +0,0 @@
1
- import { useSession as e } from "@better-auth-ui/react";
2
- import { Avatar as t, Skeleton as n, cn as r } from "@heroui/react";
3
- import { jsx as i, jsxs as a } from "react/jsx-runtime";
4
- import { Person as o } from "@gravity-ui/icons";
5
- //#region src/components/user/user-avatar.tsx
6
- function s({ className: s, fallback: c, isPending: l, user: u, size: d = "sm", style: f, ...p }) {
7
- let { data: m, isPending: h } = e({ enabled: !u && !l });
8
- if ((l || h) && !u) return /* @__PURE__ */ i(n, {
9
- className: r("rounded-full", d === "sm" ? "size-8" : d === "md" ? "size-10" : "size-12", s),
10
- style: f
11
- });
12
- let g = u ?? m?.user, _ = (g?.username || g?.name || g?.email)?.slice(0, 2).toUpperCase();
13
- return /* @__PURE__ */ a(t, {
14
- size: d,
15
- className: r("rounded-full", s),
16
- style: f,
17
- ...p,
18
- children: [/* @__PURE__ */ i(t.Image, {
19
- alt: g?.displayUsername || g?.name || g?.email,
20
- src: g?.image ?? void 0
21
- }), /* @__PURE__ */ i(t.Fallback, {
22
- className: r(d === "lg" ? "text-xl" : d === "md" ? "text-base" : "text-sm"),
23
- delayMs: g?.image ? 600 : void 0,
24
- children: c || _ || /* @__PURE__ */ i(o, { className: "size-4" })
25
- })]
26
- });
27
- }
28
- //#endregion
29
- export { s as UserAvatar };
@@ -1,91 +0,0 @@
1
- import { UserAvatar as e } from "./user-avatar.js";
2
- import { UserView as t } from "./user-view.js";
3
- import { SwitchAccountMenu as n } from "./switch-account-menu.js";
4
- import { useAuth as r, useSession as i } from "@better-auth-ui/react";
5
- import { Button as a, Dropdown as o, Label as s, Separator as c, Tabs as l, cn as u } from "@heroui/react";
6
- import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
7
- import { ArrowRightFromSquare as m, ArrowRightToSquare as h, ChevronsExpandVertical as g, Display as _, Gear as v, Moon as y, PersonPlus as b, Persons as x, Sun as S } from "@gravity-ui/icons";
8
- //#region src/components/user/user-button.tsx
9
- function C({ className: C, placement: w = "bottom", size: T = "default", variant: E = "ghost", themeToggle: D = !0 }) {
10
- let { basePaths: O, viewPaths: k, localization: A, multiSession: j, appearance: { theme: M, setTheme: N, themes: P } } = r(), { data: F, isPending: I } = i();
11
- return /* @__PURE__ */ p(o, { children: [T === "icon" ? /* @__PURE__ */ f(o.Trigger, {
12
- className: u("rounded-full", C),
13
- children: /* @__PURE__ */ f(e, {})
14
- }) : /* @__PURE__ */ p(a, {
15
- variant: E,
16
- className: u("h-auto font-normal justify-start px-3 py-2 text-left", C),
17
- children: [F || I ? /* @__PURE__ */ f(t, { isPending: I }) : /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f(e, {}), /* @__PURE__ */ f("p", {
18
- className: "text-sm font-medium",
19
- children: A.auth.account
20
- })] }), /* @__PURE__ */ f(g, { className: "ml-auto size-3.5" })]
21
- }), /* @__PURE__ */ p(o.Popover, {
22
- placement: w,
23
- className: "min-w-40 md:min-w-56 max-w-[48svw]",
24
- children: [F && /* @__PURE__ */ f("div", {
25
- className: "px-3 pt-3 pb-1",
26
- children: /* @__PURE__ */ f(t, {})
27
- }), /* @__PURE__ */ f(o.Menu, { children: F ? /* @__PURE__ */ p(d, { children: [
28
- /* @__PURE__ */ p(o.Item, {
29
- textValue: A.settings.settings,
30
- href: `${O.settings}/${k.settings.account}`,
31
- children: [/* @__PURE__ */ f(v, { className: "text-muted" }), /* @__PURE__ */ f(s, { children: A.settings.settings })]
32
- }),
33
- j && /* @__PURE__ */ p(o.SubmenuTrigger, { children: [/* @__PURE__ */ p(o.Item, {
34
- textValue: A.auth.switchAccount,
35
- children: [
36
- /* @__PURE__ */ f(x, { className: "text-muted" }),
37
- /* @__PURE__ */ f(s, { children: A.auth.switchAccount }),
38
- /* @__PURE__ */ f(o.SubmenuIndicator, {})
39
- ]
40
- }), /* @__PURE__ */ f(o.Popover, {
41
- className: "min-w-40 md:min-w-56 max-w-[48svw]",
42
- children: /* @__PURE__ */ f(n, {})
43
- })] }),
44
- D && M && N && !!P?.length && /* @__PURE__ */ p(o.Item, {
45
- className: "py-1 pe-2",
46
- children: [/* @__PURE__ */ f(s, { children: A.settings.theme }), /* @__PURE__ */ f(l, {
47
- className: "ml-auto",
48
- selectedKey: M,
49
- onSelectionChange: (e) => N(e),
50
- children: /* @__PURE__ */ f(l.ListContainer, { children: /* @__PURE__ */ p(l.List, {
51
- "aria-label": A.settings.theme,
52
- className: "*:h-5 *:w-5 *:p-0",
53
- children: [
54
- P.includes("system") && /* @__PURE__ */ p(l.Tab, {
55
- id: "system",
56
- "aria-label": A.settings.system,
57
- children: [/* @__PURE__ */ f(_, { className: "size-3" }), /* @__PURE__ */ f(l.Indicator, {})]
58
- }),
59
- P.includes("light") && /* @__PURE__ */ p(l.Tab, {
60
- id: "light",
61
- "aria-label": A.settings.light,
62
- children: [/* @__PURE__ */ f(S, { className: "size-3" }), /* @__PURE__ */ f(l.Indicator, {})]
63
- }),
64
- P.includes("dark") && /* @__PURE__ */ p(l.Tab, {
65
- id: "dark",
66
- "aria-label": A.settings.dark,
67
- children: [/* @__PURE__ */ f(y, { className: "size-3" }), /* @__PURE__ */ f(l.Indicator, {})]
68
- })
69
- ]
70
- }) })
71
- })]
72
- }),
73
- /* @__PURE__ */ f(c, {}),
74
- /* @__PURE__ */ p(o.Item, {
75
- textValue: A.auth.signOut,
76
- href: `${O.auth}/${k.auth.signOut}`,
77
- children: [/* @__PURE__ */ f(m, { className: "text-muted" }), /* @__PURE__ */ f(s, { children: A.auth.signOut })]
78
- })
79
- ] }) : /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ p(o.Item, {
80
- textValue: A.auth.signIn,
81
- href: `${O.auth}/${k.auth.signIn}`,
82
- children: [/* @__PURE__ */ f(h, { className: "text-muted" }), /* @__PURE__ */ f(s, { children: A.auth.signIn })]
83
- }), /* @__PURE__ */ p(o.Item, {
84
- textValue: A.auth.signUp,
85
- href: `${O.auth}/${k.auth.signUp}`,
86
- children: [/* @__PURE__ */ f(b, { className: "text-muted" }), /* @__PURE__ */ f(s, { children: A.auth.signUp })]
87
- })] }) })]
88
- })] });
89
- }
90
- //#endregion
91
- export { C as UserButton };
@@ -1,37 +0,0 @@
1
- import { UserAvatar as e } from "./user-avatar.js";
2
- import { useSession as t } from "@better-auth-ui/react";
3
- import { Skeleton as n, cn as r } from "@heroui/react";
4
- import { jsx as i, jsxs as a } from "react/jsx-runtime";
5
- //#region src/components/user/user-view.tsx
6
- function o({ className: o, isPending: s, size: c = "sm", user: l, ...u }) {
7
- let { data: d, isPending: f } = t({ enabled: !l && !s }), p = l ?? d?.user;
8
- return (s || f) && !l ? /* @__PURE__ */ a("div", {
9
- className: r("flex items-center gap-2 min-w-0", o),
10
- ...u,
11
- children: [/* @__PURE__ */ i(e, {
12
- isPending: !0,
13
- size: c
14
- }), /* @__PURE__ */ a("div", {
15
- className: "flex flex-col gap-1 min-w-0",
16
- children: [/* @__PURE__ */ i(n, { className: "h-3.5 w-24 rounded-lg" }), /* @__PURE__ */ i(n, { className: "h-3 w-32 rounded-lg" })]
17
- })]
18
- }) : /* @__PURE__ */ a("div", {
19
- className: r("flex items-center gap-2 min-w-0", o),
20
- ...u,
21
- children: [/* @__PURE__ */ i(e, {
22
- user: p,
23
- size: c
24
- }), /* @__PURE__ */ a("div", {
25
- className: "min-w-0",
26
- children: [/* @__PURE__ */ i("p", {
27
- className: "text-sm font-medium truncate leading-tight",
28
- children: p?.displayUsername || p?.name || p?.email
29
- }), (p?.displayUsername || p?.name) && /* @__PURE__ */ i("p", {
30
- className: "text-muted text-xs mb-0.5 truncate overflow-x-hidden",
31
- children: p?.email
32
- })]
33
- })]
34
- });
35
- }
36
- //#endregion
37
- export { o as UserView };
package/dist/core.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from '@better-auth-ui/react/core';
package/dist/core.js DELETED
@@ -1 +0,0 @@
1
- export * from "@better-auth-ui/react/core";
@@ -1 +0,0 @@
1
- export * from '@better-auth-ui/react';
@@ -1 +0,0 @@
1
- export * from "@better-auth-ui/react";
@@ -1,43 +0,0 @@
1
- import type { AuthView } from "@better-auth-ui/core"
2
- import { useAuth } from "@better-auth-ui/react"
3
- import { Envelope, Lock } from "@gravity-ui/icons"
4
- import { cn, Link } from "@heroui/react"
5
- import { buttonVariants } from "@heroui/styles"
6
-
7
- export type MagicLinkButtonProps = {
8
- isPending: boolean
9
- view?: AuthView
10
- }
11
-
12
- /**
13
- * Renders a full-width tertiary link-style button that navigates to either the magic-link or sign-in route.
14
- *
15
- * @param isPending - If true, applies disabled styling and prevents interaction
16
- * @param view - Current auth view; when `"magicLink"`, the button targets the sign-in/password variant
17
- * @returns The rendered Link element with the appropriate href, icon, and label
18
- */
19
- export function MagicLinkButton({ isPending, view }: MagicLinkButtonProps) {
20
- const { basePaths, viewPaths, localization } = useAuth()
21
-
22
- const isMagicLinkView = view === "magicLink"
23
-
24
- return (
25
- <Link
26
- href={`${basePaths.auth}/${isMagicLinkView ? viewPaths.auth.signIn : viewPaths.auth.magicLink}`}
27
- className={cn(
28
- buttonVariants({ variant: "tertiary" }),
29
- "w-full gap-2",
30
- isPending && "status-disabled pointer-events-none"
31
- )}
32
- >
33
- {isMagicLinkView ? <Lock /> : <Envelope />}
34
-
35
- {localization.auth.continueWith.replace(
36
- "{{provider}}",
37
- isMagicLinkView
38
- ? localization.auth.password
39
- : localization.auth.magicLink
40
- )}
41
- </Link>
42
- )
43
- }
@@ -1,36 +0,0 @@
1
- import { useAuth, useSignInPasskey } from "@better-auth-ui/react"
2
- import { Fingerprint } from "@gravity-ui/icons"
3
- import { Button, Spinner, toast } from "@heroui/react"
4
-
5
- export type PasskeyButtonProps = {
6
- isPending: boolean
7
- }
8
-
9
- export function PasskeyButton({ isPending }: PasskeyButtonProps) {
10
- const { localization, redirectTo, navigate } = useAuth()
11
-
12
- const { mutate: signInPasskey, isPending: passkeyPending } = useSignInPasskey(
13
- {
14
- onError: (error) => toast.danger(error.error?.message || error.message),
15
- onSuccess: () => navigate({ to: redirectTo })
16
- }
17
- )
18
-
19
- const isDisabled = isPending || passkeyPending
20
-
21
- return (
22
- <Button
23
- className="w-full"
24
- variant="tertiary"
25
- isDisabled={isDisabled}
26
- isPending={passkeyPending}
27
- onPress={() => signInPasskey()}
28
- >
29
- {passkeyPending ? <Spinner color="current" size="sm" /> : <Fingerprint />}
30
- {localization.auth.continueWith.replace(
31
- "{{provider}}",
32
- localization.auth.passkey
33
- )}
34
- </Button>
35
- )
36
- }