@mesob/auth-react 0.4.0 → 0.4.2

package/dist/chunk-OHIIMUQC.js

@@ -0,0 +1,286 @@
+import {
+  handleError
+} from "./chunk-55BMNC4S.js";
+import {
+  AuthLayout
+} from "./chunk-DPH2PHK3.js";
+import {
+  useTranslator
+} from "./chunk-QNCE2B5O.js";
+import {
+  useApi,
+  useConfig
+} from "./chunk-72YRO3A7.js";
+
+// src/components/auth/reset-password-form.tsx
+import { zodResolver } from "@hookform/resolvers/zod";
+import {
+  Alert,
+  AlertDescription,
+  AlertTitle,
+  Button,
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+  Input,
+  InputOTP,
+  InputOTPGroup,
+  InputOTPSlot,
+  useFormField
+} from "@mesob/ui/components";
+import { useMesob } from "@mesob/ui/providers";
+import { IconAlertCircle, IconEye, IconEyeOff } from "@tabler/icons-react";
+import { useEffect, useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
+import { jsx, jsxs } from "react/jsx-runtime";
+function PasswordInput({ field, show, onToggle }) {
+  const { formItemId, error } = useFormField();
+  return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        ...field,
+        id: formItemId,
+        type: show ? "text" : "password",
+        "aria-invalid": !!error,
+        className: "pr-10"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        type: "button",
+        variant: "ghost",
+        size: "icon",
+        className: "absolute right-0 top-0 h-full px-3 text-muted-foreground hover:text-foreground",
+        onClick: onToggle,
+        "aria-label": show ? "Hide password" : "Show password",
+        children: show ? /* @__PURE__ */ jsx(IconEyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(IconEye, { className: "h-4 w-4" })
+      }
+    )
+  ] });
+}
+var resetPasswordSchema = (t) => z.object({
+  code: z.string().length(6, t("errors.codeLength")),
+  password: z.string().min(8, t("errors.passwordLength")),
+  confirmPassword: z.string()
+}).refine((data) => data.password === data.confirmPassword, {
+  message: t("errors.passwordsMismatch"),
+  path: ["confirmPassword"]
+});
+var ResetPasswordForm = ({
+  verificationId,
+  redirectUrl
+}) => {
+  const { hooks, refresh } = useApi();
+  const { config } = useConfig();
+  const mesob = useMesob();
+  const Link = mesob?.navigation?.Link;
+  const t = useTranslator("Auth.resetPassword");
+  const common = useTranslator("Common");
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const [showPassword, setShowPassword] = useState(false);
+  const resetPasswordMutation = hooks.useMutation("post", "/password/reset");
+  const signInLink = config.navigation?.links?.signIn || "/auth/sign-in";
+  const forgotPasswordLink = config.navigation?.links?.forgotPassword || "/auth/forgot-password";
+  const onNavigate = config.navigation?.onNavigate || ((path) => {
+    if (typeof window !== "undefined") {
+      window.location.href = path;
+    }
+  });
+  const logoImage = config.ui.logoImage;
+  const defaultRedirect = redirectUrl || config.navigation?.defaultRedirectUrl || "/";
+  const form = useForm({
+    resolver: zodResolver(resetPasswordSchema(t)),
+    defaultValues: {
+      code: "",
+      password: "",
+      confirmPassword: ""
+    }
+  });
+  useEffect(() => {
+    if (error) {
+      toast.error(error.title || "Error", {
+        description: error.description
+      });
+    }
+  }, [error]);
+  const handleSubmit = form.handleSubmit(async (values) => {
+    if (!verificationId) {
+      setError({
+        title: t("errors.fallback"),
+        description: t("errors.missingVerificationId")
+      });
+      return;
+    }
+    setIsLoading(true);
+    setError(null);
+    try {
+      await resetPasswordMutation.mutateAsync({
+        body: {
+          verificationId,
+          code: values.code,
+          password: values.password
+        }
+      });
+      await refresh();
+      onNavigate(defaultRedirect);
+    } catch (err) {
+      handleError(err, setError, t);
+    } finally {
+      setIsLoading(false);
+    }
+  });
+  if (!verificationId) {
+    return /* @__PURE__ */ jsx(
+      AuthLayout,
+      {
+        title: common("invalidLinkTitle"),
+        description: common("invalidLinkDescription"),
+        logoImage,
+        footer: /* @__PURE__ */ jsx(
+          Link,
+          {
+            href: forgotPasswordLink,
+            className: "text-primary hover:underline",
+            children: t("footer.requestNew")
+          }
+        ),
+        children: /* @__PURE__ */ jsx("div", {})
+      }
+    );
+  }
+  let errorContent = null;
+  if (error) {
+    if (typeof error === "string") {
+      errorContent = { title: "Error", description: error };
+    } else {
+      errorContent = error;
+    }
+  }
+  return /* @__PURE__ */ jsxs(
+    AuthLayout,
+    {
+      title: config.ui.name,
+      description: t("description"),
+      logoImage,
+      footer: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between w-full gap-2", children: [
+        /* @__PURE__ */ jsx(Link, { href: signInLink, className: "text-primary hover:underline", children: t("footer.backToSignIn") }),
+        /* @__PURE__ */ jsx(
+          Link,
+          {
+            href: forgotPasswordLink,
+            className: "text-primary hover:underline",
+            children: t("footer.changeAccount")
+          }
+        )
+      ] }),
+      children: [
+        /* @__PURE__ */ jsx(Form, { ...form, children: /* @__PURE__ */ jsxs(
+          "form",
+          {
+            id: "reset-password-form",
+            onSubmit: handleSubmit,
+            className: "space-y-4",
+            children: [
+              /* @__PURE__ */ jsx(
+                FormField,
+                {
+                  control: form.control,
+                  name: "code",
+                  render: ({ field }) => /* @__PURE__ */ jsxs(FormItem, { children: [
+                    /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(FormLabel, { children: t("form.codeLabel") }) }),
+                    /* @__PURE__ */ jsx(FormControl, { children: /* @__PURE__ */ jsx(
+                      InputOTP,
+                      {
+                        maxLength: 6,
+                        value: field.value,
+                        onChange: field.onChange,
+                        onBlur: field.onBlur,
+                        containerClassName: "gap-4 flex justify-center mt-2",
+                        children: /* @__PURE__ */ jsxs(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: [
+                          /* @__PURE__ */ jsx(InputOTPSlot, { className: "h-12", index: 0 }),
+                          /* @__PURE__ */ jsx(InputOTPSlot, { className: "h-12", index: 1 }),
+                          /* @__PURE__ */ jsx(InputOTPSlot, { className: "h-12", index: 2 }),
+                          /* @__PURE__ */ jsx(InputOTPSlot, { className: "h-12", index: 3 }),
+                          /* @__PURE__ */ jsx(InputOTPSlot, { className: "h-12", index: 4 }),
+                          /* @__PURE__ */ jsx(InputOTPSlot, { className: "h-12", index: 5 })
+                        ] })
+                      }
+                    ) }),
+                    /* @__PURE__ */ jsx(FormMessage, {})
+                  ] })
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                FormField,
+                {
+                  control: form.control,
+                  name: "password",
+                  render: ({ field }) => /* @__PURE__ */ jsxs(FormItem, { children: [
+                    /* @__PURE__ */ jsx(FormLabel, { children: t("form.passwordLabel") }),
+                    /* @__PURE__ */ jsx(
+                      PasswordInput,
+                      {
+                        field,
+                        show: showPassword,
+                        onToggle: () => setShowPassword(!showPassword)
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(FormMessage, {})
+                  ] })
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                FormField,
+                {
+                  control: form.control,
+                  name: "confirmPassword",
+                  render: ({ field }) => /* @__PURE__ */ jsxs(FormItem, { children: [
+                    /* @__PURE__ */ jsx(FormLabel, { children: t("form.confirmPasswordLabel") }),
+                    /* @__PURE__ */ jsx(
+                      PasswordInput,
+                      {
+                        field,
+                        show: showPassword,
+                        onToggle: () => setShowPassword(!showPassword)
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(FormMessage, {})
+                  ] })
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  type: "submit",
+                  form: "reset-password-form",
+                  className: "w-full",
+                  disabled: isLoading || resetPasswordMutation.isPending,
+                  loading: isLoading || resetPasswordMutation.isPending,
+                  children: isLoading || resetPasswordMutation.isPending ? t("form.submitting") : t("form.submit")
+                }
+              )
+            ]
+          }
+        ) }),
+        errorContent && /* @__PURE__ */ jsxs(Alert, { variant: "destructive", className: "mt-4", children: [
+          /* @__PURE__ */ jsx(IconAlertCircle, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx(AlertTitle, { children: errorContent.title }),
+          /* @__PURE__ */ jsx(AlertDescription, { children: errorContent.description })
+        ] })
+      ]
+    }
+  );
+};
+
+export {
+  ResetPasswordForm
+};
+//# sourceMappingURL=chunk-OHIIMUQC.js.map

package/dist/chunk-OHIIMUQC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/auth/reset-password-form.tsx"],"sourcesContent":["'use client';\n\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport {\n  Alert,\n  AlertDescription,\n  AlertTitle,\n  Button,\n  Form,\n  FormControl,\n  FormField,\n  FormItem,\n  FormLabel,\n  FormMessage,\n  Input,\n  InputOTP,\n  InputOTPGroup,\n  InputOTPSlot,\n  useFormField,\n} from '@mesob/ui/components';\nimport { useMesob } from '@mesob/ui/providers';\nimport { IconAlertCircle, IconEye, IconEyeOff } from '@tabler/icons-react';\nimport type { ChangeEvent, ComponentProps } from 'react';\nimport { useEffect, useState } from 'react';\nimport { useForm } from 'react-hook-form';\nimport { toast } from 'sonner';\nimport { z } from 'zod';\nimport { useTranslator } from '../../hooks/use-translator';\nimport { useApi, useConfig } from '../../provider';\nimport type { AuthErrorContent } from '../../utils/handle-error';\nimport { handleError } from '../../utils/handle-error';\nimport { AuthLayout } from './auth-layout';\n\ntype PasswordInputProps = {\n  field: ComponentProps<'input'> & {\n    value: string;\n    onChange: (e: ChangeEvent<HTMLInputElement>) => void;\n    onBlur: () => void;\n  };\n  show: boolean;\n  onToggle: () => void;\n};\n\nfunction PasswordInput({ field, show, onToggle }: PasswordInputProps) {\n  const { formItemId, error } = useFormField();\n  return (\n    <div className=\"relative\">\n      <Input\n        {...field}\n        id={formItemId}\n        type={show ? 'text' : 'password'}\n        aria-invalid={!!error}\n        className=\"pr-10\"\n      />\n      <Button\n        type=\"button\"\n        variant=\"ghost\"\n        size=\"icon\"\n        className=\"absolute right-0 top-0 h-full px-3 text-muted-foreground hover:text-foreground\"\n        onClick={onToggle}\n        aria-label={show ? 'Hide password' : 'Show password'}\n      >\n        {show ? (\n          <IconEyeOff className=\"h-4 w-4\" />\n        ) : (\n          <IconEye className=\"h-4 w-4\" />\n        )}\n      </Button>\n    </div>\n  );\n}\n\ntype ResetPasswordFormValues = {\n  code: string;\n  password: string;\n  confirmPassword: string;\n};\n\ntype ResetPasswordFormProps = {\n  verificationId: string;\n  redirectUrl?: string;\n};\n\nconst resetPasswordSchema = (t: (key: string) => string) =>\n  z\n    .object({\n      code: z.string().length(6, t('errors.codeLength')),\n      password: z.string().min(8, t('errors.passwordLength')),\n      confirmPassword: z.string(),\n    })\n    .refine((data) => data.password === data.confirmPassword, {\n      message: t('errors.passwordsMismatch'),\n      path: ['confirmPassword'],\n    });\n\nexport const ResetPasswordForm = ({\n  verificationId,\n  redirectUrl,\n}: ResetPasswordFormProps) => {\n  const { hooks, refresh } = useApi();\n  const { config } = useConfig();\n  const mesob = useMesob();\n  const Link = mesob?.navigation?.Link;\n  const t = useTranslator('Auth.resetPassword');\n  const common = useTranslator('Common');\n  const [isLoading, setIsLoading] = useState(false);\n  const [error, setError] = useState<AuthErrorContent | null>(null);\n  const [showPassword, setShowPassword] = useState(false);\n\n  const resetPasswordMutation = hooks.useMutation('post', '/password/reset');\n\n  const signInLink = config.navigation?.links?.signIn || '/auth/sign-in';\n  const forgotPasswordLink =\n    config.navigation?.links?.forgotPassword || '/auth/forgot-password';\n  const onNavigate =\n    config.navigation?.onNavigate ||\n    ((path: string) => {\n      if (typeof window !== 'undefined') {\n        window.location.href = path;\n      }\n    });\n  const logoImage = config.ui.logoImage;\n  const defaultRedirect =\n    redirectUrl || config.navigation?.defaultRedirectUrl || '/';\n\n  const form = useForm<ResetPasswordFormValues>({\n    resolver: zodResolver(resetPasswordSchema(t)),\n    defaultValues: {\n      code: '',\n      password: '',\n      confirmPassword: '',\n    },\n  });\n\n  useEffect(() => {\n    if (error) {\n      toast.error(error.title || 'Error', {\n        description: error.description,\n      });\n    }\n  }, [error]);\n\n  const handleSubmit = form.handleSubmit(async (values) => {\n    if (!verificationId) {\n      setError({\n        title: t('errors.fallback'),\n        description: t('errors.missingVerificationId'),\n      });\n      return;\n    }\n\n    setIsLoading(true);\n    setError(null);\n\n    try {\n      await resetPasswordMutation.mutateAsync({\n        body: {\n          verificationId,\n          code: values.code,\n          password: values.password,\n        },\n      });\n      await refresh();\n      onNavigate(defaultRedirect);\n    } catch (err) {\n      handleError(err, setError, t);\n    } finally {\n      setIsLoading(false);\n    }\n  });\n\n  if (!verificationId) {\n    return (\n      <AuthLayout\n        title={common('invalidLinkTitle')}\n        description={common('invalidLinkDescription')}\n        logoImage={logoImage}\n        footer={\n          <Link\n            href={forgotPasswordLink}\n            className=\"text-primary hover:underline\"\n          >\n            {t('footer.requestNew')}\n          </Link>\n        }\n      >\n        <div />\n      </AuthLayout>\n    );\n  }\n\n  let errorContent: AuthErrorContent | null = null;\n  if (error) {\n    if (typeof error === 'string') {\n      errorContent = { title: 'Error', description: error };\n    } else {\n      errorContent = error;\n    }\n  }\n\n  return (\n    <AuthLayout\n      title={config.ui.name}\n      description={t('description')}\n      logoImage={logoImage}\n      footer={\n        <div className=\"flex items-center justify-between w-full gap-2\">\n          <Link href={signInLink} className=\"text-primary hover:underline\">\n            {t('footer.backToSignIn')}\n          </Link>\n          <Link\n            href={forgotPasswordLink}\n            className=\"text-primary hover:underline\"\n          >\n            {t('footer.changeAccount')}\n          </Link>\n        </div>\n      }\n    >\n      <Form {...form}>\n        <form\n          id=\"reset-password-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                    value={field.value}\n                    onChange={field.onChange}\n                    onBlur={field.onBlur}\n                    containerClassName=\"gap-4 flex justify-center mt-2\"\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          <FormField\n            control={form.control}\n            name=\"password\"\n            render={({ field }) => (\n              <FormItem>\n                <FormLabel>{t('form.passwordLabel')}</FormLabel>\n                <PasswordInput\n                  field={field}\n                  show={showPassword}\n                  onToggle={() => setShowPassword(!showPassword)}\n                />\n                <FormMessage />\n              </FormItem>\n            )}\n          />\n          <FormField\n            control={form.control}\n            name=\"confirmPassword\"\n            render={({ field }) => (\n              <FormItem>\n                <FormLabel>{t('form.confirmPasswordLabel')}</FormLabel>\n                <PasswordInput\n                  field={field}\n                  show={showPassword}\n                  onToggle={() => setShowPassword(!showPassword)}\n                />\n                <FormMessage />\n              </FormItem>\n            )}\n          />\n          <Button\n            type=\"submit\"\n            form=\"reset-password-form\"\n            className=\"w-full\"\n            disabled={isLoading || resetPasswordMutation.isPending}\n            loading={isLoading || resetPasswordMutation.isPending}\n          >\n            {isLoading || resetPasswordMutation.isPending\n              ? t('form.submitting')\n              : t('form.submit')}\n          </Button>\n        </form>\n      </Form>\n      {errorContent && (\n        <Alert variant=\"destructive\" className=\"mt-4\">\n          <IconAlertCircle className=\"h-4 w-4\" />\n          <AlertTitle>{errorContent.title}</AlertTitle>\n          <AlertDescription>{errorContent.description}</AlertDescription>\n        </Alert>\n      )}\n    </AuthLayout>\n  );\n};\n"],"mappings":"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","names":[]}

package/dist/chunk-OQGJX37L.js

@@ -0,0 +1,239 @@
+import {
+  useSession
+} from "./chunk-72YRO3A7.js";
+
+// src/components/profile/change-password-form.tsx
+import { zodResolver } from "@hookform/resolvers/zod";
+import {
+  Button,
+  Collapsible,
+  CollapsibleContent,
+  CollapsibleTrigger,
+  Input,
+  Label,
+  Spinner
+} from "@mesob/ui/components";
+import { IconChevronDown, IconEye, IconEyeOff } from "@tabler/icons-react";
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { z } from "zod";
+import { jsx, jsxs } from "react/jsx-runtime";
+var changePasswordSchema = z.object({
+  currentPassword: z.string().min(8, "Password must be at least 8 characters"),
+  newPassword: z.string().min(8, "Password must be at least 8 characters"),
+  confirmPassword: z.string().min(8, "Password must be at least 8 characters")
+}).refine((data) => data.newPassword === data.confirmPassword, {
+  message: "Passwords don't match",
+  path: ["confirmPassword"]
+});
+function isAuthError(error) {
+  return typeof error === "object" && error !== null && ("code" in error || "message" in error || "name" in error);
+}
+function getErrorCode(error) {
+  if (error.code) {
+    return error.code;
+  }
+  if (error.message) {
+    const upperMessage = error.message.toUpperCase().trim();
+    const validCodes = [
+      "INVALID_PASSWORD",
+      "UNAUTHORIZED",
+      "HAS_NO_PASSWORD",
+      "USER_NOT_FOUND",
+      "USER_EXISTS",
+      "VERIFICATION_EXPIRED",
+      "VERIFICATION_MISMATCH",
+      "VERIFICATION_NOT_FOUND",
+      "TOO_MANY_ATTEMPTS",
+      "REQUIRES_VERIFICATION",
+      "ACCESS_DENIED"
+    ];
+    if (validCodes.includes(upperMessage)) {
+      return upperMessage;
+    }
+  }
+  return void 0;
+}
+function getPasswordChangeErrorMessage(error) {
+  if (isAuthError(error)) {
+    const errorCode = getErrorCode(error);
+    switch (errorCode) {
+      case "INVALID_PASSWORD":
+        return "The current password you entered is incorrect. Please try again.";
+      case "UNAUTHORIZED":
+        return "You are not authorized to perform this action. Please sign in again.";
+      case "HAS_NO_PASSWORD":
+        return "Your account does not have a password set. Please use password reset instead.";
+      default:
+        return error.message || "Failed to change password. Please try again.";
+    }
+  }
+  if (error instanceof Error) {
+    return error.message;
+  }
+  return "Failed to change password. Please try again.";
+}
+function ChangePasswordForm() {
+  const { user: _user } = useSession();
+  const [isOpen, setIsOpen] = useState(false);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [showPassword, setShowPassword] = useState(false);
+  const [showNewPassword, setShowNewPassword] = useState(false);
+  const [showConfirmPassword, setShowConfirmPassword] = useState(false);
+  const form = useForm({
+    resolver: zodResolver(changePasswordSchema),
+    defaultValues: {
+      currentPassword: "",
+      newPassword: "",
+      confirmPassword: ""
+    }
+  });
+  const { register, handleSubmit, formState, reset } = form;
+  const onSubmit = (_data) => {
+    try {
+      setIsSubmitting(true);
+      toast.error("Password change unavailable");
+      setIsOpen(false);
+    } catch (error) {
+      const errorMessage = getPasswordChangeErrorMessage(error);
+      toast.error(errorMessage);
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+  return /* @__PURE__ */ jsx(Collapsible, { open: isOpen, onOpenChange: setIsOpen, children: /* @__PURE__ */ jsxs("div", { className: "border rounded-lg", children: [
+    /* @__PURE__ */ jsxs(
+      CollapsibleTrigger,
+      {
+        render: /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "ghost",
+            className: "w-full justify-between p-4 h-auto"
+          }
+        ),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-medium", children: "Change Password" }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "Update your account password" })
+          ] }),
+          /* @__PURE__ */ jsx(
+            IconChevronDown,
+            {
+              className: `h-4 w-4 transition-transform ${isOpen ? "rotate-180" : ""}`
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsxs(
+      "form",
+      {
+        onSubmit: handleSubmit(onSubmit),
+        className: "p-4 space-y-4 border-t",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2 w-full md:w-1/2", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "currentPassword", children: "Old Password" }),
+            /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+              /* @__PURE__ */ jsx(
+                Input,
+                {
+                  id: "currentPassword",
+                  type: showPassword ? "text" : "password",
+                  autoComplete: "current-password",
+                  placeholder: "Enter your current password",
+                  ...register("currentPassword")
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => setShowPassword(!showPassword),
+                  className: "absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground",
+                  children: showPassword ? /* @__PURE__ */ jsx(IconEyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(IconEye, { className: "h-4 w-4" })
+                }
+              )
+            ] }),
+            formState.errors.currentPassword && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: formState.errors.currentPassword.message })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2 w-full md:w-1/2", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "newPassword", children: "New Password" }),
+            /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+              /* @__PURE__ */ jsx(
+                Input,
+                {
+                  id: "newPassword",
+                  type: showNewPassword ? "text" : "password",
+                  placeholder: "Enter your new password",
+                  autoComplete: "new-password",
+                  ...register("newPassword")
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => setShowNewPassword(!showNewPassword),
+                  className: "absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground",
+                  children: showNewPassword ? /* @__PURE__ */ jsx(IconEyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(IconEye, { className: "h-4 w-4" })
+                }
+              )
+            ] }),
+            formState.errors.newPassword && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: formState.errors.newPassword.message })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2 w-full md:w-1/2", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "confirmPassword", children: "Confirm New Password" }),
+            /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+              /* @__PURE__ */ jsx(
+                Input,
+                {
+                  id: "confirmPassword",
+                  type: showConfirmPassword ? "text" : "password",
+                  placeholder: "Confirm your new password",
+                  autoComplete: "new-password",
+                  ...register("confirmPassword")
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => setShowConfirmPassword(!showConfirmPassword),
+                  className: "absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground",
+                  children: showConfirmPassword ? /* @__PURE__ */ jsx(IconEyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(IconEye, { className: "h-4 w-4" })
+                }
+              )
+            ] }),
+            formState.errors.confirmPassword && /* @__PURE__ */ jsx("p", { className: "text-sm text-destructive", children: formState.errors.confirmPassword.message })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "button",
+                variant: "outline",
+                onClick: () => {
+                  reset();
+                  setIsOpen(false);
+                },
+                disabled: isSubmitting,
+                children: "Cancel"
+              }
+            ),
+            /* @__PURE__ */ jsxs(Button, { type: "submit", disabled: isSubmitting, children: [
+              isSubmitting && /* @__PURE__ */ jsx(Spinner, { className: "mr-2 h-4 w-4" }),
+              "Change Password"
+            ] })
+          ] })
+        ]
+      }
+    ) })
+  ] }) });
+}
+
+export {
+  ChangePasswordForm
+};
+//# sourceMappingURL=chunk-OQGJX37L.js.map

