@mesob/auth-react 0.3.1 → 0.3.3

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 (32) hide show
  1. package/dist/components/auth/auth-card.js +2 -1
  2. package/dist/components/auth/auth-card.js.map +1 -1
  3. package/dist/components/auth/forgot-password.js +49 -41
  4. package/dist/components/auth/forgot-password.js.map +1 -1
  5. package/dist/components/auth/reset-password-form.js +125 -108
  6. package/dist/components/auth/reset-password-form.js.map +1 -1
  7. package/dist/components/auth/sign-in.js +132 -97
  8. package/dist/components/auth/sign-in.js.map +1 -1
  9. package/dist/components/auth/sign-up.js +130 -125
  10. package/dist/components/auth/sign-up.js.map +1 -1
  11. package/dist/components/auth/verification-form.js +59 -49
  12. package/dist/components/auth/verification-form.js.map +1 -1
  13. package/dist/components/auth/verify-email.js +59 -49
  14. package/dist/components/auth/verify-email.js.map +1 -1
  15. package/dist/components/auth/verify-phone.js +59 -49
  16. package/dist/components/auth/verify-phone.js.map +1 -1
  17. package/dist/components/error-boundary.d.ts +2 -2
  18. package/dist/components/profile/change-email-form.js +59 -49
  19. package/dist/components/profile/change-email-form.js.map +1 -1
  20. package/dist/components/profile/change-phone-form.js +59 -49
  21. package/dist/components/profile/change-phone-form.js.map +1 -1
  22. package/dist/components/profile/otp-verification-modal.js +59 -49
  23. package/dist/components/profile/otp-verification-modal.js.map +1 -1
  24. package/dist/components/profile/security.js +59 -49
  25. package/dist/components/profile/security.js.map +1 -1
  26. package/dist/components/profile/verify-change-email-form.js +59 -49
  27. package/dist/components/profile/verify-change-email-form.js.map +1 -1
  28. package/dist/components/profile/verify-change-phone-form.js +59 -49
  29. package/dist/components/profile/verify-change-phone-form.js.map +1 -1
  30. package/dist/index.js +506 -430
  31. package/dist/index.js.map +1 -1
  32. package/package.json +2 -2
@@ -343,15 +343,18 @@ import {
343
343
  import { zodResolver as zodResolver2 } from "@hookform/resolvers/zod";
344
344
  import {
345
345
  Button as Button3,
346
- Field,
347
- FieldError,
348
- FieldGroup,
346
+ Form,
347
+ FormControl,
348
+ FormField,
349
+ FormItem,
350
+ FormLabel,
351
+ FormMessage,
349
352
  InputOTP,
350
353
  InputOTPGroup,
351
354
  InputOTPSlot,
352
355
  Spinner as Spinner3
353
356
  } from "@mesob/ui/components";
354
- import { Controller, useForm as useForm2 } from "react-hook-form";
357
+ import { useForm as useForm2 } from "react-hook-form";
355
358
  import { z as z2 } from "zod";
356
359
 
357
360
  // src/hooks/use-translator.ts
@@ -442,54 +445,61 @@ var VerificationForm = ({
442
445
  const handleSubmit = form.handleSubmit(async (values) => {
443
446
  await onSubmit(values);
444
447
  });
445
- return /* @__PURE__ */ jsxs3("form", { id: "verification-form", onSubmit: handleSubmit, children: [
446
- /* @__PURE__ */ jsx4(FieldGroup, { children: /* @__PURE__ */ jsx4(
447
- Controller,
448
- {
449
- name: "code",
450
- control: form.control,
451
- render: ({ field, fieldState }) => /* @__PURE__ */ jsxs3(Field, { "data-invalid": fieldState.invalid, children: [
452
- /* @__PURE__ */ jsx4("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx4(
453
- InputOTP,
448
+ return /* @__PURE__ */ jsx4(Form, { ...form, children: /* @__PURE__ */ jsxs3(
449
+ "form",
450
+ {
451
+ id: "verification-form",
452
+ onSubmit: handleSubmit,
453
+ className: "space-y-4",
454
+ children: [
455
+ /* @__PURE__ */ jsx4(
456
+ FormField,
457
+ {
458
+ control: form.control,
459
+ name: "code",
460
+ render: ({ field }) => /* @__PURE__ */ jsxs3(FormItem, { children: [
461
+ /* @__PURE__ */ jsx4("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx4(FormLabel, { children: t("form.codeLabel") }) }),
462
+ /* @__PURE__ */ jsx4(FormControl, { children: /* @__PURE__ */ jsx4(
463
+ InputOTP,
464
+ {
465
+ maxLength: 6,
466
+ required: true,
467
+ value: field.value ?? "",
468
+ onChange: field.onChange,
469
+ onBlur: field.onBlur,
470
+ containerClassName: "gap-4 justify-center mb-2 flex items-center",
471
+ children: /* @__PURE__ */ jsxs3(InputOTPGroup, { className: "gap-3 *:data-[slot=input-otp-slot]:h-12 *:data-[slot=input-otp-slot]:w-12 *:data-[slot=input-otp-slot]:rounded-md *:data-[slot=input-otp-slot]:border *:data-[slot=input-otp-slot]:text-xl", children: [
472
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 0 }),
473
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 1 }),
474
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 2 }),
475
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 3 }),
476
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 4 }),
477
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 5 })
478
+ ] })
479
+ }
480
+ ) }),
481
+ /* @__PURE__ */ jsx4(FormMessage, {})
482
+ ] })
483
+ }
484
+ ),
485
+ /* @__PURE__ */ jsxs3("div", { className: "flex justify-between items-center", children: [
486
+ /* @__PURE__ */ jsx4(Countdown, { onResend, resending: isLoading }),
487
+ /* @__PURE__ */ jsxs3(
488
+ Button3,
454
489
  {
455
- maxLength: 6,
456
- id: "otp",
457
- required: true,
458
- value: field.value ?? "",
459
- onChange: field.onChange,
460
- onBlur: field.onBlur,
461
- containerClassName: "gap-4 justify-center mb-2 flex items-center",
462
- "aria-invalid": fieldState.invalid,
463
- children: /* @__PURE__ */ jsxs3(InputOTPGroup, { className: "gap-3 *:data-[slot=input-otp-slot]:h-12 *:data-[slot=input-otp-slot]:w-12 *:data-[slot=input-otp-slot]:rounded-md *:data-[slot=input-otp-slot]:border *:data-[slot=input-otp-slot]:text-xl", children: [
464
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 0 }),
465
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 1 }),
466
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 2 }),
467
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 3 }),
468
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 4 }),
469
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 5 })
470
- ] })
490
+ type: "submit",
491
+ form: "verification-form",
492
+ disabled: isLoading || form.watch("code").length !== 6,
493
+ children: [
494
+ isLoading && /* @__PURE__ */ jsx4(Spinner3, {}),
495
+ t("form.confirm")
496
+ ]
471
497
  }
472
- ) }),
473
- fieldState.invalid && /* @__PURE__ */ jsx4(FieldError, { errors: [fieldState.error] })
498
+ )
474
499
  ] })
475
- }
476
- ) }),
477
- /* @__PURE__ */ jsxs3("div", { className: "flex justify-between items-center mt-4", children: [
478
- /* @__PURE__ */ jsx4(Countdown, { onResend, resending: isLoading }),
479
- /* @__PURE__ */ jsxs3(
480
- Button3,
481
- {
482
- type: "submit",
483
- form: "verification-form",
484
- disabled: isLoading || form.watch("code").length !== 6,
485
- children: [
486
- isLoading && /* @__PURE__ */ jsx4(Spinner3, {}),
487
- t("form.confirm")
488
- ]
489
- }
490
- )
491
- ] })
492
- ] });
500
+ ]
501
+ }
502
+ ) });
493
503
  };
494
504
 
