@alepha/ui 0.13.2 → 0.13.4

package/dist/auth/ResetPassword-tO0oMzfo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ResetPassword-tO0oMzfo.js","names":[],"sources":["../../src/auth/components/ResetPassword.tsx"],"sourcesContent":["import { useClient, useRouter } from \"@alepha/react\";\nimport { useForm } from \"@alepha/react/form\";\nimport { useI18n } from \"@alepha/react/i18n\";\nimport { ActionButton, Control } from \"@alepha/ui\";\nimport { Alert, Card, Flex, PinInput, Stack, Text } from \"@mantine/core\";\nimport {\n  IconAlertCircle,\n  IconCheck,\n  IconInfoCircle,\n  IconLock,\n  IconMail,\n} from \"@tabler/icons-react\";\nimport { AlephaError, t } from \"alepha\";\nimport type {\n  PasswordResetIntentResponse,\n  UserController,\n  UserRealmConfig,\n} from \"alepha/api/users\";\nimport { resetPasswordRequestSchema } from \"alepha/api/users\";\nimport { useState } from \"react\";\nimport type { AuthI18n } from \"../AuthI18n.ts\";\nimport type { AuthRouter } from \"../AuthRouter.ts\";\n\nexport interface ResetPasswordProps {\n  realmConfig: UserRealmConfig;\n}\n\ntype Step = \"email\" | \"code\" | \"password\" | \"success\";\n\ninterface ResetState {\n  step: Step;\n  intent?: PasswordResetIntentResponse;\n  email?: string;\n  code?: string;\n}\n\nconst ResetPassword = (props: ResetPasswordProps) => {\n  const router = useRouter<AuthRouter>();\n  const userCtrl = useClient<UserController>();\n  const { tr } = useI18n<AuthI18n, \"en\">();\n  const [resetState, setResetState] = useState<ResetState>({ step: \"email\" });\n  const [error, setError] = useState<string | null>(null);\n  const [isSubmitting, setIsSubmitting] = useState(false);\n  const redirect = router.query.redirect || \"/\";\n\n  const isResetPasswordAllowed =\n    props.realmConfig.settings?.resetPasswordAllowed !== false;\n\n  // Phase 1: Request password reset intent\n  const emailForm = useForm({\n    schema: resetPasswordRequestSchema,\n    handler: async (data) => {\n      setError(null);\n      const intent = await userCtrl.createPasswordResetIntent({\n        body: { email: data.email },\n      });\n\n      setResetState({\n        step: \"code\",\n        intent,\n        email: data.email,\n      });\n    },\n  });\n\n  // Phase 2: Complete password reset\n  const passwordForm = useForm(\n    {\n      schema: t.object({\n        password: t.string({ minLength: 8 }),\n        confirmPassword: t.string({ minLength: 8 }),\n      }),\n      handler: async (data) => {\n        if (data.password !== data.confirmPassword) {\n          throw new AlephaError(\"Passwords do not match\");\n        }\n\n        if (!resetState.intent || !resetState.code) {\n          throw new AlephaError(\"Invalid reset state\");\n        }\n\n        await userCtrl.completePasswordReset({\n          body: {\n            intentId: resetState.intent.intentId,\n            code: resetState.code,\n            newPassword: data.password,\n          },\n        });\n\n        setResetState({ step: \"success\" });\n      },\n    },\n    [resetState.intent, resetState.code],\n  );\n\n  const handleCodeComplete = (value: string) => {\n    if (value.length === 6) {\n      setResetState((prev) => ({\n        ...prev,\n        step: \"password\",\n        code: value,\n      }));\n    }\n  };\n\n  const handleResendCode = async () => {\n    if (!resetState.email) return;\n\n    setIsSubmitting(true);\n    setError(null);\n\n    try {\n      const intent = await userCtrl.createPasswordResetIntent({\n        body: { email: resetState.email },\n      });\n\n      setResetState((prev) => ({\n        ...prev,\n        intent,\n      }));\n    } catch (err) {\n      setError(err instanceof Error ? err.message : \"Failed to resend code\");\n    } finally {\n      setIsSubmitting(false);\n    }\n  };\n\n  return (\n    <Flex flex={1} justify={\"center\"} align={\"center\"}>\n      <Stack gap={\"sm\"} w={360}>\n        <Card withBorder p={\"lg\"} bg={\"var(--alepha-elevated)\"}>\n          <Stack gap={\"md\"}>\n            {error && (\n              <Alert variant=\"light\" color=\"red\" icon={<IconAlertCircle />}>\n                <Text size=\"sm\">{error}</Text>\n              </Alert>\n            )}\n\n            {!isResetPasswordAllowed ? (\n              <>\n                <Alert\n                  variant=\"light\"\n                  color=\"yellow\"\n                  icon={<IconAlertCircle />}\n                >\n                  <Text size=\"sm\">{tr(\"resetPasswordDisabled\")}</Text>\n                </Alert>\n                <ActionButton href={router.path(\"login\")}>\n                  {tr(\"resetPasswordBackToSignIn\")}\n                </ActionButton>\n              </>\n            ) : resetState.step === \"email\" ? (\n              <form {...emailForm.props}>\n                <Stack flex={1} gap={\"md\"}>\n                  <Text size=\"lg\" fw={500} ta=\"center\">\n                    {tr(\"resetPasswordTitle\")}\n                  </Text>\n                  <Text size=\"sm\" c=\"dimmed\">\n                    {tr(\"resetPasswordEnterEmail\")}\n                  </Text>\n                  <Control\n                    title={tr(\"resetPasswordEmail\")}\n                    input={emailForm.input.email}\n                    icon={<IconMail />}\n                    text={{\n                      autoComplete: \"email\",\n                      autoFocus: true,\n                      disabled: !isResetPasswordAllowed,\n                    }}\n                  />\n                  <ActionButton\n                    form={emailForm}\n                    disabled={!isResetPasswordAllowed}\n                  >\n                    {tr(\"resetPasswordSendCode\")}\n                  </ActionButton>\n                </Stack>\n              </form>\n            ) : resetState.step === \"code\" ? (\n              <Stack gap={\"md\"}>\n                <Text size=\"lg\" fw={500} ta=\"center\">\n                  {tr(\"resetPasswordTitle\")}\n                </Text>\n                <Alert variant=\"light\" color=\"blue\" icon={<IconInfoCircle />}>\n                  <Text size=\"sm\">{tr(\"resetPasswordCodeSent\")}</Text>\n                </Alert>\n                <Text size=\"sm\" c=\"dimmed\" ta=\"center\">\n                  {tr(\"resetPasswordEnterCode\")}\n                </Text>\n                <Flex justify=\"center\">\n                  <PinInput\n                    length={6}\n                    type=\"number\"\n                    autoFocus\n                    oneTimeCode\n                    onComplete={handleCodeComplete}\n                    aria-label=\"Password reset verification code\"\n                  />\n                </Flex>\n                <ActionButton\n                  variant=\"subtle\"\n                  onClick={handleResendCode}\n                  loading={isSubmitting}\n                >\n                  {tr(\"resetPasswordResendCode\")}\n                </ActionButton>\n              </Stack>\n            ) : resetState.step === \"password\" ? (\n              <form {...passwordForm.props}>\n                <Stack flex={1} gap={\"md\"}>\n                  <Text size=\"lg\" fw={500} ta=\"center\">\n                    {tr(\"resetPasswordTitle\")}\n                  </Text>\n                  <Text size=\"sm\" c=\"dimmed\">\n                    {tr(\"resetPasswordEnterNewPassword\")}\n                  </Text>\n                  <Control\n                    title={tr(\"resetPasswordNewPassword\")}\n                    input={passwordForm.input.password}\n                    icon={<IconLock />}\n                    password={{\n                      autoComplete: \"new-password\",\n                      autoFocus: true,\n                    }}\n                  />\n                  <Control\n                    title={tr(\"resetPasswordConfirmPassword\")}\n                    input={passwordForm.input.confirmPassword}\n                    icon={<IconLock />}\n                    password={{\n                      autoComplete: \"new-password\",\n                    }}\n                  />\n                  <ActionButton form={passwordForm}>\n                    {tr(\"resetPasswordSetNewPassword\")}\n                  </ActionButton>\n                </Stack>\n              </form>\n            ) : (\n              <>\n                <Alert variant=\"light\" color=\"green\" icon={<IconCheck />}>\n                  <Text size=\"sm\">{tr(\"resetPasswordSuccess\")}</Text>\n                </Alert>\n                <ActionButton href={router.path(\"login\")}>\n                  {tr(\"resetPasswordBackToSignIn\")}\n                </ActionButton>\n              </>\n            )}\n          </Stack>\n        </Card>\n        <ActionButton variant={\"subtle\"} href={redirect}>\n          {tr(\"resetPasswordCancel\")}\n        </ActionButton>\n      </Stack>\n    </Flex>\n  );\n};\n\nexport default ResetPassword;\n"],"mappings":"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"}