package/dist/chunk-OQGJX37L.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/profile/change-password-form.tsx"],"sourcesContent":["'use client';\n\nimport { zodResolver } from '@hookform/resolvers/zod';\nimport {\n  Button,\n  Collapsible,\n  CollapsibleContent,\n  CollapsibleTrigger,\n  Input,\n  Label,\n  Spinner,\n} from '@mesob/ui/components';\nimport { IconChevronDown, IconEye, IconEyeOff } from '@tabler/icons-react';\nimport { useState } from 'react';\nimport { useForm } from 'react-hook-form';\nimport { toast } from 'sonner';\nimport { z } from 'zod';\nimport { useSession } from '../../provider';\n\nconst changePasswordSchema = z\n  .object({\n    currentPassword: z\n      .string()\n      .min(8, 'Password must be at least 8 characters'),\n    newPassword: z.string().min(8, 'Password must be at least 8 characters'),\n    confirmPassword: z\n      .string()\n      .min(8, 'Password must be at least 8 characters'),\n  })\n  .refine((data) => data.newPassword === data.confirmPassword, {\n    message: \"Passwords don't match\",\n    path: ['confirmPassword'],\n  });\n\ntype ChangePasswordFormData = z.infer<typeof changePasswordSchema>;\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      'INVALID_PASSWORD',\n      'UNAUTHORIZED',\n      'HAS_NO_PASSWORD',\n      'USER_NOT_FOUND',\n      'USER_EXISTS',\n      'VERIFICATION_EXPIRED',\n      'VERIFICATION_MISMATCH',\n      'VERIFICATION_NOT_FOUND',\n      'TOO_MANY_ATTEMPTS',\n      'REQUIRES_VERIFICATION',\n      'ACCESS_DENIED',\n    ];\n    if (validCodes.includes(upperMessage)) {\n      return upperMessage;\n    }\n  }\n  return undefined;\n}\n\nfunction getPasswordChangeErrorMessage(error: unknown): string {\n  if (isAuthError(error)) {\n    const errorCode = getErrorCode(error);\n    switch (errorCode) {\n      case 'INVALID_PASSWORD':\n        return 'The current password you entered is incorrect. Please try again.';\n      case 'UNAUTHORIZED':\n        return 'You are not authorized to perform this action. Please sign in again.';\n      case 'HAS_NO_PASSWORD':\n        return 'Your account does not have a password set. Please use password reset instead.';\n      default:\n        return error.message || 'Failed to change password. Please try again.';\n    }\n  }\n  if (error instanceof Error) {\n    return error.message;\n  }\n  return 'Failed to change password. Please try again.';\n}\n\nexport function ChangePasswordForm() {\n  const { user: _user } = useSession();\n  const [isOpen, setIsOpen] = useState(false);\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const [showPassword, setShowPassword] = useState(false);\n  const [showNewPassword, setShowNewPassword] = useState(false);\n  const [showConfirmPassword, setShowConfirmPassword] = useState(false);\n\n  const form = useForm<ChangePasswordFormData>({\n    resolver: zodResolver(changePasswordSchema),\n    defaultValues: {\n      currentPassword: '',\n      newPassword: '',\n      confirmPassword: '',\n    },\n  });\n\n  const { register, handleSubmit, formState, reset } = form;\n\n  const onSubmit = (_data: ChangePasswordFormData) => {\n    try {\n      setIsSubmitting(true);\n      toast.error('Password change unavailable');\n      setIsOpen(false);\n    } catch (error) {\n      const errorMessage = getPasswordChangeErrorMessage(error);\n      toast.error(errorMessage);\n    } finally {\n      setIsSubmitting(false);\n    }\n  };\n\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\">Change Password</span>\n            <span className=\"text-sm text-muted-foreground\">\n              Update your account password\n            </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          <form\n            onSubmit={handleSubmit(onSubmit)}\n            className=\"p-4 space-y-4 border-t\"\n          >\n            <div className=\"space-y-2 w-full md:w-1/2\">\n              <Label htmlFor=\"currentPassword\">Old Password</Label>\n              <div className=\"relative\">\n                <Input\n                  id=\"currentPassword\"\n                  type={showPassword ? 'text' : 'password'}\n                  autoComplete=\"current-password\"\n                  placeholder=\"Enter your current password\"\n                  {...register('currentPassword')}\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                >\n                  {showPassword ? (\n                    <IconEyeOff className=\"h-4 w-4\" />\n                  ) : (\n                    <IconEye className=\"h-4 w-4\" />\n                  )}\n                </button>\n              </div>\n              {formState.errors.currentPassword && (\n                <p className=\"text-sm text-destructive\">\n                  {formState.errors.currentPassword.message}\n                </p>\n              )}\n            </div>\n\n            <div className=\"space-y-2 w-full md:w-1/2\">\n              <Label htmlFor=\"newPassword\">New Password</Label>\n              <div className=\"relative\">\n                <Input\n                  id=\"newPassword\"\n                  type={showNewPassword ? 'text' : 'password'}\n                  placeholder=\"Enter your new password\"\n                  autoComplete=\"new-password\"\n                  {...register('newPassword')}\n                />\n\n                <button\n                  type=\"button\"\n                  onClick={() => setShowNewPassword(!showNewPassword)}\n                  className=\"absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground\"\n                >\n                  {showNewPassword ? (\n                    <IconEyeOff className=\"h-4 w-4\" />\n                  ) : (\n                    <IconEye className=\"h-4 w-4\" />\n                  )}\n                </button>\n              </div>\n              {formState.errors.newPassword && (\n                <p className=\"text-sm text-destructive\">\n                  {formState.errors.newPassword.message}\n                </p>\n              )}\n            </div>\n\n            <div className=\"space-y-2 w-full md:w-1/2\">\n              <Label htmlFor=\"confirmPassword\">Confirm New Password</Label>\n              <div className=\"relative\">\n                <Input\n                  id=\"confirmPassword\"\n                  type={showConfirmPassword ? 'text' : 'password'}\n                  placeholder=\"Confirm your new password\"\n                  autoComplete=\"new-password\"\n                  {...register('confirmPassword')}\n                />\n\n                <button\n                  type=\"button\"\n                  onClick={() => setShowConfirmPassword(!showConfirmPassword)}\n                  className=\"absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground\"\n                >\n                  {showConfirmPassword ? (\n                    <IconEyeOff className=\"h-4 w-4\" />\n                  ) : (\n                    <IconEye className=\"h-4 w-4\" />\n                  )}\n                </button>\n              </div>\n              {formState.errors.confirmPassword && (\n                <p className=\"text-sm text-destructive\">\n                  {formState.errors.confirmPassword.message}\n                </p>\n              )}\n            </div>\n\n            <div className=\"flex justify-end gap-2\">\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                onClick={() => {\n                  reset();\n                  setIsOpen(false);\n                }}\n                disabled={isSubmitting}\n              >\n                Cancel\n              </Button>\n              <Button type=\"submit\" disabled={isSubmitting}>\n                {isSubmitting && <Spinner className=\"mr-2 h-4 w-4\" />}\n                Change Password\n              </Button>\n            </div>\n          </form>\n        </CollapsibleContent>\n      </div>\n    </Collapsible>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-OYHH7HQG.js

@@ -0,0 +1,65 @@
+import {
+  ChangePhoneForm
+} from "./chunk-5F5FZMHE.js";
+import {
+  ChangeEmailForm
+} from "./chunk-MS2JUZ3N.js";
+import {
+  ChangePasswordForm
+} from "./chunk-OQGJX37L.js";
+import {
+  useSession
+} from "./chunk-72YRO3A7.js";
+
+// src/components/profile/security.tsx
+import { Badge, Card, CardContent, Separator } from "@mesob/ui/components";
+import { jsx, jsxs } from "react/jsx-runtime";
+function Security() {
+  const { user } = useSession();
+  return /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-6xl flex-col gap-6", children: [
+    /* @__PURE__ */ jsxs("div", { className: "relative overflow-hidden rounded-[2rem] border border-border/60 bg-gradient-to-br from-background via-background to-amber-500/5 p-6 shadow-sm", children: [
+      /* @__PURE__ */ jsx("div", { className: "absolute left-0 top-0 h-32 w-32 rounded-full bg-primary/10 blur-3xl" }),
+      /* @__PURE__ */ jsxs("div", { className: "relative flex flex-col gap-4", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2", children: [
+          /* @__PURE__ */ jsx(Badge, { variant: "outline", children: "Security center" }),
+          /* @__PURE__ */ jsx(Badge, { variant: "secondary", children: user?.emailVerified || user?.phoneVerified ? "Recovery methods available" : "Add a recovery method" })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx("h1", { className: "text-2xl font-semibold tracking-tight", children: "Security" }),
+          /* @__PURE__ */ jsx("p", { className: "max-w-2xl text-sm text-muted-foreground", children: "Password, email, and phone updates all live here. Keep recovery channels current so account recovery stays predictable." })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "grid gap-4 lg:grid-cols-[0.85fr_1.4fr]", children: [
+      /* @__PURE__ */ jsx(Card, { className: "rounded-[1.75rem] border-border/60 shadow-sm", children: /* @__PURE__ */ jsxs(CardContent, { className: "space-y-5 p-6", children: [
+        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+          /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-muted-foreground", children: "Verification state" }),
+          /* @__PURE__ */ jsx("div", { className: "text-lg font-semibold", children: "Recovery readiness" })
+        ] }),
+        /* @__PURE__ */ jsx(Separator, {}),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "rounded-2xl border border-border/60 bg-muted/20 p-4", children: [
+            /* @__PURE__ */ jsx("div", { className: "text-sm font-medium", children: "Email" }),
+            /* @__PURE__ */ jsx("div", { className: "mt-1 text-sm text-muted-foreground", children: user?.email ?? "No email added" }),
+            /* @__PURE__ */ jsx("div", { className: "mt-3", children: /* @__PURE__ */ jsx(Badge, { variant: "outline", children: user?.emailVerified ? "Verified" : "Unverified" }) })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "rounded-2xl border border-border/60 bg-muted/20 p-4", children: [
+            /* @__PURE__ */ jsx("div", { className: "text-sm font-medium", children: "Phone" }),
+            /* @__PURE__ */ jsx("div", { className: "mt-1 text-sm text-muted-foreground", children: user?.phone ?? "No phone added" }),
+            /* @__PURE__ */ jsx("div", { className: "mt-3", children: /* @__PURE__ */ jsx(Badge, { variant: "outline", children: user?.phoneVerified ? "Verified" : "Unverified" }) })
+          ] })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsx(ChangePasswordForm, {}),
+        /* @__PURE__ */ jsx(ChangeEmailForm, {}),
+        /* @__PURE__ */ jsx(ChangePhoneForm, {})
+      ] })
+    ] })
+  ] });
+}
+
+export {
+  Security
+};
+//# sourceMappingURL=chunk-OYHH7HQG.js.map