495
505
  // src/components/profile/otp-verification-modal.tsx
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/profile/change-email-form.tsx","../../../src/provider.tsx","../../../src/lib/translations.ts","../../../src/utils/cookie.ts","../../../src/components/profile/request-change-email-form.tsx","../../../src/components/profile/verify-change-email-form.tsx","../../../src/components/profile/otp-verification-modal.tsx","../../../src/components/auth/verification-form.tsx","../../../src/hooks/use-translator.ts","../../../src/components/auth/countdown.tsx"],"sourcesContent":["'use client';\n\nimport {\n Button,\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@mesob/ui/components';\nimport { IconChevronDown } from '@tabler/icons-react';\nimport { useState } from 'react';\nimport { useSession } from '../../provider';\nimport { RequestChangeEmailForm } from './request-change-email-form';\nimport { VerifyChangeEmailForm } from './verify-change-email-form';\n\nexport function ChangeEmailForm() {\n const { user } = useSession();\n const [isOpen, setIsOpen] = useState(false);\n const [showOtp, setShowOtp] = useState(false);\n const [verificationId, setVerificationId] = useState<string | null>(null);\n const [newEmail, setNewEmail] = useState<string>('');\n\n const resetForms = () => {\n setShowOtp(false);\n setVerificationId(null);\n setNewEmail('');\n };\n\n const handleRequestSuccess = (id: string, email: string) => {\n setVerificationId(id);\n setNewEmail(email);\n setShowOtp(true);\n };\n\n const handleVerifySuccess = () => {\n resetForms();\n setIsOpen(false);\n };\n\n const handleCancel = () => {\n resetForms();\n setIsOpen(false);\n };\n\n const title = user?.email ? 'Change Email' : 'Add Email';\n const description = user?.email\n ? 'Update your email address'\n : 'Add an email address to your account';\n return (\n <Collapsible open={isOpen} onOpenChange={setIsOpen}>\n <div className=\"border rounded-lg\">\n <CollapsibleTrigger\n render={\n <Button\n variant=\"ghost\"\n className=\"w-full justify-between p-4 h-auto\"\n />\n }\n >\n <div className=\"flex flex-col items-start\">\n <span className=\"font-medium\">{title}</span>\n <span className=\"text-sm text-muted-foreground\">{description}</span>\n </div>\n <IconChevronDown\n className={`h-4 w-4 transition-transform ${\n isOpen ? 'rotate-180' : ''\n }`}\n />\n </CollapsibleTrigger>\n\n <CollapsibleContent>\n {showOtp ? (\n <VerifyChangeEmailForm\n email={newEmail}\n verificationId={verificationId}\n onSuccess={handleVerifySuccess}\n onCancel={handleCancel}\n />\n ) : (\n <RequestChangeEmailForm\n onSuccess={handleRequestSuccess}\n onCancel={handleCancel}\n buttonText={title}\n />\n )}\n </CollapsibleContent>\n </div>\n </Collapsible>\n );\n}\n","'use client';\n\nimport { QueryClient, QueryClientProvider } from '@tanstack/react-query';\nimport { deepmerge } from 'deepmerge-ts';\nimport createFetchClient from 'openapi-fetch';\nimport createClient from 'openapi-react-query';\nimport type { ReactNode } from 'react';\nimport { createContext, useContext, useMemo, useState } from 'react';\nimport type { paths } from './data/openapi';\nimport { createTranslator } from './lib/translations';\nimport {\n type AuthClientConfig,\n type AuthResponse,\n defaultAuthClientConfig,\n type Session,\n type User,\n} from './types';\nimport { getSessionCookieName } from './utils/cookie';\nimport { createCustomFetch } from './utils/custom-fetch';\n\n// biome-ignore lint/suspicious/noExplicitAny: OpenAPI hooks type\ntype OpenApiHooks = any;\n\n// --- Utility: Check if running on server ---\nfunction isServer(): boolean {\n return typeof document === 'undefined';\n}\n\n/**\n * @deprecated Cookie is httpOnly and cannot be read client-side.\n * Use `useSession().isAuthenticated` instead.\n * This function always returns false on client.\n */\nexport function hasAuthCookie(_cookieName: string): boolean {\n // Cookie is httpOnly, can't check client-side\n // Always return false - use useSession() for auth status\n return false;\n}\n\n// --- Types ---\nexport type AuthStatus = 'loading' | 'authenticated' | 'unauthenticated';\n\ntype AuthState = {\n user: User | null;\n session: Session | null;\n status: AuthStatus;\n error: Error | null;\n};\n\ntype SessionContextValue = AuthState & {\n isLoading: boolean;\n isAuthenticated: boolean;\n refresh: () => Promise<void>;\n signOut: () => Promise<void>;\n};\n\ntype ApiContextValue = {\n hooks: OpenApiHooks;\n setAuth: (auth: AuthResponse) => void;\n clearAuth: () => void;\n refresh: () => Promise<void>;\n};\n\ntype ConfigContextValue = {\n config: AuthClientConfig;\n cookieName: string;\n t: (key: string, params?: Record<string, string | number>) => string;\n};\n\nconst SessionContext = createContext<SessionContextValue | null>(null);\nconst ApiContext = createContext<ApiContextValue | null>(null);\nconst ConfigContext = createContext<ConfigContextValue | null>(null);\n\nconst queryClient = new QueryClient({\n defaultOptions: {\n queries: {\n refetchOnWindowFocus: false,\n },\n },\n});\n\n// --- Hooks ---\n\n/**\n * Get session state including user, session, and auth status.\n * - `status`: 'loading' | 'authenticated' | 'unauthenticated'\n * - `isLoading`: true while fetching session\n * - `isAuthenticated`: true if user and session exist\n */\nexport function useSession(): SessionContextValue {\n const context = useContext(SessionContext);\n if (!context) {\n throw new Error('useSession must be used within MesobAuthProvider');\n }\n return context;\n}\n\nexport function useApi(): ApiContextValue {\n const context = useContext(ApiContext);\n if (!context) {\n throw new Error('useApi must be used within MesobAuthProvider');\n }\n return context;\n}\n\nexport function useConfig(): ConfigContextValue {\n const context = useContext(ConfigContext);\n if (!context) {\n throw new Error('useConfig must be used within MesobAuthProvider');\n }\n return context;\n}\n\n/**\n * @deprecated Cookie is httpOnly, can't be checked client-side.\n * Use `useSession().isAuthenticated` instead.\n */\nexport function useHasAuthCookie(): boolean {\n const { status } = useSession();\n return status === 'authenticated' || status === 'loading';\n}\n\n// --- Provider ---\n\ntype MesobAuthProviderProps = {\n config: AuthClientConfig;\n children: ReactNode;\n};\n\nexport function MesobAuthProvider({\n config,\n children,\n}: MesobAuthProviderProps) {\n const mergedConfig = useMemo(\n () =>\n deepmerge(\n { ...defaultAuthClientConfig } as Partial<AuthClientConfig>,\n config,\n ) as AuthClientConfig,\n [config],\n );\n\n const api = useMemo(\n () =>\n createFetchClient<paths>({\n baseUrl: mergedConfig.baseURL,\n fetch: createCustomFetch(mergedConfig),\n }),\n [mergedConfig],\n );\n\n const hooks = useMemo(() => createClient(api), [api]);\n const cookieName = useMemo(\n () => getSessionCookieName(mergedConfig),\n [mergedConfig],\n );\n\n return (\n <QueryClientProvider client={queryClient}>\n <AuthStateProvider\n config={mergedConfig}\n hooks={hooks}\n cookieName={cookieName}\n >\n {children}\n </AuthStateProvider>\n </QueryClientProvider>\n );\n}\n\ntype AuthStateProviderProps = {\n config: AuthClientConfig;\n hooks: OpenApiHooks;\n cookieName: string;\n children: ReactNode;\n};\n\nfunction AuthStateProvider({\n config,\n hooks,\n cookieName,\n children,\n}: AuthStateProviderProps) {\n // Manual override for sign-out / sign-in\n const [override, setOverride] = useState<AuthState | null>(null);\n\n // Always fetch session - cookie is httpOnly, can't check client-side\n // Server will read the cookie and return user/session if valid\n const {\n data: sessionData,\n isLoading,\n isFetched,\n error: sessionError,\n refetch,\n } = hooks.useQuery(\n 'get',\n '/session',\n {},\n {\n enabled: !(override || isServer()),\n refetchOnMount: false,\n refetchOnWindowFocus: false,\n refetchOnReconnect: false,\n retry: false,\n gcTime: 0,\n staleTime: 0,\n },\n );\n\n // Derive state directly - no useEffect\n const user = override?.user ?? sessionData?.user ?? null;\n const session = override?.session ?? sessionData?.session ?? null;\n const error = override?.error ?? (sessionError as Error | null);\n\n // Check error status code\n const errorStatus = (() => {\n if (!sessionError) {\n return null;\n }\n const err = sessionError as { status?: number };\n return err.status ?? null;\n })();\n\n // Check if error is a network/connection error\n const isNetworkError = (() => {\n if (!sessionError) {\n return false;\n }\n const error = sessionError as Error & { cause?: unknown; data?: unknown };\n const errorMessage =\n error.message || String(error) || JSON.stringify(error);\n // Network errors: TypeError, DOMException, or fetch failures\n if (\n error instanceof TypeError ||\n error instanceof DOMException ||\n error.name === 'TypeError' ||\n errorMessage.includes('Failed to fetch') ||\n errorMessage.includes('ERR_CONNECTION_REFUSED') ||\n errorMessage.includes('NetworkError') ||\n errorMessage.includes('Network request failed') ||\n errorMessage.includes('fetch failed')\n ) {\n return true;\n }\n // Check error cause\n if (error.cause) {\n const causeStr = String(error.cause);\n if (\n causeStr.includes('Failed to fetch') ||\n causeStr.includes('ERR_CONNECTION_REFUSED') ||\n causeStr.includes('NetworkError')\n ) {\n return true;\n }\n }\n return false;\n })();\n\n // Compute status\n // biome-ignore lint: Status determination requires multiple checks\n const status: AuthStatus = (() => {\n if (override) {\n return override.status;\n }\n if (isServer()) {\n return 'loading';\n }\n if (user && session) {\n return 'authenticated';\n }\n // Check for network errors or auth errors first - allow auth page to show\n if (isNetworkError || errorStatus === 401) {\n return 'unauthenticated';\n }\n // If we have an error but it's not a network error, still check loading state\n if (sessionError && !isNetworkError && errorStatus !== 401) {\n if (errorStatus && errorStatus >= 500) {\n return 'authenticated';\n }\n // Other errors mean unauthenticated\n if (isFetched) {\n return 'unauthenticated';\n }\n }\n if (isLoading || !isFetched) {\n return 'loading';\n }\n if (isFetched && !user && !session) {\n return 'unauthenticated';\n }\n return 'unauthenticated';\n })();\n\n const signOutMutation = hooks.useMutation('post', '/sign-out');\n const t = createTranslator(config.messages || {});\n\n const setAuth = (auth: AuthResponse) => {\n setOverride({\n user: auth.user,\n session: auth.session,\n status: 'authenticated',\n error: null,\n });\n };\n\n const clearAuth = () => {\n setOverride({\n user: null,\n session: null,\n status: 'unauthenticated',\n error: null,\n });\n };\n\n const refresh = async () => {\n setOverride(null);\n await refetch();\n };\n\n const signOut = async () => {\n try {\n await signOutMutation.mutateAsync({});\n } finally {\n clearAuth();\n }\n };\n\n return (\n <ConfigContext.Provider value={{ config, cookieName, t }}>\n <ApiContext.Provider value={{ hooks, setAuth, clearAuth, refresh }}>\n <SessionContext.Provider\n value={{\n user,\n session,\n status,\n error,\n isLoading: status === 'loading',\n isAuthenticated: status === 'authenticated',\n refresh,\n signOut,\n }}\n >\n {children}\n </SessionContext.Provider>\n </ApiContext.Provider>\n </ConfigContext.Provider>\n );\n}\n","type Messages = Record<string, unknown>;\n\nexport function createTranslator(messages: Messages, namespace?: string) {\n return (key: string, params?: Record<string, string | number>): string => {\n const fullKey = namespace ? `${namespace}.${key}` : key;\n const keys = fullKey.split('.');\n\n let value: unknown = messages;\n for (const k of keys) {\n if (value && typeof value === 'object' && value !== null) {\n value = (value as Record<string, unknown>)[k];\n } else {\n return fullKey;\n }\n }\n\n if (typeof value !== 'string') {\n return fullKey;\n }\n\n // Simple parameter replacement\n if (params) {\n return value.replace(/\\{(\\w+)\\}/g, (_, param) =>\n String(params[param] ?? `{${param}}`),\n );\n }\n\n return value;\n };\n}\n","import type { AuthClientConfig } from '../types';\n\nconst isProduction =\n typeof process !== 'undefined' && process.env.NODE_ENV === 'production';\n\nexport const getSessionCookieName = (config: AuthClientConfig): string => {\n const prefix = config.cookiePrefix || '';\n const baseName = 'session_token';\n if (prefix) {\n return `${prefix}_${baseName}`;\n }\n return isProduction ? '__Host-session_token' : baseName;\n};\n","'use client';\n\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport { Button, Input, Label, Spinner } from '@mesob/ui/components';\nimport { IconEye, IconEyeOff } from '@tabler/icons-react';\nimport { useEffect, useState } from 'react';\nimport { useForm } from 'react-hook-form';\nimport { toast } from 'sonner';\nimport { z } from 'zod';\nimport { useApi, useSession } from '../../provider';\n\nconst emailPasswordSchema = z.object({\n email: z.string().email('Invalid email address'),\n password: z\n .string()\n .min(8, 'Password must be at least 8 characters')\n .max(128, 'Password too long'),\n});\n\ntype EmailPasswordFormData = z.infer<typeof emailPasswordSchema>;\n\ntype AuthErrorLike = {\n code?: string;\n message?: string;\n name?: string;\n};\n\nfunction isAuthError(error: unknown): error is AuthErrorLike {\n return (\n typeof error === 'object' &&\n error !== null &&\n ('code' in error || 'message' in error || 'name' in error)\n );\n}\n\nfunction getErrorCode(error: AuthErrorLike): string | undefined {\n if (error.code) {\n return error.code;\n }\n if (error.message) {\n const upperMessage = error.message.toUpperCase().trim();\n const validCodes = [\n 'USER_NOT_FOUND',\n 'USER_EXISTS',\n 'INVALID_PASSWORD',\n 'VERIFICATION_EXPIRED',\n 'VERIFICATION_MISMATCH',\n 'VERIFICATION_NOT_FOUND',\n 'TOO_MANY_ATTEMPTS',\n 'UNAUTHORIZED',\n ];\n if (validCodes.includes(upperMessage)) {\n return upperMessage;\n }\n }\n return undefined;\n}\n\nfunction getErrorMessage(error: unknown): string {\n if (isAuthError(error)) {\n const errorCode = getErrorCode(error);\n switch (errorCode) {\n case 'USER_EXISTS':\n return 'This email is already taken. Please use a different email.';\n case 'VERIFICATION_EXPIRED':\n return 'Verification code has expired. Please request a new one.';\n case 'VERIFICATION_MISMATCH':\n return 'Invalid verification code. Please try again.';\n case 'VERIFICATION_NOT_FOUND':\n return 'Verification not found. Please request a new code.';\n default:\n return error.message || 'An error occurred. Please try again.';\n }\n }\n if (error instanceof Error) {\n return error.message;\n }\n return 'An error occurred. Please try again.';\n}\n\ninterface RequestChangeEmailFormProps {\n onSuccess: (verificationId: string, email: string) => void;\n onCancel: () => void;\n buttonText: string;\n}\n\nexport function RequestChangeEmailForm({\n onSuccess,\n onCancel,\n buttonText,\n}: RequestChangeEmailFormProps) {\n const { user } = useSession();\n const { hooks } = useApi();\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [isChecking, setIsChecking] = useState(true);\n const [showPassword, setShowPassword] = useState(false);\n\n const getPendingAccountChangeQuery = hooks.useQuery(\n 'get',\n '/account-change/pending',\n {},\n { enabled: false },\n );\n const verifyPasswordMutation = hooks.useMutation('post', '/password/verify');\n const checkUserMutation = hooks.useMutation('post', '/check-account');\n const requestEmailVerificationMutation = hooks.useMutation(\n 'post',\n '/email/verification/request',\n );\n\n const emailPasswordForm = useForm<EmailPasswordFormData>({\n resolver: zodResolver(emailPasswordSchema),\n defaultValues: {\n email: '',\n password: '',\n },\n });\n\n const {\n register,\n handleSubmit,\n getValues,\n setValue,\n formState: { errors },\n } = emailPasswordForm;\n\n useEffect(() => {\n let active = true;\n const run = async () => {\n try {\n const data = await getPendingAccountChangeQuery.refetch();\n if (!active) {\n return;\n }\n const accountChange = data.data?.accountChange;\n const verificationId = data.data?.verificationId;\n if (accountChange?.changeType !== 'email') {\n setIsChecking(false);\n return;\n }\n if (!accountChange.newEmail) {\n setIsChecking(false);\n return;\n }\n if (getValues('email')) {\n setIsChecking(false);\n return;\n }\n setValue('email', accountChange.newEmail, { shouldValidate: true });\n\n if (verificationId) {\n toast.message('Resuming verification…');\n onSuccess(verificationId, accountChange.newEmail);\n return;\n }\n\n setIsChecking(false);\n } catch {\n setIsChecking(false);\n }\n };\n run().catch(() => undefined);\n return () => {\n active = false;\n };\n }, [getPendingAccountChangeQuery.refetch, getValues, onSuccess, setValue]);\n\n const onEmailPasswordSubmit = async (data: EmailPasswordFormData) => {\n if (!user) {\n toast.error('User not found');\n return;\n }\n\n try {\n setIsSubmitting(true);\n\n // Verify password first\n await verifyPasswordMutation.mutateAsync({\n body: { password: data.password },\n });\n\n // Check if email exists\n const checkResult = await checkUserMutation.mutateAsync({\n body: { identifier: data.email },\n });\n if (checkResult.data?.exists) {\n // Check if it belongs to current user\n if (user?.email?.toLowerCase() === data.email.toLowerCase()) {\n toast.error('This is already your current email address.');\n return;\n }\n toast.error(\n 'This email is already taken. Please use a different email.',\n );\n return;\n }\n\n // Request verification\n const verification = await requestEmailVerificationMutation.mutateAsync({\n body: { email: data.email },\n });\n\n toast.success('Verification code sent to your email');\n onSuccess(verification.data?.verificationId ?? '', data.email);\n } catch (error) {\n const errorMessage = getErrorMessage(error);\n if (isAuthError(error)) {\n const errorCode = getErrorCode(error);\n if (\n errorCode === 'INVALID_PASSWORD' ||\n errorCode === 'USER_NOT_FOUND'\n ) {\n toast.error('Incorrect password. Please try again.');\n return;\n }\n }\n toast.error(errorMessage);\n } finally {\n setIsSubmitting(false);\n }\n };\n\n const isLoading = isSubmitting || isChecking;\n\n return (\n <form\n onSubmit={handleSubmit(onEmailPasswordSubmit)}\n className=\"p-4 space-y-4 border-t\"\n >\n <div className=\"space-y-4 w-full md:w-1/2\">\n <div className=\"space-y-2\">\n <Label htmlFor=\"email\">New Email Address</Label>\n <Input\n id=\"email\"\n type=\"email\"\n placeholder=\"Enter your new email\"\n {...register('email')}\n disabled={isLoading}\n />\n {errors.email && (\n <p className=\"text-sm text-destructive\">{errors.email.message}</p>\n )}\n </div>\n <div className=\"space-y-2\">\n <Label htmlFor=\"password\">Password</Label>\n <div className=\"relative\">\n <Input\n id=\"password\"\n type={showPassword ? 'text' : 'password'}\n autoComplete=\"current-password\"\n placeholder=\"Enter your password\"\n {...register('password')}\n disabled={isLoading}\n />\n <button\n type=\"button\"\n onClick={() => setShowPassword(!showPassword)}\n className=\"absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground\"\n disabled={isLoading}\n >\n {showPassword ? (\n <IconEyeOff className=\"h-4 w-4\" />\n ) : (\n <IconEye className=\"h-4 w-4\" />\n )}\n </button>\n </div>\n {errors.password && (\n <p className=\"text-sm text-destructive\">\n {errors.password.message}\n </p>\n )}\n </div>\n </div>\n\n <div className=\"flex justify-end gap-2\">\n <Button\n type=\"button\"\n variant=\"outline\"\n onClick={onCancel}\n disabled={isLoading}\n >\n Cancel\n </Button>\n <Button type=\"submit\" disabled={isLoading}>\n {isLoading && <Spinner className=\"mr-2 h-4 w-4\" />}\n {isChecking ? 'Checking…' : buttonText}\n </Button>\n </div>\n </form>\n );\n}\n","'use client';\n\nimport { useState } from 'react';\nimport { toast } from 'sonner';\nimport { useApi, useSession } from '../../provider';\nimport { OtpVerificationModal } from './otp-verification-modal';\n\ntype AuthErrorLike = {\n code?: string;\n message?: string;\n name?: string;\n};\n\nfunction isAuthError(error: unknown): error is AuthErrorLike {\n return (\n typeof error === 'object' &&\n error !== null &&\n ('code' in error || 'message' in error || 'name' in error)\n );\n}\n\nfunction getErrorCode(error: AuthErrorLike): string | undefined {\n if (error.code) {\n return error.code;\n }\n if (error.message) {\n const upperMessage = error.message.toUpperCase().trim();\n const validCodes = [\n 'USER_NOT_FOUND',\n 'USER_EXISTS',\n 'INVALID_PASSWORD',\n 'VERIFICATION_EXPIRED',\n 'VERIFICATION_MISMATCH',\n 'VERIFICATION_NOT_FOUND',\n 'TOO_MANY_ATTEMPTS',\n 'UNAUTHORIZED',\n ];\n if (validCodes.includes(upperMessage)) {\n return upperMessage;\n }\n }\n return undefined;\n}\n\nfunction getErrorMessage(error: unknown): string {\n if (isAuthError(error)) {\n const errorCode = getErrorCode(error);\n switch (errorCode) {\n case 'USER_EXISTS':\n return 'This email is already taken. Please use a different email.';\n case 'VERIFICATION_EXPIRED':\n return 'Verification code has expired. Please request a new one.';\n case 'VERIFICATION_MISMATCH':\n return 'Invalid verification code. Please try again.';\n case 'VERIFICATION_NOT_FOUND':\n return 'Verification not found. Please request a new code.';\n default:\n return error.message || 'An error occurred. Please try again.';\n }\n }\n if (error instanceof Error) {\n return error.message;\n }\n return 'An error occurred. Please try again.';\n}\n\ntype VerifyChangeEmailFormProps = {\n email: string;\n verificationId: string | null;\n onSuccess: () => void;\n onCancel: () => void;\n};\n\nexport function VerifyChangeEmailForm({\n email,\n verificationId,\n onSuccess,\n onCancel,\n}: VerifyChangeEmailFormProps) {\n const { refresh } = useSession();\n const { hooks } = useApi();\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [currentVerificationId, setCurrentVerificationId] =\n useState(verificationId);\n\n const verifyEmailMutation = hooks.useMutation(\n 'post',\n '/email/verification/confirm',\n );\n const updateEmailMutation = hooks.useMutation('put', '/profile/email');\n const requestEmailVerificationMutation = hooks.useMutation(\n 'post',\n '/email/verification/request',\n );\n\n const onOtpSubmit = async (code: string) => {\n if (!currentVerificationId) {\n toast.error('Verification not found. Please request a new code.');\n return;\n }\n try {\n setIsSubmitting(true);\n\n // Verify email\n await verifyEmailMutation.mutateAsync({\n body: {\n verificationId: currentVerificationId,\n code,\n },\n });\n\n // Update email via auth client\n await updateEmailMutation.mutateAsync({\n body: { email },\n });\n\n toast.success('Email updated successfully');\n await refresh();\n onSuccess();\n } catch (error) {\n const errorMessage = getErrorMessage(error);\n toast.error(errorMessage);\n } finally {\n setIsSubmitting(false);\n }\n };\n\n if (!currentVerificationId) {\n toast.error('Verification not found. Please request a new code.');\n return null;\n }\n\n return (\n <OtpVerificationModal\n open\n title=\"Verify email\"\n description={`Enter the verification code sent to ${email}`}\n verificationId={currentVerificationId}\n isLoading={isSubmitting}\n onSubmit={onOtpSubmit}\n onResend={async () => {\n try {\n setIsSubmitting(true);\n const next = await requestEmailVerificationMutation.mutateAsync({\n body: { email },\n });\n setCurrentVerificationId(next.data?.verificationId ?? null);\n toast.success('Verification code resent');\n } catch (error) {\n toast.error(getErrorMessage(error));\n } finally {\n setIsSubmitting(false);\n }\n }}\n onCancel={onCancel}\n />\n );\n}\n","'use client';\n\nimport {\n Dialog,\n DialogContent,\n DialogDescription,\n DialogHeader,\n DialogTitle,\n} from '@mesob/ui/components';\nimport { VerificationForm } from '../auth/verification-form';\n\ntype OtpVerificationModalProps = {\n open: boolean;\n title: string;\n description?: string;\n verificationId: string;\n isLoading?: boolean;\n onSubmit: (code: string) => Promise<void> | void;\n onResend?: () => Promise<void> | void;\n onCancel?: () => void;\n};\n\nexport function OtpVerificationModal({\n open,\n title,\n description,\n verificationId,\n isLoading,\n onSubmit,\n onResend,\n onCancel,\n}: OtpVerificationModalProps) {\n return (\n <Dialog\n open={open}\n onOpenChange={(nextOpen: boolean) => {\n if (!nextOpen) {\n onCancel?.();\n }\n }}\n >\n <DialogContent>\n <DialogHeader>\n <DialogTitle>{title}</DialogTitle>\n {description && <DialogDescription>{description}</DialogDescription>}\n </DialogHeader>\n\n <VerificationForm\n verificationId={verificationId}\n isLoading={isLoading}\n onSubmit={async ({ code }: { code: string }) => onSubmit(code)}\n onResend={onResend ?? (() => undefined)}\n />\n </DialogContent>\n </Dialog>\n );\n}\n","'use client';\n\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport {\n Button,\n Field,\n FieldError,\n FieldGroup,\n InputOTP,\n InputOTPGroup,\n InputOTPSlot,\n Spinner,\n} from '@mesob/ui/components';\nimport { Controller, useForm } from 'react-hook-form';\nimport { z } from 'zod';\nimport { useTranslator } from '../../hooks/use-translator';\nimport type { AuthErrorContent } from '../../utils/handle-error';\nimport { Countdown } from './countdown';\n\ntype VerificationFormValues = {\n code: string;\n};\n\ntype VerificationFormProps = {\n verificationId: string;\n onSubmit: (values: VerificationFormValues) => Promise<void> | void;\n onResend: () => Promise<void> | void;\n isLoading?: boolean;\n error?: AuthErrorContent | string | null;\n};\n\nconst verificationSchema = (t: (key: string) => string) =>\n z.object({\n code: z.string().length(6, t('form.codeLength')),\n });\n\nexport const VerificationForm = ({\n onSubmit,\n onResend,\n isLoading = false,\n}: VerificationFormProps) => {\n const t = useTranslator('Auth.verification');\n const form = useForm<VerificationFormValues>({\n resolver: zodResolver(verificationSchema(t)),\n defaultValues: {\n code: '',\n },\n });\n\n const handleSubmit = form.handleSubmit(async (values) => {\n await onSubmit(values);\n });\n\n return (\n <form id=\"verification-form\" onSubmit={handleSubmit}>\n <FieldGroup>\n <Controller\n name=\"code\"\n control={form.control}\n render={({ field, fieldState }) => (\n <Field data-invalid={fieldState.invalid}>\n <div className=\"flex justify-center\">\n <InputOTP\n maxLength={6}\n id=\"otp\"\n required\n value={field.value ?? ''}\n onChange={field.onChange}\n onBlur={field.onBlur}\n containerClassName=\"gap-4 justify-center mb-2 flex items-center\"\n aria-invalid={fieldState.invalid}\n >\n <InputOTPGroup className=\"gap-3 *:data-[slot=input-otp-slot]:h-12 *:data-[slot=input-otp-slot]:w-12 *:data-[slot=input-otp-slot]:rounded-md *:data-[slot=input-otp-slot]:border *:data-[slot=input-otp-slot]:text-xl\">\n <InputOTPSlot className=\"h-12\" index={0} />\n <InputOTPSlot className=\"h-12\" index={1} />\n <InputOTPSlot className=\"h-12\" index={2} />\n <InputOTPSlot className=\"h-12\" index={3} />\n <InputOTPSlot className=\"h-12\" index={4} />\n <InputOTPSlot className=\"h-12\" index={5} />\n </InputOTPGroup>\n </InputOTP>\n </div>\n {fieldState.invalid && <FieldError errors={[fieldState.error]} />}\n </Field>\n )}\n />\n </FieldGroup>\n <div className=\"flex justify-between items-center mt-4\">\n <Countdown onResend={onResend} resending={isLoading} />\n <Button\n type=\"submit\"\n form=\"verification-form\"\n disabled={isLoading || form.watch('code').length !== 6}\n >\n {isLoading && <Spinner />}\n {t('form.confirm')}\n </Button>\n </div>\n </form>\n );\n};\n","import { useMesob } from '@mesob/ui/providers';\nimport { createTranslator } from '../lib/translations';\nimport { useConfig } from '../provider';\n\nexport function useTranslator(namespace?: string) {\n const mesob = useMesob();\n const { config } = useConfig();\n\n if (mesob?.t) {\n return (key: string, params?: Record<string, string | number>): string => {\n const fullKey = namespace ? `${namespace}.${key}` : key;\n return mesob.t?.(fullKey, params) ?? fullKey;\n };\n }\n\n return createTranslator(config.messages || {}, namespace);\n}\n","'use client';\n\nimport { Button, Spinner } from '@mesob/ui/components';\nimport { useEffect, useState } from 'react';\nimport { useTranslator } from '../../hooks/use-translator';\n\ntype CountdownProps = {\n initialSeconds?: number;\n onResend: () => Promise<void> | void;\n resending?: boolean;\n};\n\nexport const Countdown = ({\n initialSeconds = 60,\n onResend,\n resending = false,\n}: CountdownProps) => {\n const t = useTranslator('Common');\n const [seconds, setSeconds] = useState(initialSeconds);\n const [isResending, setIsResending] = useState(false);\n\n useEffect(() => {\n if (seconds <= 0) {\n return;\n }\n\n const timer = setInterval(() => {\n setSeconds((prev) => {\n if (prev <= 1) {\n clearInterval(timer);\n return 0;\n }\n return prev - 1;\n });\n }, 1000);\n\n return () => clearInterval(timer);\n }, [seconds]);\n\n const handleResend = async () => {\n setIsResending(true);\n try {\n await onResend();\n setSeconds(initialSeconds);\n } catch (_error) {\n // Error handling is done by parent\n } finally {\n setIsResending(false);\n }\n };\n\n if (seconds > 0) {\n return (\n <Button variant=\"ghost\" disabled>\n {t('resendIn', { seconds })}\n </Button>\n );\n }\n\n return (\n <Button\n variant=\"ghost\"\n onClick={handleResend}\n disabled={isResending || resending}\n >\n {isResending || (resending && <Spinner />)}\n {t('resend')}\n </Button>\n );\n};\n"],"mappings":";;;AAEA;AAAA,EACE,UAAAA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB;AAChC,SAAS,YAAAC,iBAAgB;;;ACPzB,SAAS,aAAa,2BAA2B;AACjD,SAAS,iBAAiB;AAC1B,OAAO,uBAAuB;AAC9B,OAAO,kBAAkB;AAEzB,SAAS,eAAe,YAAY,SAAS,gBAAgB;;;ACLtD,SAAS,iBAAiB,UAAoB,WAAoB;AACvE,SAAO,CAAC,KAAa,WAAqD;AACxE,UAAM,UAAU,YAAY,GAAG,SAAS,IAAI,GAAG,KAAK;AACpD,UAAM,OAAO,QAAQ,MAAM,GAAG;AAE9B,QAAI,QAAiB;AACrB,eAAW,KAAK,MAAM;AACpB,UAAI,SAAS,OAAO,UAAU,YAAY,UAAU,MAAM;AACxD,gBAAS,MAAkC,CAAC;AAAA,MAC9C,OAAO;AACL,eAAO;AAAA,MACT;AAAA,IACF;AAEA,QAAI,OAAO,UAAU,UAAU;AAC7B,aAAO;AAAA,IACT;AAGA,QAAI,QAAQ;AACV,aAAO,MAAM;AAAA,QAAQ;AAAA,QAAc,CAAC,GAAG,UACrC,OAAO,OAAO,KAAK,KAAK,IAAI,KAAK,GAAG;AAAA,MACtC;AAAA,IACF;AAEA,WAAO;AAAA,EACT;AACF;;;AC3BA,IAAM,eACJ,OAAO,YAAY,eAAe,QAAQ,IAAI,aAAa;;;AF4JvD;AA1FN,IAAM,iBAAiB,cAA0C,IAAI;AACrE,IAAM,aAAa,cAAsC,IAAI;AAC7D,IAAM,gBAAgB,cAAyC,IAAI;AAEnE,IAAM,cAAc,IAAI,YAAY;AAAA,EAClC,gBAAgB;AAAA,IACd,SAAS;AAAA,MACP,sBAAsB;AAAA,IACxB;AAAA,EACF;AACF,CAAC;AAUM,SAAS,aAAkC;AAChD,QAAM,UAAU,WAAW,cAAc;AACzC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,kDAAkD;AAAA,EACpE;AACA,SAAO;AACT;AAEO,SAAS,SAA0B;AACxC,QAAM,UAAU,WAAW,UAAU;AACrC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,8CAA8C;AAAA,EAChE;AACA,SAAO;AACT;AAEO,SAAS,YAAgC;AAC9C,QAAM,UAAU,WAAW,aAAa;AACxC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,iDAAiD;AAAA,EACnE;AACA,SAAO;AACT;;;AG7GA,SAAS,mBAAmB;AAC5B,SAAS,QAAQ,OAAO,OAAO,eAAe;AAC9C,SAAS,SAAS,kBAAkB;AACpC,SAAS,WAAW,YAAAC,iBAAgB;AACpC,SAAS,eAAe;AACxB,SAAS,aAAa;AACtB,SAAS,SAAS;AA8NV,SACE,OAAAC,MADF;AA3NR,IAAM,sBAAsB,EAAE,OAAO;AAAA,EACnC,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB;AAAA,EAC/C,UAAU,EACP,OAAO,EACP,IAAI,GAAG,wCAAwC,EAC/C,IAAI,KAAK,mBAAmB;AACjC,CAAC;AAUD,SAAS,YAAY,OAAwC;AAC3D,SACE,OAAO,UAAU,YACjB,UAAU,SACT,UAAU,SAAS,aAAa,SAAS,UAAU;AAExD;AAEA,SAAS,aAAa,OAA0C;AAC9D,MAAI,MAAM,MAAM;AACd,WAAO,MAAM;AAAA,EACf;AACA,MAAI,MAAM,SAAS;AACjB,UAAM,eAAe,MAAM,QAAQ,YAAY,EAAE,KAAK;AACtD,UAAM,aAAa;AAAA,MACjB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AACA,QAAI,WAAW,SAAS,YAAY,GAAG;AACrC,aAAO;AAAA,IACT;AAAA,EACF;AACA,SAAO;AACT;AAEA,SAAS,gBAAgB,OAAwB;AAC/C,MAAI,YAAY,KAAK,GAAG;AACtB,UAAM,YAAY,aAAa,KAAK;AACpC,YAAQ,WAAW;AAAA,MACjB,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO,MAAM,WAAW;AAAA,IAC5B;AAAA,EACF;AACA,MAAI,iBAAiB,OAAO;AAC1B,WAAO,MAAM;AAAA,EACf;AACA,SAAO;AACT;AAQO,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AACF,GAAgC;AAC9B,QAAM,EAAE,KAAK,IAAI,WAAW;AAC5B,QAAM,EAAE,MAAM,IAAI,OAAO;AACzB,QAAM,CAAC,cAAc,eAAe,IAAIC,UAAS,KAAK;AACtD,QAAM,CAAC,YAAY,aAAa,IAAIA,UAAS,IAAI;AACjD,QAAM,CAAC,cAAc,eAAe,IAAIA,UAAS,KAAK;AAEtD,QAAM,+BAA+B,MAAM;AAAA,IACzC;AAAA,IACA;AAAA,IACA,CAAC;AAAA,IACD,EAAE,SAAS,MAAM;AAAA,EACnB;AACA,QAAM,yBAAyB,MAAM,YAAY,QAAQ,kBAAkB;AAC3E,QAAM,oBAAoB,MAAM,YAAY,QAAQ,gBAAgB;AACpE,QAAM,mCAAmC,MAAM;AAAA,IAC7C;AAAA,IACA;AAAA,EACF;AAEA,QAAM,oBAAoB,QAA+B;AAAA,IACvD,UAAU,YAAY,mBAAmB;AAAA,IACzC,eAAe;AAAA,MACb,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,EACF,CAAC;AAED,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,EAAE,OAAO;AAAA,EACtB,IAAI;AAEJ,YAAU,MAAM;AACd,QAAI,SAAS;AACb,UAAM,MAAM,YAAY;AACtB,UAAI;AACF,cAAM,OAAO,MAAM,6BAA6B,QAAQ;AACxD,YAAI,CAAC,QAAQ;AACX;AAAA,QACF;AACA,cAAM,gBAAgB,KAAK,MAAM;AACjC,cAAM,iBAAiB,KAAK,MAAM;AAClC,YAAI,eAAe,eAAe,SAAS;AACzC,wBAAc,KAAK;AACnB;AAAA,QACF;AACA,YAAI,CAAC,cAAc,UAAU;AAC3B,wBAAc,KAAK;AACnB;AAAA,QACF;AACA,YAAI,UAAU,OAAO,GAAG;AACtB,wBAAc,KAAK;AACnB;AAAA,QACF;AACA,iBAAS,SAAS,cAAc,UAAU,EAAE,gBAAgB,KAAK,CAAC;AAElE,YAAI,gBAAgB;AAClB,gBAAM,QAAQ,6BAAwB;AACtC,oBAAU,gBAAgB,cAAc,QAAQ;AAChD;AAAA,QACF;AAEA,sBAAc,KAAK;AAAA,MACrB,QAAQ;AACN,sBAAc,KAAK;AAAA,MACrB;AAAA,IACF;AACA,QAAI,EAAE,MAAM,MAAM,MAAS;AAC3B,WAAO,MAAM;AACX,eAAS;AAAA,IACX;AAAA,EACF,GAAG,CAAC,6BAA6B,SAAS,WAAW,WAAW,QAAQ,CAAC;AAEzE,QAAM,wBAAwB,OAAO,SAAgC;AACnE,QAAI,CAAC,MAAM;AACT,YAAM,MAAM,gBAAgB;AAC5B;AAAA,IACF;AAEA,QAAI;AACF,sBAAgB,IAAI;AAGpB,YAAM,uBAAuB,YAAY;AAAA,QACvC,MAAM,EAAE,UAAU,KAAK,SAAS;AAAA,MAClC,CAAC;AAGD,YAAM,cAAc,MAAM,kBAAkB,YAAY;AAAA,QACtD,MAAM,EAAE,YAAY,KAAK,MAAM;AAAA,MACjC,CAAC;AACD,UAAI,YAAY,MAAM,QAAQ;AAE5B,YAAI,MAAM,OAAO,YAAY,MAAM,KAAK,MAAM,YAAY,GAAG;AAC3D,gBAAM,MAAM,6CAA6C;AACzD;AAAA,QACF;AACA,cAAM;AAAA,UACJ;AAAA,QACF;AACA;AAAA,MACF;AAGA,YAAM,eAAe,MAAM,iCAAiC,YAAY;AAAA,QACtE,MAAM,EAAE,OAAO,KAAK,MAAM;AAAA,MAC5B,CAAC;AAED,YAAM,QAAQ,sCAAsC;AACpD,gBAAU,aAAa,MAAM,kBAAkB,IAAI,KAAK,KAAK;AAAA,IAC/D,SAAS,OAAO;AACd,YAAM,eAAe,gBAAgB,KAAK;AAC1C,UAAI,YAAY,KAAK,GAAG;AACtB,cAAM,YAAY,aAAa,KAAK;AACpC,YACE,cAAc,sBACd,cAAc,kBACd;AACA,gBAAM,MAAM,uCAAuC;AACnD;AAAA,QACF;AAAA,MACF;AACA,YAAM,MAAM,YAAY;AAAA,IAC1B,UAAE;AACA,sBAAgB,KAAK;AAAA,IACvB;AAAA,EACF;AAEA,QAAM,YAAY,gBAAgB;AAElC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,aAAa,qBAAqB;AAAA,MAC5C,WAAU;AAAA,MAEV;AAAA,6BAAC,SAAI,WAAU,6BACb;AAAA,+BAAC,SAAI,WAAU,aACb;AAAA,4BAAAD,KAAC,SAAM,SAAQ,SAAQ,+BAAiB;AAAA,YACxC,gBAAAA;AAAA,cAAC;AAAA;AAAA,gBACC,IAAG;AAAA,gBACH,MAAK;AAAA,gBACL,aAAY;AAAA,gBACX,GAAG,SAAS,OAAO;AAAA,gBACpB,UAAU;AAAA;AAAA,YACZ;AAAA,YACC,OAAO,SACN,gBAAAA,KAAC,OAAE,WAAU,4BAA4B,iBAAO,MAAM,SAAQ;AAAA,aAElE;AAAA,UACA,qBAAC,SAAI,WAAU,aACb;AAAA,4BAAAA,KAAC,SAAM,SAAQ,YAAW,sBAAQ;AAAA,YAClC,qBAAC,SAAI,WAAU,YACb;AAAA,8BAAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,IAAG;AAAA,kBACH,MAAM,eAAe,SAAS;AAAA,kBAC9B,cAAa;AAAA,kBACb,aAAY;AAAA,kBACX,GAAG,SAAS,UAAU;AAAA,kBACvB,UAAU;AAAA;AAAA,cACZ;AAAA,cACA,gBAAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,MAAK;AAAA,kBACL,SAAS,MAAM,gBAAgB,CAAC,YAAY;AAAA,kBAC5C,WAAU;AAAA,kBACV,UAAU;AAAA,kBAET,yBACC,gBAAAA,KAAC,cAAW,WAAU,WAAU,IAEhC,gBAAAA,KAAC,WAAQ,WAAU,WAAU;AAAA;AAAA,cAEjC;AAAA,eACF;AAAA,YACC,OAAO,YACN,gBAAAA,KAAC,OAAE,WAAU,4BACV,iBAAO,SAAS,SACnB;AAAA,aAEJ;AAAA,WACF;AAAA,QAEA,qBAAC,SAAI,WAAU,0BACb;AAAA,0BAAAA;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,SAAQ;AAAA,cACR,SAAS;AAAA,cACT,UAAU;AAAA,cACX;AAAA;AAAA,UAED;AAAA,UACA,qBAAC,UAAO,MAAK,UAAS,UAAU,WAC7B;AAAA,yBAAa,gBAAAA,KAAC,WAAQ,WAAU,gBAAe;AAAA,YAC/C,aAAa,mBAAc;AAAA,aAC9B;AAAA,WACF;AAAA;AAAA;AAAA,EACF;AAEJ;;;ACjSA,SAAS,YAAAE,iBAAgB;AACzB,SAAS,SAAAC,cAAa;;;ACDtB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;;;ACNP,SAAS,eAAAC,oBAAmB;AAC5B;AAAA,EACE,UAAAC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAAC;AAAA,OACK;AACP,SAAS,YAAY,WAAAC,gBAAe;AACpC,SAAS,KAAAC,UAAS;;;ACdlB,SAAS,gBAAgB;AAIlB,SAAS,cAAc,WAAoB;AAChD,QAAM,QAAQ,SAAS;AACvB,QAAM,EAAE,OAAO,IAAI,UAAU;AAE7B,MAAI,OAAO,GAAG;AACZ,WAAO,CAAC,KAAa,WAAqD;AACxE,YAAM,UAAU,YAAY,GAAG,SAAS,IAAI,GAAG,KAAK;AACpD,aAAO,MAAM,IAAI,SAAS,MAAM,KAAK;AAAA,IACvC;AAAA,EACF;AAEA,SAAO,iBAAiB,OAAO,YAAY,CAAC,GAAG,SAAS;AAC1D;;;ACdA,SAAS,UAAAC,SAAQ,WAAAC,gBAAe;AAChC,SAAS,aAAAC,YAAW,YAAAC,iBAAgB;AAkD9B,gBAAAC,MAOF,QAAAC,aAPE;AAzCC,IAAM,YAAY,CAAC;AAAA,EACxB,iBAAiB;AAAA,EACjB;AAAA,EACA,YAAY;AACd,MAAsB;AACpB,QAAM,IAAI,cAAc,QAAQ;AAChC,QAAM,CAAC,SAAS,UAAU,IAAIC,UAAS,cAAc;AACrD,QAAM,CAAC,aAAa,cAAc,IAAIA,UAAS,KAAK;AAEpD,EAAAC,WAAU,MAAM;AACd,QAAI,WAAW,GAAG;AAChB;AAAA,IACF;AAEA,UAAM,QAAQ,YAAY,MAAM;AAC9B,iBAAW,CAAC,SAAS;AACnB,YAAI,QAAQ,GAAG;AACb,wBAAc,KAAK;AACnB,iBAAO;AAAA,QACT;AACA,eAAO,OAAO;AAAA,MAChB,CAAC;AAAA,IACH,GAAG,GAAI;AAEP,WAAO,MAAM,cAAc,KAAK;AAAA,EAClC,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,eAAe,YAAY;AAC/B,mBAAe,IAAI;AACnB,QAAI;AACF,YAAM,SAAS;AACf,iBAAW,cAAc;AAAA,IAC3B,SAAS,QAAQ;AAAA,IAEjB,UAAE;AACA,qBAAe,KAAK;AAAA,IACtB;AAAA,EACF;AAEA,MAAI,UAAU,GAAG;AACf,WACE,gBAAAH,KAACI,SAAA,EAAO,SAAQ,SAAQ,UAAQ,MAC7B,YAAE,YAAY,EAAE,QAAQ,CAAC,GAC5B;AAAA,EAEJ;AAEA,SACE,gBAAAH;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,SAAS;AAAA,MACT,UAAU,eAAe;AAAA,MAExB;AAAA,uBAAgB,aAAa,gBAAAJ,KAACK,UAAA,EAAQ;AAAA,QACtC,EAAE,QAAQ;AAAA;AAAA;AAAA,EACb;AAEJ;;;AFGkB,SACE,OAAAC,MADF,QAAAC,aAAA;AAzClB,IAAM,qBAAqB,CAAC,MAC1BC,GAAE,OAAO;AAAA,EACP,MAAMA,GAAE,OAAO,EAAE,OAAO,GAAG,EAAE,iBAAiB,CAAC;AACjD,CAAC;AAEI,IAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,YAAY;AACd,MAA6B;AAC3B,QAAM,IAAI,cAAc,mBAAmB;AAC3C,QAAM,OAAOC,SAAgC;AAAA,IAC3C,UAAUC,aAAY,mBAAmB,CAAC,CAAC;AAAA,IAC3C,eAAe;AAAA,MACb,MAAM;AAAA,IACR;AAAA,EACF,CAAC;AAED,QAAM,eAAe,KAAK,aAAa,OAAO,WAAW;AACvD,UAAM,SAAS,MAAM;AAAA,EACvB,CAAC;AAED,SACE,gBAAAH,MAAC,UAAK,IAAG,qBAAoB,UAAU,cACrC;AAAA,oBAAAD,KAAC,cACC,0BAAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS,KAAK;AAAA,QACd,QAAQ,CAAC,EAAE,OAAO,WAAW,MAC3B,gBAAAC,MAAC,SAAM,gBAAc,WAAW,SAC9B;AAAA,0BAAAD,KAAC,SAAI,WAAU,uBACb,0BAAAA;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,cACX,IAAG;AAAA,cACH,UAAQ;AAAA,cACR,OAAO,MAAM,SAAS;AAAA,cACtB,UAAU,MAAM;AAAA,cAChB,QAAQ,MAAM;AAAA,cACd,oBAAmB;AAAA,cACnB,gBAAc,WAAW;AAAA,cAEzB,0BAAAC,MAAC,iBAAc,WAAU,8LACvB;AAAA,gCAAAD,KAAC,gBAAa,WAAU,QAAO,OAAO,GAAG;AAAA,gBACzC,gBAAAA,KAAC,gBAAa,WAAU,QAAO,OAAO,GAAG;AAAA,gBACzC,gBAAAA,KAAC,gBAAa,WAAU,QAAO,OAAO,GAAG;AAAA,gBACzC,gBAAAA,KAAC,gBAAa,WAAU,QAAO,OAAO,GAAG;AAAA,gBACzC,gBAAAA,KAAC,gBAAa,WAAU,QAAO,OAAO,GAAG;AAAA,gBACzC,gBAAAA,KAAC,gBAAa,WAAU,QAAO,OAAO,GAAG;AAAA,iBAC3C;AAAA;AAAA,UACF,GACF;AAAA,UACC,WAAW,WAAW,gBAAAA,KAAC,cAAW,QAAQ,CAAC,WAAW,KAAK,GAAG;AAAA,WACjE;AAAA;AAAA,IAEJ,GACF;AAAA,IACA,gBAAAC,MAAC,SAAI,WAAU,0CACb;AAAA,sBAAAD,KAAC,aAAU,UAAoB,WAAW,WAAW;AAAA,MACrD,gBAAAC;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,MAAK;AAAA,UACL,UAAU,aAAa,KAAK,MAAM,MAAM,EAAE,WAAW;AAAA,UAEpD;AAAA,yBAAa,gBAAAL,KAACM,UAAA,EAAQ;AAAA,YACtB,EAAE,cAAc;AAAA;AAAA;AAAA,MACnB;AAAA,OACF;AAAA,KACF;AAEJ;;;AD1DQ,SACE,OAAAC,MADF,QAAAC,aAAA;AApBD,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAC5B,SACE,gBAAAD;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,cAAc,CAAC,aAAsB;AACnC,YAAI,CAAC,UAAU;AACb,qBAAW;AAAA,QACb;AAAA,MACF;AAAA,MAEA,0BAAAC,MAAC,iBACC;AAAA,wBAAAA,MAAC,gBACC;AAAA,0BAAAD,KAAC,eAAa,iBAAM;AAAA,UACnB,eAAe,gBAAAA,KAAC,qBAAmB,uBAAY;AAAA,WAClD;AAAA,QAEA,gBAAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,UAAU,OAAO,EAAE,KAAK,MAAwB,SAAS,IAAI;AAAA,YAC7D,UAAU,aAAa,MAAM;AAAA;AAAA,QAC/B;AAAA,SACF;AAAA;AAAA,EACF;AAEJ;;;AD6EI,gBAAAE,YAAA;AAxHJ,SAASC,aAAY,OAAwC;AAC3D,SACE,OAAO,UAAU,YACjB,UAAU,SACT,UAAU,SAAS,aAAa,SAAS,UAAU;AAExD;AAEA,SAASC,cAAa,OAA0C;AAC9D,MAAI,MAAM,MAAM;AACd,WAAO,MAAM;AAAA,EACf;AACA,MAAI,MAAM,SAAS;AACjB,UAAM,eAAe,MAAM,QAAQ,YAAY,EAAE,KAAK;AACtD,UAAM,aAAa;AAAA,MACjB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AACA,QAAI,WAAW,SAAS,YAAY,GAAG;AACrC,aAAO;AAAA,IACT;AAAA,EACF;AACA,SAAO;AACT;AAEA,SAASC,iBAAgB,OAAwB;AAC/C,MAAIF,aAAY,KAAK,GAAG;AACtB,UAAM,YAAYC,cAAa,KAAK;AACpC,YAAQ,WAAW;AAAA,MACjB,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO,MAAM,WAAW;AAAA,IAC5B;AAAA,EACF;AACA,MAAI,iBAAiB,OAAO;AAC1B,WAAO,MAAM;AAAA,EACf;AACA,SAAO;AACT;AASO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA+B;AAC7B,QAAM,EAAE,QAAQ,IAAI,WAAW;AAC/B,QAAM,EAAE,MAAM,IAAI,OAAO;AACzB,QAAM,CAAC,cAAc,eAAe,IAAIE,UAAS,KAAK;AACtD,QAAM,CAAC,uBAAuB,wBAAwB,IACpDA,UAAS,cAAc;AAEzB,QAAM,sBAAsB,MAAM;AAAA,IAChC;AAAA,IACA;AAAA,EACF;AACA,QAAM,sBAAsB,MAAM,YAAY,OAAO,gBAAgB;AACrE,QAAM,mCAAmC,MAAM;AAAA,IAC7C;AAAA,IACA;AAAA,EACF;AAEA,QAAM,cAAc,OAAO,SAAiB;AAC1C,QAAI,CAAC,uBAAuB;AAC1B,MAAAC,OAAM,MAAM,oDAAoD;AAChE;AAAA,IACF;AACA,QAAI;AACF,sBAAgB,IAAI;AAGpB,YAAM,oBAAoB,YAAY;AAAA,QACpC,MAAM;AAAA,UACJ,gBAAgB;AAAA,UAChB;AAAA,QACF;AAAA,MACF,CAAC;AAGD,YAAM,oBAAoB,YAAY;AAAA,QACpC,MAAM,EAAE,MAAM;AAAA,MAChB,CAAC;AAED,MAAAA,OAAM,QAAQ,4BAA4B;AAC1C,YAAM,QAAQ;AACd,gBAAU;AAAA,IACZ,SAAS,OAAO;AACd,YAAM,eAAeF,iBAAgB,KAAK;AAC1C,MAAAE,OAAM,MAAM,YAAY;AAAA,IAC1B,UAAE;AACA,sBAAgB,KAAK;AAAA,IACvB;AAAA,EACF;AAEA,MAAI,CAAC,uBAAuB;AAC1B,IAAAA,OAAM,MAAM,oDAAoD;AAChE,WAAO;AAAA,EACT;AAEA,SACE,gBAAAL;AAAA,IAAC;AAAA;AAAA,MACC,MAAI;AAAA,MACJ,OAAM;AAAA,MACN,aAAa,uCAAuC,KAAK;AAAA,MACzD,gBAAgB;AAAA,MAChB,WAAW;AAAA,MACX,UAAU;AAAA,MACV,UAAU,YAAY;AACpB,YAAI;AACF,0BAAgB,IAAI;AACpB,gBAAM,OAAO,MAAM,iCAAiC,YAAY;AAAA,YAC9D,MAAM,EAAE,MAAM;AAAA,UAChB,CAAC;AACD,mCAAyB,KAAK,MAAM,kBAAkB,IAAI;AAC1D,UAAAK,OAAM,QAAQ,0BAA0B;AAAA,QAC1C,SAAS,OAAO;AACd,UAAAA,OAAM,MAAMF,iBAAgB,KAAK,CAAC;AAAA,QACpC,UAAE;AACA,0BAAgB,KAAK;AAAA,QACvB;AAAA,MACF;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;;;ALzGY,gBAAAG,MAMF,QAAAC,aANE;AAtCL,SAAS,kBAAkB;AAChC,QAAM,EAAE,KAAK,IAAI,WAAW;AAC5B,QAAM,CAAC,QAAQ,SAAS,IAAIC,UAAS,KAAK;AAC1C,QAAM,CAAC,SAAS,UAAU,IAAIA,UAAS,KAAK;AAC5C,QAAM,CAAC,gBAAgB,iBAAiB,IAAIA,UAAwB,IAAI;AACxE,QAAM,CAAC,UAAU,WAAW,IAAIA,UAAiB,EAAE;AAEnD,QAAM,aAAa,MAAM;AACvB,eAAW,KAAK;AAChB,sBAAkB,IAAI;AACtB,gBAAY,EAAE;AAAA,EAChB;AAEA,QAAM,uBAAuB,CAAC,IAAY,UAAkB;AAC1D,sBAAkB,EAAE;AACpB,gBAAY,KAAK;AACjB,eAAW,IAAI;AAAA,EACjB;AAEA,QAAM,sBAAsB,MAAM;AAChC,eAAW;AACX,cAAU,KAAK;AAAA,EACjB;AAEA,QAAM,eAAe,MAAM;AACzB,eAAW;AACX,cAAU,KAAK;AAAA,EACjB;AAEA,QAAM,QAAQ,MAAM,QAAQ,iBAAiB;AAC7C,QAAM,cAAc,MAAM,QACtB,8BACA;AACJ,SACE,gBAAAF,KAAC,eAAY,MAAM,QAAQ,cAAc,WACvC,0BAAAC,MAAC,SAAI,WAAU,qBACb;AAAA,oBAAAA;AAAA,MAAC;AAAA;AAAA,QACC,QACE,gBAAAD;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,SAAQ;AAAA,YACR,WAAU;AAAA;AAAA,QACZ;AAAA,QAGF;AAAA,0BAAAF,MAAC,SAAI,WAAU,6BACb;AAAA,4BAAAD,KAAC,UAAK,WAAU,eAAe,iBAAM;AAAA,YACrC,gBAAAA,KAAC,UAAK,WAAU,iCAAiC,uBAAY;AAAA,aAC/D;AAAA,UACA,gBAAAA;AAAA,YAAC;AAAA;AAAA,cACC,WAAW,gCACT,SAAS,eAAe,EAC1B;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IACF;AAAA,IAEA,gBAAAA,KAAC,sBACE,oBACC,gBAAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP;AAAA,QACA,WAAW;AAAA,QACX,UAAU;AAAA;AAAA,IACZ,IAEA,gBAAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,QACX,UAAU;AAAA,QACV,YAAY;AAAA;AAAA,IACd,GAEJ;AAAA,KACF,GACF;AAEJ;","names":["Button","useState","useState","jsx","useState","useState","toast","zodResolver","Button","Spinner","useForm","z","Button","Spinner","useEffect","useState","jsx","jsxs","useState","useEffect","Button","Spinner","jsx","jsxs","z","useForm","zodResolver","Button","Spinner","jsx","jsxs","jsx","isAuthError","getErrorCode","getErrorMessage","useState","toast","jsx","jsxs","useState","Button"]}
1
+ {"version":3,"sources":["../../../src/components/profile/change-email-form.tsx","../../../src/provider.tsx","../../../src/lib/translations.ts","../../../src/utils/cookie.ts","../../../src/components/profile/request-change-email-form.tsx","../../../src/components/profile/verify-change-email-form.tsx","../../../src/components/profile/otp-verification-modal.tsx","../../../src/components/auth/verification-form.tsx","../../../src/hooks/use-translator.ts","../../../src/components/auth/countdown.tsx"],"sourcesContent":["'use client';\n\nimport {\n Button,\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '@mesob/ui/components';\nimport { IconChevronDown } from '@tabler/icons-react';\nimport { useState } from 'react';\nimport { useSession } from '../../provider';\nimport { RequestChangeEmailForm } from './request-change-email-form';\nimport { VerifyChangeEmailForm } from './verify-change-email-form';\n\nexport function ChangeEmailForm() {\n const { user } = useSession();\n const [isOpen, setIsOpen] = useState(false);\n const [showOtp, setShowOtp] = useState(false);\n const [verificationId, setVerificationId] = useState<string | null>(null);\n const [newEmail, setNewEmail] = useState<string>('');\n\n const resetForms = () => {\n setShowOtp(false);\n setVerificationId(null);\n setNewEmail('');\n };\n\n const handleRequestSuccess = (id: string, email: string) => {\n setVerificationId(id);\n setNewEmail(email);\n setShowOtp(true);\n };\n\n const handleVerifySuccess = () => {\n resetForms();\n setIsOpen(false);\n };\n\n const handleCancel = () => {\n resetForms();\n setIsOpen(false);\n };\n\n const title = user?.email ? 'Change Email' : 'Add Email';\n const description = user?.email\n ? 'Update your email address'\n : 'Add an email address to your account';\n return (\n <Collapsible open={isOpen} onOpenChange={setIsOpen}>\n <div className=\"border rounded-lg\">\n <CollapsibleTrigger\n render={\n <Button\n variant=\"ghost\"\n className=\"w-full justify-between p-4 h-auto\"\n />\n }\n >\n <div className=\"flex flex-col items-start\">\n <span className=\"font-medium\">{title}</span>\n <span className=\"text-sm text-muted-foreground\">{description}</span>\n </div>\n <IconChevronDown\n className={`h-4 w-4 transition-transform ${\n isOpen ? 'rotate-180' : ''\n }`}\n />\n </CollapsibleTrigger>\n\n <CollapsibleContent>\n {showOtp ? (\n <VerifyChangeEmailForm\n email={newEmail}\n verificationId={verificationId}\n onSuccess={handleVerifySuccess}\n onCancel={handleCancel}\n />\n ) : (\n <RequestChangeEmailForm\n onSuccess={handleRequestSuccess}\n onCancel={handleCancel}\n buttonText={title}\n />\n )}\n </CollapsibleContent>\n </div>\n </Collapsible>\n );\n}\n","'use client';\n\nimport { QueryClient, QueryClientProvider } from '@tanstack/react-query';\nimport { deepmerge } from 'deepmerge-ts';\nimport createFetchClient from 'openapi-fetch';\nimport createClient from 'openapi-react-query';\nimport type { ReactNode } from 'react';\nimport { createContext, useContext, useMemo, useState } from 'react';\nimport type { paths } from './data/openapi';\nimport { createTranslator } from './lib/translations';\nimport {\n type AuthClientConfig,\n type AuthResponse,\n defaultAuthClientConfig,\n type Session,\n type User,\n} from './types';\nimport { getSessionCookieName } from './utils/cookie';\nimport { createCustomFetch } from './utils/custom-fetch';\n\n// biome-ignore lint/suspicious/noExplicitAny: OpenAPI hooks type\ntype OpenApiHooks = any;\n\n// --- Utility: Check if running on server ---\nfunction isServer(): boolean {\n return typeof document === 'undefined';\n}\n\n/**\n * @deprecated Cookie is httpOnly and cannot be read client-side.\n * Use `useSession().isAuthenticated` instead.\n * This function always returns false on client.\n */\nexport function hasAuthCookie(_cookieName: string): boolean {\n // Cookie is httpOnly, can't check client-side\n // Always return false - use useSession() for auth status\n return false;\n}\n\n// --- Types ---\nexport type AuthStatus = 'loading' | 'authenticated' | 'unauthenticated';\n\ntype AuthState = {\n user: User | null;\n session: Session | null;\n status: AuthStatus;\n error: Error | null;\n};\n\ntype SessionContextValue = AuthState & {\n isLoading: boolean;\n isAuthenticated: boolean;\n refresh: () => Promise<void>;\n signOut: () => Promise<void>;\n};\n\ntype ApiContextValue = {\n hooks: OpenApiHooks;\n setAuth: (auth: AuthResponse) => void;\n clearAuth: () => void;\n refresh: () => Promise<void>;\n};\n\ntype ConfigContextValue = {\n config: AuthClientConfig;\n cookieName: string;\n t: (key: string, params?: Record<string, string | number>) => string;\n};\n\nconst SessionContext = createContext<SessionContextValue | null>(null);\nconst ApiContext = createContext<ApiContextValue | null>(null);\nconst ConfigContext = createContext<ConfigContextValue | null>(null);\n\nconst queryClient = new QueryClient({\n defaultOptions: {\n queries: {\n refetchOnWindowFocus: false,\n },\n },\n});\n\n// --- Hooks ---\n\n/**\n * Get session state including user, session, and auth status.\n * - `status`: 'loading' | 'authenticated' | 'unauthenticated'\n * - `isLoading`: true while fetching session\n * - `isAuthenticated`: true if user and session exist\n */\nexport function useSession(): SessionContextValue {\n const context = useContext(SessionContext);\n if (!context) {\n throw new Error('useSession must be used within MesobAuthProvider');\n }\n return context;\n}\n\nexport function useApi(): ApiContextValue {\n const context = useContext(ApiContext);\n if (!context) {\n throw new Error('useApi must be used within MesobAuthProvider');\n }\n return context;\n}\n\nexport function useConfig(): ConfigContextValue {\n const context = useContext(ConfigContext);\n if (!context) {\n throw new Error('useConfig must be used within MesobAuthProvider');\n }\n return context;\n}\n\n/**\n * @deprecated Cookie is httpOnly, can't be checked client-side.\n * Use `useSession().isAuthenticated` instead.\n */\nexport function useHasAuthCookie(): boolean {\n const { status } = useSession();\n return status === 'authenticated' || status === 'loading';\n}\n\n// --- Provider ---\n\ntype MesobAuthProviderProps = {\n config: AuthClientConfig;\n children: ReactNode;\n};\n\nexport function MesobAuthProvider({\n config,\n children,\n}: MesobAuthProviderProps) {\n const mergedConfig = useMemo(\n () =>\n deepmerge(\n { ...defaultAuthClientConfig } as Partial<AuthClientConfig>,\n config,\n ) as AuthClientConfig,\n [config],\n );\n\n const api = useMemo(\n () =>\n createFetchClient<paths>({\n baseUrl: mergedConfig.baseURL,\n fetch: createCustomFetch(mergedConfig),\n }),\n [mergedConfig],\n );\n\n const hooks = useMemo(() => createClient(api), [api]);\n const cookieName = useMemo(\n () => getSessionCookieName(mergedConfig),\n [mergedConfig],\n );\n\n return (\n <QueryClientProvider client={queryClient}>\n <AuthStateProvider\n config={mergedConfig}\n hooks={hooks}\n cookieName={cookieName}\n >\n {children}\n </AuthStateProvider>\n </QueryClientProvider>\n );\n}\n\ntype AuthStateProviderProps = {\n config: AuthClientConfig;\n hooks: OpenApiHooks;\n cookieName: string;\n children: ReactNode;\n};\n\nfunction AuthStateProvider({\n config,\n hooks,\n cookieName,\n children,\n}: AuthStateProviderProps) {\n // Manual override for sign-out / sign-in\n const [override, setOverride] = useState<AuthState | null>(null);\n\n // Always fetch session - cookie is httpOnly, can't check client-side\n // Server will read the cookie and return user/session if valid\n const {\n data: sessionData,\n isLoading,\n isFetched,\n error: sessionError,\n refetch,\n } = hooks.useQuery(\n 'get',\n '/session',\n {},\n {\n enabled: !(override || isServer()),\n refetchOnMount: false,\n refetchOnWindowFocus: false,\n refetchOnReconnect: false,\n retry: false,\n gcTime: 0,\n staleTime: 0,\n },\n );\n\n // Derive state directly - no useEffect\n const user = override?.user ?? sessionData?.user ?? null;\n const session = override?.session ?? sessionData?.session ?? null;\n const error = override?.error ?? (sessionError as Error | null);\n\n // Check error status code\n const errorStatus = (() => {\n if (!sessionError) {\n return null;\n }\n const err = sessionError as { status?: number };\n return err.status ?? null;\n })();\n\n // Check if error is a network/connection error\n const isNetworkError = (() => {\n if (!sessionError) {\n return false;\n }\n const error = sessionError as Error & { cause?: unknown; data?: unknown };\n const errorMessage =\n error.message || String(error) || JSON.stringify(error);\n // Network errors: TypeError, DOMException, or fetch failures\n if (\n error instanceof TypeError ||\n error instanceof DOMException ||\n error.name === 'TypeError' ||\n errorMessage.includes('Failed to fetch') ||\n errorMessage.includes('ERR_CONNECTION_REFUSED') ||\n errorMessage.includes('NetworkError') ||\n errorMessage.includes('Network request failed') ||\n errorMessage.includes('fetch failed')\n ) {\n return true;\n }\n // Check error cause\n if (error.cause) {\n const causeStr = String(error.cause);\n if (\n causeStr.includes('Failed to fetch') ||\n causeStr.includes('ERR_CONNECTION_REFUSED') ||\n causeStr.includes('NetworkError')\n ) {\n return true;\n }\n }\n return false;\n })();\n\n // Compute status\n // biome-ignore lint: Status determination requires multiple checks\n const status: AuthStatus = (() => {\n if (override) {\n return override.status;\n }\n if (isServer()) {\n return 'loading';\n }\n if (user && session) {\n return 'authenticated';\n }\n // Check for network errors or auth errors first - allow auth page to show\n if (isNetworkError || errorStatus === 401) {\n return 'unauthenticated';\n }\n // If we have an error but it's not a network error, still check loading state\n if (sessionError && !isNetworkError && errorStatus !== 401) {\n if (errorStatus && errorStatus >= 500) {\n return 'authenticated';\n }\n // Other errors mean unauthenticated\n if (isFetched) {\n return 'unauthenticated';\n }\n }\n if (isLoading || !isFetched) {\n return 'loading';\n }\n if (isFetched && !user && !session) {\n return 'unauthenticated';\n }\n return 'unauthenticated';\n })();\n\n const signOutMutation = hooks.useMutation('post', '/sign-out');\n const t = createTranslator(config.messages || {});\n\n const setAuth = (auth: AuthResponse) => {\n setOverride({\n user: auth.user,\n session: auth.session,\n status: 'authenticated',\n error: null,\n });\n };\n\n const clearAuth = () => {\n setOverride({\n user: null,\n session: null,\n status: 'unauthenticated',\n error: null,\n });\n };\n\n const refresh = async () => {\n setOverride(null);\n await refetch();\n };\n\n const signOut = async () => {\n try {\n await signOutMutation.mutateAsync({});\n } finally {\n clearAuth();\n }\n };\n\n return (\n <ConfigContext.Provider value={{ config, cookieName, t }}>\n <ApiContext.Provider value={{ hooks, setAuth, clearAuth, refresh }}>\n <SessionContext.Provider\n value={{\n user,\n session,\n status,\n error,\n isLoading: status === 'loading',\n isAuthenticated: status === 'authenticated',\n refresh,\n signOut,\n }}\n >\n {children}\n </SessionContext.Provider>\n </ApiContext.Provider>\n </ConfigContext.Provider>\n );\n}\n","type Messages = Record<string, unknown>;\n\nexport function createTranslator(messages: Messages, namespace?: string) {\n return (key: string, params?: Record<string, string | number>): string => {\n const fullKey = namespace ? `${namespace}.${key}` : key;\n const keys = fullKey.split('.');\n\n let value: unknown = messages;\n for (const k of keys) {\n if (value && typeof value === 'object' && value !== null) {\n value = (value as Record<string, unknown>)[k];\n } else {\n return fullKey;\n }\n }\n\n if (typeof value !== 'string') {\n return fullKey;\n }\n\n // Simple parameter replacement\n if (params) {\n return value.replace(/\\{(\\w+)\\}/g, (_, param) =>\n String(params[param] ?? `{${param}}`),\n );\n }\n\n return value;\n };\n}\n","import type { AuthClientConfig } from '../types';\n\nconst isProduction =\n typeof process !== 'undefined' && process.env.NODE_ENV === 'production';\n\nexport const getSessionCookieName = (config: AuthClientConfig): string => {\n const prefix = config.cookiePrefix || '';\n const baseName = 'session_token';\n if (prefix) {\n return `${prefix}_${baseName}`;\n }\n return isProduction ? '__Host-session_token' : baseName;\n};\n","'use client';\n\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport { Button, Input, Label, Spinner } from '@mesob/ui/components';\nimport { IconEye, IconEyeOff } from '@tabler/icons-react';\nimport { useEffect, useState } from 'react';\nimport { useForm } from 'react-hook-form';\nimport { toast } from 'sonner';\nimport { z } from 'zod';\nimport { useApi, useSession } from '../../provider';\n\nconst emailPasswordSchema = z.object({\n email: z.string().email('Invalid email address'),\n password: z\n .string()\n .min(8, 'Password must be at least 8 characters')\n .max(128, 'Password too long'),\n});\n\ntype EmailPasswordFormData = z.infer<typeof emailPasswordSchema>;\n\ntype AuthErrorLike = {\n code?: string;\n message?: string;\n name?: string;\n};\n\nfunction isAuthError(error: unknown): error is AuthErrorLike {\n return (\n typeof error === 'object' &&\n error !== null &&\n ('code' in error || 'message' in error || 'name' in error)\n );\n}\n\nfunction getErrorCode(error: AuthErrorLike): string | undefined {\n if (error.code) {\n return error.code;\n }\n if (error.message) {\n const upperMessage = error.message.toUpperCase().trim();\n const validCodes = [\n 'USER_NOT_FOUND',\n 'USER_EXISTS',\n 'INVALID_PASSWORD',\n 'VERIFICATION_EXPIRED',\n 'VERIFICATION_MISMATCH',\n 'VERIFICATION_NOT_FOUND',\n 'TOO_MANY_ATTEMPTS',\n 'UNAUTHORIZED',\n ];\n if (validCodes.includes(upperMessage)) {\n return upperMessage;\n }\n }\n return undefined;\n}\n\nfunction getErrorMessage(error: unknown): string {\n if (isAuthError(error)) {\n const errorCode = getErrorCode(error);\n switch (errorCode) {\n case 'USER_EXISTS':\n return 'This email is already taken. Please use a different email.';\n case 'VERIFICATION_EXPIRED':\n return 'Verification code has expired. Please request a new one.';\n case 'VERIFICATION_MISMATCH':\n return 'Invalid verification code. Please try again.';\n case 'VERIFICATION_NOT_FOUND':\n return 'Verification not found. Please request a new code.';\n default:\n return error.message || 'An error occurred. Please try again.';\n }\n }\n if (error instanceof Error) {\n return error.message;\n }\n return 'An error occurred. Please try again.';\n}\n\ninterface RequestChangeEmailFormProps {\n onSuccess: (verificationId: string, email: string) => void;\n onCancel: () => void;\n buttonText: string;\n}\n\nexport function RequestChangeEmailForm({\n onSuccess,\n onCancel,\n buttonText,\n}: RequestChangeEmailFormProps) {\n const { user } = useSession();\n const { hooks } = useApi();\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [isChecking, setIsChecking] = useState(true);\n const [showPassword, setShowPassword] = useState(false);\n\n const getPendingAccountChangeQuery = hooks.useQuery(\n 'get',\n '/account-change/pending',\n {},\n { enabled: false },\n );\n const verifyPasswordMutation = hooks.useMutation('post', '/password/verify');\n const checkUserMutation = hooks.useMutation('post', '/check-account');\n const requestEmailVerificationMutation = hooks.useMutation(\n 'post',\n '/email/verification/request',\n );\n\n const emailPasswordForm = useForm<EmailPasswordFormData>({\n resolver: zodResolver(emailPasswordSchema),\n defaultValues: {\n email: '',\n password: '',\n },\n });\n\n const {\n register,\n handleSubmit,\n getValues,\n setValue,\n formState: { errors },\n } = emailPasswordForm;\n\n useEffect(() => {\n let active = true;\n const run = async () => {\n try {\n const data = await getPendingAccountChangeQuery.refetch();\n if (!active) {\n return;\n }\n const accountChange = data.data?.accountChange;\n const verificationId = data.data?.verificationId;\n if (accountChange?.changeType !== 'email') {\n setIsChecking(false);\n return;\n }\n if (!accountChange.newEmail) {\n setIsChecking(false);\n return;\n }\n if (getValues('email')) {\n setIsChecking(false);\n return;\n }\n setValue('email', accountChange.newEmail, { shouldValidate: true });\n\n if (verificationId) {\n toast.message('Resuming verification…');\n onSuccess(verificationId, accountChange.newEmail);\n return;\n }\n\n setIsChecking(false);\n } catch {\n setIsChecking(false);\n }\n };\n run().catch(() => undefined);\n return () => {\n active = false;\n };\n }, [getPendingAccountChangeQuery.refetch, getValues, onSuccess, setValue]);\n\n const onEmailPasswordSubmit = async (data: EmailPasswordFormData) => {\n if (!user) {\n toast.error('User not found');\n return;\n }\n\n try {\n setIsSubmitting(true);\n\n // Verify password first\n await verifyPasswordMutation.mutateAsync({\n body: { password: data.password },\n });\n\n // Check if email exists\n const checkResult = await checkUserMutation.mutateAsync({\n body: { identifier: data.email },\n });\n if (checkResult.data?.exists) {\n // Check if it belongs to current user\n if (user?.email?.toLowerCase() === data.email.toLowerCase()) {\n toast.error('This is already your current email address.');\n return;\n }\n toast.error(\n 'This email is already taken. Please use a different email.',\n );\n return;\n }\n\n // Request verification\n const verification = await requestEmailVerificationMutation.mutateAsync({\n body: { email: data.email },\n });\n\n toast.success('Verification code sent to your email');\n onSuccess(verification.data?.verificationId ?? '', data.email);\n } catch (error) {\n const errorMessage = getErrorMessage(error);\n if (isAuthError(error)) {\n const errorCode = getErrorCode(error);\n if (\n errorCode === 'INVALID_PASSWORD' ||\n errorCode === 'USER_NOT_FOUND'\n ) {\n toast.error('Incorrect password. Please try again.');\n return;\n }\n }\n toast.error(errorMessage);\n } finally {\n setIsSubmitting(false);\n }\n };\n\n const isLoading = isSubmitting || isChecking;\n\n return (\n <form\n onSubmit={handleSubmit(onEmailPasswordSubmit)}\n className=\"p-4 space-y-4 border-t\"\n >\n <div className=\"space-y-4 w-full md:w-1/2\">\n <div className=\"space-y-2\">\n <Label htmlFor=\"email\">New Email Address</Label>\n <Input\n id=\"email\"\n type=\"email\"\n placeholder=\"Enter your new email\"\n {...register('email')}\n disabled={isLoading}\n />\n {errors.email && (\n <p className=\"text-sm text-destructive\">{errors.email.message}</p>\n )}\n </div>\n <div className=\"space-y-2\">\n <Label htmlFor=\"password\">Password</Label>\n <div className=\"relative\">\n <Input\n id=\"password\"\n type={showPassword ? 'text' : 'password'}\n autoComplete=\"current-password\"\n placeholder=\"Enter your password\"\n {...register('password')}\n disabled={isLoading}\n />\n <button\n type=\"button\"\n onClick={() => setShowPassword(!showPassword)}\n className=\"absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground\"\n disabled={isLoading}\n >\n {showPassword ? (\n <IconEyeOff className=\"h-4 w-4\" />\n ) : (\n <IconEye className=\"h-4 w-4\" />\n )}\n </button>\n </div>\n {errors.password && (\n <p className=\"text-sm text-destructive\">\n {errors.password.message}\n </p>\n )}\n </div>\n </div>\n\n <div className=\"flex justify-end gap-2\">\n <Button\n type=\"button\"\n variant=\"outline\"\n onClick={onCancel}\n disabled={isLoading}\n >\n Cancel\n </Button>\n <Button type=\"submit\" disabled={isLoading}>\n {isLoading && <Spinner className=\"mr-2 h-4 w-4\" />}\n {isChecking ? 'Checking…' : buttonText}\n </Button>\n </div>\n </form>\n );\n}\n","'use client';\n\nimport { useState } from 'react';\nimport { toast } from 'sonner';\nimport { useApi, useSession } from '../../provider';\nimport { OtpVerificationModal } from './otp-verification-modal';\n\ntype AuthErrorLike = {\n code?: string;\n message?: string;\n name?: string;\n};\n\nfunction isAuthError(error: unknown): error is AuthErrorLike {\n return (\n typeof error === 'object' &&\n error !== null &&\n ('code' in error || 'message' in error || 'name' in error)\n );\n}\n\nfunction getErrorCode(error: AuthErrorLike): string | undefined {\n if (error.code) {\n return error.code;\n }\n if (error.message) {\n const upperMessage = error.message.toUpperCase().trim();\n const validCodes = [\n 'USER_NOT_FOUND',\n 'USER_EXISTS',\n 'INVALID_PASSWORD',\n 'VERIFICATION_EXPIRED',\n 'VERIFICATION_MISMATCH',\n 'VERIFICATION_NOT_FOUND',\n 'TOO_MANY_ATTEMPTS',\n 'UNAUTHORIZED',\n ];\n if (validCodes.includes(upperMessage)) {\n return upperMessage;\n }\n }\n return undefined;\n}\n\nfunction getErrorMessage(error: unknown): string {\n if (isAuthError(error)) {\n const errorCode = getErrorCode(error);\n switch (errorCode) {\n case 'USER_EXISTS':\n return 'This email is already taken. Please use a different email.';\n case 'VERIFICATION_EXPIRED':\n return 'Verification code has expired. Please request a new one.';\n case 'VERIFICATION_MISMATCH':\n return 'Invalid verification code. Please try again.';\n case 'VERIFICATION_NOT_FOUND':\n return 'Verification not found. Please request a new code.';\n default:\n return error.message || 'An error occurred. Please try again.';\n }\n }\n if (error instanceof Error) {\n return error.message;\n }\n return 'An error occurred. Please try again.';\n}\n\ntype VerifyChangeEmailFormProps = {\n email: string;\n verificationId: string | null;\n onSuccess: () => void;\n onCancel: () => void;\n};\n\nexport function VerifyChangeEmailForm({\n email,\n verificationId,\n onSuccess,\n onCancel,\n}: VerifyChangeEmailFormProps) {\n const { refresh } = useSession();\n const { hooks } = useApi();\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [currentVerificationId, setCurrentVerificationId] =\n useState(verificationId);\n\n const verifyEmailMutation = hooks.useMutation(\n 'post',\n '/email/verification/confirm',\n );\n const updateEmailMutation = hooks.useMutation('put', '/profile/email');\n const requestEmailVerificationMutation = hooks.useMutation(\n 'post',\n '/email/verification/request',\n );\n\n const onOtpSubmit = async (code: string) => {\n if (!currentVerificationId) {\n toast.error('Verification not found. Please request a new code.');\n return;\n }\n try {\n setIsSubmitting(true);\n\n // Verify email\n await verifyEmailMutation.mutateAsync({\n body: {\n verificationId: currentVerificationId,\n code,\n },\n });\n\n // Update email via auth client\n await updateEmailMutation.mutateAsync({\n body: { email },\n });\n\n toast.success('Email updated successfully');\n await refresh();\n onSuccess();\n } catch (error) {\n const errorMessage = getErrorMessage(error);\n toast.error(errorMessage);\n } finally {\n setIsSubmitting(false);\n }\n };\n\n if (!currentVerificationId) {\n toast.error('Verification not found. Please request a new code.');\n return null;\n }\n\n return (\n <OtpVerificationModal\n open\n title=\"Verify email\"\n description={`Enter the verification code sent to ${email}`}\n verificationId={currentVerificationId}\n isLoading={isSubmitting}\n onSubmit={onOtpSubmit}\n onResend={async () => {\n try {\n setIsSubmitting(true);\n const next = await requestEmailVerificationMutation.mutateAsync({\n body: { email },\n });\n setCurrentVerificationId(next.data?.verificationId ?? null);\n toast.success('Verification code resent');\n } catch (error) {\n toast.error(getErrorMessage(error));\n } finally {\n setIsSubmitting(false);\n }\n }}\n onCancel={onCancel}\n />\n );\n}\n","'use client';\n\nimport {\n Dialog,\n DialogContent,\n DialogDescription,\n DialogHeader,\n DialogTitle,\n} from '@mesob/ui/components';\nimport { VerificationForm } from '../auth/verification-form';\n\ntype OtpVerificationModalProps = {\n open: boolean;\n title: string;\n description?: string;\n verificationId: string;\n isLoading?: boolean;\n onSubmit: (code: string) => Promise<void> | void;\n onResend?: () => Promise<void> | void;\n onCancel?: () => void;\n};\n\nexport function OtpVerificationModal({\n open,\n title,\n description,\n verificationId,\n isLoading,\n onSubmit,\n onResend,\n onCancel,\n}: OtpVerificationModalProps) {\n return (\n <Dialog\n open={open}\n onOpenChange={(nextOpen: boolean) => {\n if (!nextOpen) {\n onCancel?.();\n }\n }}\n >\n <DialogContent>\n <DialogHeader>\n <DialogTitle>{title}</DialogTitle>\n {description && <DialogDescription>{description}</DialogDescription>}\n </DialogHeader>\n\n <VerificationForm\n verificationId={verificationId}\n isLoading={isLoading}\n onSubmit={async ({ code }: { code: string }) => onSubmit(code)}\n onResend={onResend ?? (() => undefined)}\n />\n </DialogContent>\n </Dialog>\n );\n}\n","'use client';\n\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport {\n Button,\n Form,\n FormControl,\n FormField,\n FormItem,\n FormLabel,\n FormMessage,\n InputOTP,\n InputOTPGroup,\n InputOTPSlot,\n Spinner,\n} from '@mesob/ui/components';\nimport { useForm } from 'react-hook-form';\nimport { z } from 'zod';\nimport { useTranslator } from '../../hooks/use-translator';\nimport type { AuthErrorContent } from '../../utils/handle-error';\nimport { Countdown } from './countdown';\n\ntype VerificationFormValues = {\n code: string;\n};\n\ntype VerificationFormProps = {\n verificationId: string;\n onSubmit: (values: VerificationFormValues) => Promise<void> | void;\n onResend: () => Promise<void> | void;\n isLoading?: boolean;\n error?: AuthErrorContent | string | null;\n};\n\nconst verificationSchema = (t: (key: string) => string) =>\n z.object({\n code: z.string().length(6, t('form.codeLength')),\n });\n\nexport const VerificationForm = ({\n onSubmit,\n onResend,\n isLoading = false,\n}: VerificationFormProps) => {\n const t = useTranslator('Auth.verification');\n const form = useForm<VerificationFormValues>({\n resolver: zodResolver(verificationSchema(t)),\n defaultValues: {\n code: '',\n },\n });\n\n const handleSubmit = form.handleSubmit(async (values) => {\n await onSubmit(values);\n });\n\n return (\n <Form {...form}>\n <form\n id=\"verification-form\"\n onSubmit={handleSubmit}\n className=\"space-y-4\"\n >\n <FormField\n control={form.control}\n name=\"code\"\n render={({ field }) => (\n <FormItem>\n <div className=\"flex justify-center\">\n <FormLabel>{t('form.codeLabel')}</FormLabel>\n </div>\n <FormControl>\n <InputOTP\n maxLength={6}\n required\n value={field.value ?? ''}\n onChange={field.onChange}\n onBlur={field.onBlur}\n containerClassName=\"gap-4 justify-center mb-2 flex items-center\"\n >\n <InputOTPGroup className=\"gap-3 *:data-[slot=input-otp-slot]:h-12 *:data-[slot=input-otp-slot]:w-12 *:data-[slot=input-otp-slot]:rounded-md *:data-[slot=input-otp-slot]:border *:data-[slot=input-otp-slot]:text-xl\">\n <InputOTPSlot className=\"h-12\" index={0} />\n <InputOTPSlot className=\"h-12\" index={1} />\n <InputOTPSlot className=\"h-12\" index={2} />\n <InputOTPSlot className=\"h-12\" index={3} />\n <InputOTPSlot className=\"h-12\" index={4} />\n <InputOTPSlot className=\"h-12\" index={5} />\n </InputOTPGroup>\n </InputOTP>\n </FormControl>\n <FormMessage />\n </FormItem>\n )}\n />\n <div className=\"flex justify-between items-center\">\n <Countdown onResend={onResend} resending={isLoading} />\n <Button\n type=\"submit\"\n form=\"verification-form\"\n disabled={isLoading || form.watch('code').length !== 6}\n >\n {isLoading && <Spinner />}\n {t('form.confirm')}\n </Button>\n </div>\n </form>\n </Form>\n );\n};\n","import { useMesob } from '@mesob/ui/providers';\nimport { createTranslator } from '../lib/translations';\nimport { useConfig } from '../provider';\n\nexport function useTranslator(namespace?: string) {\n const mesob = useMesob();\n const { config } = useConfig();\n\n if (mesob?.t) {\n return (key: string, params?: Record<string, string | number>): string => {\n const fullKey = namespace ? `${namespace}.${key}` : key;\n return mesob.t?.(fullKey, params) ?? fullKey;\n };\n }\n\n return createTranslator(config.messages || {}, namespace);\n}\n","'use client';\n\nimport { Button, Spinner } from '@mesob/ui/components';\nimport { useEffect, useState } from 'react';\nimport { useTranslator } from '../../hooks/use-translator';\n\ntype CountdownProps = {\n initialSeconds?: number;\n onResend: () => Promise<void> | void;\n resending?: boolean;\n};\n\nexport const Countdown = ({\n initialSeconds = 60,\n onResend,\n resending = false,\n}: CountdownProps) => {\n const t = useTranslator('Common');\n const [seconds, setSeconds] = useState(initialSeconds);\n const [isResending, setIsResending] = useState(false);\n\n useEffect(() => {\n if (seconds <= 0) {\n return;\n }\n\n const timer = setInterval(() => {\n setSeconds((prev) => {\n if (prev <= 1) {\n clearInterval(timer);\n return 0;\n }\n return prev - 1;\n });\n }, 1000);\n\n return () => clearInterval(timer);\n }, [seconds]);\n\n const handleResend = async () => {\n setIsResending(true);\n try {\n await onResend();\n setSeconds(initialSeconds);\n } catch (_error) {\n // Error handling is done by parent\n } finally {\n setIsResending(false);\n }\n };\n\n if (seconds > 0) {\n return (\n <Button variant=\"ghost\" disabled>\n {t('resendIn', { seconds })}\n </Button>\n );\n }\n\n return (\n <Button\n variant=\"ghost\"\n onClick={handleResend}\n disabled={isResending || resending}\n >\n {isResending || (resending && <Spinner />)}\n {t('resend')}\n </Button>\n );\n};\n"],"mappings":"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","names":["Button","useState","useState","jsx","useState","useState","toast","zodResolver","Button","Spinner","useForm","z","Button","Spinner","useEffect","useState","jsx","jsxs","useState","useEffect","Button","Spinner","jsx","jsxs","z","useForm","zodResolver","Button","Spinner","jsx","jsxs","jsx","isAuthError","getErrorCode","getErrorMessage","useState","toast","jsx","jsxs","useState","Button"]}
@@ -376,15 +376,18 @@ import {
376
376
  import { zodResolver as zodResolver2 } from "@hookform/resolvers/zod";
377
377
  import {
378
378
  Button as Button3,
379
- Field,
380
- FieldError,
381
- FieldGroup,
379
+ Form,
380
+ FormControl,
381
+ FormField,
382
+ FormItem,
383
+ FormLabel,
384
+ FormMessage,
382
385
  InputOTP,
383
386
  InputOTPGroup,
384
387
  InputOTPSlot,
385
388
  Spinner as Spinner3
386
389
  } from "@mesob/ui/components";
387
- import { Controller, useForm as useForm2 } from "react-hook-form";
390
+ import { useForm as useForm2 } from "react-hook-form";
388
391
  import { z as z2 } from "zod";
389
392
 
390
393
  // src/hooks/use-translator.ts
@@ -475,54 +478,61 @@ var VerificationForm = ({
475
478
  const handleSubmit = form.handleSubmit(async (values) => {
476
479
  await onSubmit(values);
477
480
  });
478
- return /* @__PURE__ */ jsxs3("form", { id: "verification-form", onSubmit: handleSubmit, children: [
479
- /* @__PURE__ */ jsx4(FieldGroup, { children: /* @__PURE__ */ jsx4(
480
- Controller,
481
- {
482
- name: "code",
483
- control: form.control,
484
- render: ({ field, fieldState }) => /* @__PURE__ */ jsxs3(Field, { "data-invalid": fieldState.invalid, children: [
485
- /* @__PURE__ */ jsx4("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx4(
486
- InputOTP,
481
+ return /* @__PURE__ */ jsx4(Form, { ...form, children: /* @__PURE__ */ jsxs3(
482
+ "form",
483
+ {
484
+ id: "verification-form",
485
+ onSubmit: handleSubmit,
486
+ className: "space-y-4",
487
+ children: [
488
+ /* @__PURE__ */ jsx4(
489
+ FormField,
490
+ {
491
+ control: form.control,
492
+ name: "code",
493
+ render: ({ field }) => /* @__PURE__ */ jsxs3(FormItem, { children: [
494
+ /* @__PURE__ */ jsx4("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx4(FormLabel, { children: t("form.codeLabel") }) }),
495
+ /* @__PURE__ */ jsx4(FormControl, { children: /* @__PURE__ */ jsx4(
496
+ InputOTP,
497
+ {
498
+ maxLength: 6,
499
+ required: true,
500
+ value: field.value ?? "",
501
+ onChange: field.onChange,
502
+ onBlur: field.onBlur,
503
+ containerClassName: "gap-4 justify-center mb-2 flex items-center",
504
+ children: /* @__PURE__ */ jsxs3(InputOTPGroup, { className: "gap-3 *:data-[slot=input-otp-slot]:h-12 *:data-[slot=input-otp-slot]:w-12 *:data-[slot=input-otp-slot]:rounded-md *:data-[slot=input-otp-slot]:border *:data-[slot=input-otp-slot]:text-xl", children: [
505
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 0 }),
506
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 1 }),
507
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 2 }),
508
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 3 }),
509
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 4 }),
510
+ /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 5 })
511
+ ] })
512
+ }
513
+ ) }),
514
+ /* @__PURE__ */ jsx4(FormMessage, {})
515
+ ] })
516
+ }
517
+ ),
518
+ /* @__PURE__ */ jsxs3("div", { className: "flex justify-between items-center", children: [
519
+ /* @__PURE__ */ jsx4(Countdown, { onResend, resending: isLoading }),
520
+ /* @__PURE__ */ jsxs3(
521
+ Button3,
487
522
  {
488
- maxLength: 6,
489
- id: "otp",
490
- required: true,
491
- value: field.value ?? "",
492
- onChange: field.onChange,
493
- onBlur: field.onBlur,
494
- containerClassName: "gap-4 justify-center mb-2 flex items-center",
495
- "aria-invalid": fieldState.invalid,
496
- children: /* @__PURE__ */ jsxs3(InputOTPGroup, { className: "gap-3 *:data-[slot=input-otp-slot]:h-12 *:data-[slot=input-otp-slot]:w-12 *:data-[slot=input-otp-slot]:rounded-md *:data-[slot=input-otp-slot]:border *:data-[slot=input-otp-slot]:text-xl", children: [
497
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 0 }),
498
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 1 }),
499
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 2 }),
500
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 3 }),
501
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 4 }),
502
- /* @__PURE__ */ jsx4(InputOTPSlot, { className: "h-12", index: 5 })
503
- ] })
523
+ type: "submit",
524
+ form: "verification-form",
525
+ disabled: isLoading || form.watch("code").length !== 6,
526
+ children: [
527
+ isLoading && /* @__PURE__ */ jsx4(Spinner3, {}),
528
+ t("form.confirm")
529
+ ]
504
530
  }
505
- ) }),
506
- fieldState.invalid && /* @__PURE__ */ jsx4(FieldError, { errors: [fieldState.error] })
531
+ )
507
532
  ] })
508
- }
509
- ) }),
510
- /* @__PURE__ */ jsxs3("div", { className: "flex justify-between items-center mt-4", children: [
511
- /* @__PURE__ */ jsx4(Countdown, { onResend, resending: isLoading }),
512
- /* @__PURE__ */ jsxs3(
513
- Button3,
514
- {
515
- type: "submit",
516
- form: "verification-form",
517
- disabled: isLoading || form.watch("code").length !== 6,
518
- children: [
519
- isLoading && /* @__PURE__ */ jsx4(Spinner3, {}),
520
- t("form.confirm")
521
- ]
522
- }
523
- )
524
- ] })
525
- ] });
533
+ ]
534
+ }
535
+ ) });
526
536
  };
527
537
 
528
538
  // src/components/profile/otp-verification-modal.tsx