@datatechsolutions/ui 2.11.86 → 2.11.88

package/dist/chunk-5HXDJBVX.mjs

@@ -0,0 +1,1330 @@
+"use client";
+import { OtpInput, SocialLoginButtons, AuthLayout, PasswordStrengthMeter } from './chunk-NBCOVUQP.mjs';
+import { SegmentedControl, Spinner, Input, Button, Card, PasswordInput, FormCheckbox, EmptyState, BaseForm, CardContent, Avatar, Badge, ListCard, ListCardItem, InlineSpinner, DynamicIslandConfirm } from './chunk-ZJQ5RLGK.mjs';
+import { triggerHaptic } from './chunk-D2JF6C3E.mjs';
+import { useTranslations } from './chunk-7VJ7CMMT.mjs';
+import { useState, useCallback, useEffect, Fragment as Fragment$1 } from 'react';
+import { EnvelopeIcon, UserIcon, LockClosedIcon, CheckCircleIcon, DevicePhoneMobileIcon, PaperAirplaneIcon, ShieldExclamationIcon, BuildingOffice2Icon } from '@heroicons/react/24/outline';
+import { useAuth, useSocialProviders } from '@datatechsolutions/windsock/client';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { ChevronRightIcon, ChevronUpDownIcon, ArrowRightStartOnRectangleIcon } from '@heroicons/react/20/solid';
+import { Menu, Transition } from '@headlessui/react';
+
+function MfaChallenge({
+  mfaToken,
+  onSuccess,
+  onCancel,
+  availableMethods = ["totp", "backup"],
+  embedded = false
+}) {
+  const t = useTranslations("windsock");
+  const { verifyMFA } = useAuth();
+  const [method, setMethod] = useState("totp");
+  const [totpCode, setTotpCode] = useState("");
+  const [backupCode, setBackupCode] = useState("");
+  const [error, setError] = useState(null);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [failureCount, setFailureCount] = useState(0);
+  const handleVerify = useCallback(
+    async (code) => {
+      setError(null);
+      setIsSubmitting(true);
+      triggerHaptic("light");
+      try {
+        const result = await verifyMFA(mfaToken, code);
+        if (result.success) {
+          triggerHaptic("success");
+          onSuccess?.();
+        } else if (result.error) {
+          triggerHaptic("error");
+          const count = failureCount + 1;
+          setFailureCount(count);
+          if (count >= 3) {
+            setError(t("mfa.challenge.errorLockout"));
+          } else {
+            setError(t("mfa.challenge.errorInvalidCode"));
+          }
+        }
+      } catch {
+        triggerHaptic("error");
+        setError(t("mfa.challenge.errorVerificationFailed"));
+      } finally {
+        setIsSubmitting(false);
+      }
+    },
+    [verifyMFA, mfaToken, onSuccess, failureCount, t]
+  );
+  const handleTotpComplete = useCallback(
+    (code) => {
+      handleVerify(code);
+    },
+    [handleVerify]
+  );
+  const handleBackupSubmit = useCallback(() => {
+    if (backupCode.trim()) {
+      handleVerify(backupCode.trim());
+    }
+  }, [backupCode, handleVerify]);
+  const handleMethodChange = useCallback((value) => {
+    triggerHaptic("light");
+    setMethod(value);
+    setError(null);
+    setTotpCode("");
+    setBackupCode("");
+  }, []);
+  const segments = availableMethods.map((m) => ({
+    value: m,
+    label: m === "totp" ? t("mfa.challenge.methodTotp") : t("mfa.challenge.methodBackup")
+  }));
+  const content = /* @__PURE__ */ jsxs("div", { className: "space-y-5", children: [
+    /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-xl font-semibold text-gray-900 dark:text-white", children: t("mfa.challenge.title") }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500 dark:text-gray-400", children: method === "totp" ? t("mfa.challenge.descriptionTotp") : t("mfa.challenge.descriptionBackup") })
+    ] }),
+    availableMethods.length > 1 && /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(
+      SegmentedControl,
+      {
+        segments,
+        value: method,
+        onChange: handleMethodChange,
+        size: "sm"
+      }
+    ) }),
+    failureCount >= 3 && /* @__PURE__ */ jsx("div", { className: "rounded-xl border border-red-500/30 bg-red-500/10 px-4 py-3 text-sm text-red-600 dark:text-red-400 text-center", children: t("mfa.challenge.lockoutWarning") }),
+    method === "totp" && /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsx(
+        OtpInput,
+        {
+          value: totpCode,
+          onChange: setTotpCode,
+          onComplete: handleTotpComplete,
+          error: error ?? void 0,
+          disabled: isSubmitting,
+          autoFocus: true
+        }
+      ),
+      isSubmitting && /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(Spinner, {}) })
+    ] }),
+    method === "backup" && /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          value: backupCode,
+          onChange: (event) => setBackupCode(event.target.value),
+          placeholder: t("mfa.challenge.backupCodePlaceholder"),
+          error: error ?? void 0,
+          disabled: isSubmitting,
+          autoFocus: true,
+          className: "font-mono text-center tracking-widest"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          color: "ios-glass-blue",
+          fullWidth: true,
+          onClick: handleBackupSubmit,
+          disabled: !backupCode.trim() || isSubmitting,
+          loading: isSubmitting,
+          children: t("mfa.challenge.verifyBackupCode")
+        }
+      )
+    ] }),
+    onCancel && /* @__PURE__ */ jsx("div", { className: "text-center", children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => {
+          triggerHaptic("light");
+          onCancel();
+        },
+        className: "text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200 transition-colors",
+        children: t("mfa.challenge.useDifferentAccount")
+      }
+    ) })
+  ] });
+  if (embedded) return content;
+  return /* @__PURE__ */ jsx(Card, { variant: "glass", className: "mx-auto max-w-md p-6 sm:p-8", children: content });
+}
+function SignIn({
+  onSuccess,
+  onSignUp,
+  onForgotPassword,
+  onPasswordless,
+  socialProviders,
+  allowPasswordless,
+  defaultEmail = "",
+  embedded = false,
+  heroPanel
+}) {
+  const t = useTranslations("windsock");
+  const { loginWithCredentials, loginWithProvider } = useAuth();
+  const discovered = useSocialProviders();
+  const effectiveSocialProviders = socialProviders ?? discovered.providers;
+  const [email, setEmail] = useState(defaultEmail);
+  const [password, setPassword] = useState("");
+  const [error, setError] = useState(null);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [mfaRequired, setMfaRequired] = useState(null);
+  const [socialLoading, setSocialLoading] = useState(null);
+  const handleSubmit = useCallback(
+    async (event) => {
+      event.preventDefault();
+      setError(null);
+      setIsSubmitting(true);
+      try {
+        const result = await loginWithCredentials(email, password);
+        if (result.success) {
+          onSuccess?.();
+        } else if (result.mfaRequired && result.mfaToken) {
+          setMfaRequired({ mfaToken: result.mfaToken });
+        } else if (result.error) {
+          setError(t("signInError"));
+        }
+      } catch {
+        setError(t("signInError"));
+      } finally {
+        setIsSubmitting(false);
+      }
+    },
+    [email, password, loginWithCredentials, onSuccess, t]
+  );
+  const handleSocialLogin = useCallback((provider) => {
+    setSocialLoading(provider);
+    loginWithProvider(provider);
+  }, [loginWithProvider]);
+  if (mfaRequired) {
+    return /* @__PURE__ */ jsx(
+      MfaChallenge,
+      {
+        mfaToken: mfaRequired.mfaToken,
+        onSuccess,
+        onCancel: () => setMfaRequired(null),
+        embedded
+      }
+    );
+  }
+  const content = /* @__PURE__ */ jsxs("div", { className: "space-y-5", children: [
+    /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-2xl font-bold text-gray-900 dark:text-white", children: t("signInTitle") }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500 dark:text-gray-400", children: t("signInSubtitle") })
+    ] }),
+    error && /* @__PURE__ */ jsx("div", { className: "rounded-xl bg-red-50 dark:bg-red-900/20 px-4 py-3 text-sm text-ios-red", role: "alert", children: error }),
+    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          label: t("emailLabel"),
+          type: "email",
+          value: email,
+          onChange: (event) => setEmail(event.target.value),
+          placeholder: t("emailPlaceholder"),
+          autoComplete: "email",
+          disabled: isSubmitting,
+          required: true
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        PasswordInput,
+        {
+          label: t("passwordLabel"),
+          value: password,
+          onChange: (event) => setPassword(event.target.value),
+          placeholder: t("passwordPlaceholder"),
+          autoComplete: "current-password",
+          disabled: isSubmitting,
+          required: true
+        }
+      ),
+      onForgotPassword && /* @__PURE__ */ jsx("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: onForgotPassword,
+          className: "text-sm font-medium text-ios-blue hover:text-blue-700 dark:hover:text-blue-400 transition-colors",
+          children: t("forgotPassword")
+        }
+      ) }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "submit",
+          color: "ios-glass-green",
+          size: "lg",
+          fullWidth: true,
+          disabled: isSubmitting || !email || !password,
+          loading: isSubmitting,
+          children: t("signInButton")
+        }
+      )
+    ] }),
+    effectiveSocialProviders.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsx("div", { className: "w-full border-t border-gray-200/60 dark:border-white/10" }) }),
+        /* @__PURE__ */ jsx("div", { className: "relative flex justify-center text-xs", children: /* @__PURE__ */ jsx("span", { className: "bg-white/80 px-3 text-gray-400 dark:bg-gray-900/80 dark:text-gray-500", children: t("orContinueWith") }) })
+      ] }),
+      /* @__PURE__ */ jsx(
+        SocialLoginButtons,
+        {
+          providers: [...effectiveSocialProviders],
+          onProviderClick: handleSocialLogin,
+          loading: socialLoading,
+          disabled: isSubmitting
+        }
+      )
+    ] }),
+    allowPasswordless && /* @__PURE__ */ jsxs(
+      Button,
+      {
+        type: "button",
+        color: "ios-glass-blue",
+        size: "lg",
+        fullWidth: true,
+        onClick: onPasswordless,
+        children: [
+          /* @__PURE__ */ jsx(EnvelopeIcon, { className: "h-5 w-5" }),
+          t("signInPasswordless")
+        ]
+      }
+    ),
+    onSignUp && /* @__PURE__ */ jsxs("p", { className: "text-center text-sm text-gray-500 dark:text-gray-400", children: [
+      t("noAccount"),
+      " ",
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: onSignUp,
+          className: "font-medium text-ios-blue hover:text-blue-700 dark:hover:text-blue-400 transition-colors",
+          children: t("signUpLink")
+        }
+      )
+    ] })
+  ] });
+  if (embedded) return content;
+  return /* @__PURE__ */ jsx(AuthLayout, { heroPanel, children: content });
+}
+var RESEND_COOLDOWN_SECONDS = 60;
+function VerifyEmail({
+  email,
+  onSuccess,
+  onResend,
+  embedded = false
+}) {
+  const t = useTranslations("windsock");
+  const { client } = useAuth();
+  const [code, setCode] = useState("");
+  const [error, setError] = useState(null);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [isResending, setIsResending] = useState(false);
+  const [cooldown, setCooldown] = useState(RESEND_COOLDOWN_SECONDS);
+  useEffect(() => {
+    if (cooldown <= 0) return;
+    const timer = setInterval(() => {
+      setCooldown((previous) => {
+        if (previous <= 1) {
+          clearInterval(timer);
+          return 0;
+        }
+        return previous - 1;
+      });
+    }, 1e3);
+    return () => clearInterval(timer);
+  }, [cooldown]);
+  const handleComplete = useCallback(
+    async (completedCode) => {
+      setError(null);
+      setIsSubmitting(true);
+      try {
+        await client.verifyEmail(email, completedCode);
+        onSuccess?.();
+      } catch {
+        setError(t("verifyEmailError"));
+        setCode("");
+      } finally {
+        setIsSubmitting(false);
+      }
+    },
+    [client, email, onSuccess, t]
+  );
+  const handleResend = useCallback(async () => {
+    if (cooldown > 0 || isResending) return;
+    setIsResending(true);
+    setError(null);
+    try {
+      onResend?.();
+      setCooldown(RESEND_COOLDOWN_SECONDS);
+    } catch {
+      setError(t("resendEmailError"));
+    } finally {
+      setIsResending(false);
+    }
+  }, [cooldown, isResending, onResend, t]);
+  const content = /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-3 text-center", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex h-16 w-16 items-center justify-center rounded-full bg-blue-50 dark:bg-blue-500/10", children: /* @__PURE__ */ jsx(EnvelopeIcon, { className: "h-8 w-8 text-ios-blue" }) }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h2", { className: "text-xl font-bold text-gray-900 dark:text-white", children: t("verifyEmailTitle") }),
+        /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500 dark:text-gray-400", children: t("verifyEmailSubtitle", { email }) })
+      ] })
+    ] }),
+    error && /* @__PURE__ */ jsx("div", { className: "rounded-xl bg-red-50 dark:bg-red-900/20 px-4 py-3 text-sm text-ios-red text-center", role: "alert", children: error }),
+    /* @__PURE__ */ jsx(
+      OtpInput,
+      {
+        value: code,
+        onChange: setCode,
+        onComplete: handleComplete,
+        error: error ?? void 0,
+        disabled: isSubmitting,
+        autoFocus: true
+      }
+    ),
+    isSubmitting && /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(Spinner, {}) }),
+    /* @__PURE__ */ jsxs("div", { className: "text-center space-y-1", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 dark:text-gray-400", children: t("verifyEmailNoCode") }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          outline: true,
+          onClick: handleResend,
+          disabled: cooldown > 0 || isResending || isSubmitting,
+          loading: isResending,
+          children: cooldown > 0 ? t("resendEmailCooldown", { seconds: cooldown }) : t("resendEmailButton")
+        }
+      )
+    ] })
+  ] });
+  if (embedded) return content;
+  return /* @__PURE__ */ jsx(Card, { variant: "glass", className: "mx-auto max-w-md p-6 sm:p-8", children: content });
+}
+function SignUp({
+  onSuccess,
+  onSignIn,
+  socialProviders,
+  passwordPolicy,
+  embedded = false,
+  heroPanel
+}) {
+  const t = useTranslations("windsock");
+  const { client, loginWithProvider } = useAuth();
+  const discovered = useSocialProviders();
+  const effectiveSocialProviders = socialProviders ?? discovered.providers;
+  const [phase, setPhase] = useState("form");
+  const [registeredEmail, setRegisteredEmail] = useState("");
+  const [name, setName] = useState("");
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [termsAccepted, setTermsAccepted] = useState(false);
+  const [error, setError] = useState(null);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [socialLoading, setSocialLoading] = useState(null);
+  const handleSubmit = useCallback(
+    async (event) => {
+      event.preventDefault();
+      setError(null);
+      setIsSubmitting(true);
+      try {
+        await client.register({ name, email, password });
+        setRegisteredEmail(email);
+        setPhase("verify");
+      } catch {
+        setError(t("signUpError"));
+      } finally {
+        setIsSubmitting(false);
+      }
+    },
+    [client, name, email, password, t]
+  );
+  const handleSocialLogin = useCallback((provider) => {
+    setSocialLoading(provider);
+    loginWithProvider(provider);
+  }, [loginWithProvider]);
+  if (phase === "verify") {
+    return /* @__PURE__ */ jsx(
+      VerifyEmail,
+      {
+        email: registeredEmail,
+        onSuccess,
+        embedded
+      }
+    );
+  }
+  const isFormValid = name.trim() !== "" && email.trim() !== "" && password !== "" && termsAccepted;
+  const content = /* @__PURE__ */ jsxs("div", { className: "space-y-5", children: [
+    /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-2xl font-bold text-gray-900 dark:text-white", children: t("signUpTitle") }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500 dark:text-gray-400", children: t("signUpSubtitle") })
+    ] }),
+    error && /* @__PURE__ */ jsx("div", { className: "rounded-xl bg-red-50 dark:bg-red-900/20 px-4 py-3 text-sm text-ios-red", role: "alert", children: error }),
+    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          label: t("nameLabel"),
+          type: "text",
+          value: name,
+          onChange: (event) => setName(event.target.value),
+          placeholder: t("namePlaceholder"),
+          icon: /* @__PURE__ */ jsx(UserIcon, { className: "h-5 w-5" }),
+          autoComplete: "name",
+          disabled: isSubmitting,
+          required: true
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          label: t("emailLabel"),
+          type: "email",
+          value: email,
+          onChange: (event) => setEmail(event.target.value),
+          placeholder: t("emailPlaceholder"),
+          icon: /* @__PURE__ */ jsx(EnvelopeIcon, { className: "h-5 w-5" }),
+          autoComplete: "email",
+          disabled: isSubmitting,
+          required: true
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx(
+          PasswordInput,
+          {
+            label: t("passwordLabel"),
+            value: password,
+            onChange: (event) => setPassword(event.target.value),
+            placeholder: t("passwordPlaceholder"),
+            icon: /* @__PURE__ */ jsx(LockClosedIcon, { className: "h-5 w-5" }),
+            autoComplete: "new-password",
+            disabled: isSubmitting,
+            required: true
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          PasswordStrengthMeter,
+          {
+            password,
+            policy: passwordPolicy,
+            showRequirements: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(
+        FormCheckbox,
+        {
+          checked: termsAccepted,
+          onChange: setTermsAccepted,
+          label: t("termsLabel"),
+          description: t("termsDescription"),
+          disabled: isSubmitting
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "submit",
+          color: "ios-glass-blue",
+          fullWidth: true,
+          disabled: isSubmitting || !isFormValid,
+          loading: isSubmitting,
+          children: t("signUpButton")
+        }
+      )
+    ] }),
+    effectiveSocialProviders.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsx("div", { className: "w-full border-t border-gray-200 dark:border-white/10" }) }),
+        /* @__PURE__ */ jsx("div", { className: "relative flex justify-center text-xs", children: /* @__PURE__ */ jsx("span", { className: "bg-white dark:bg-gray-900 px-3 text-gray-400 dark:text-gray-500", children: t("orContinueWith") }) })
+      ] }),
+      /* @__PURE__ */ jsx(
+        SocialLoginButtons,
+        {
+          providers: [...effectiveSocialProviders],
+          onProviderClick: handleSocialLogin,
+          loading: socialLoading,
+          disabled: isSubmitting
+        }
+      )
+    ] }),
+    onSignIn && /* @__PURE__ */ jsxs("p", { className: "text-center text-sm text-gray-500 dark:text-gray-400", children: [
+      t("alreadyHaveAccount"),
+      " ",
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: onSignIn,
+          className: "font-medium text-ios-blue hover:text-blue-700 dark:hover:text-blue-400 transition-colors",
+          children: t("signInLink")
+        }
+      )
+    ] })
+  ] });
+  if (embedded) return content;
+  return /* @__PURE__ */ jsx(AuthLayout, { heroPanel, children: content });
+}
+function ForgotPassword({
+  onSuccess,
+  onBack,
+  defaultEmail = "",
+  embedded = false
+}) {
+  const t = useTranslations("windsock");
+  const { client } = useAuth();
+  const [phase, setPhase] = useState("form");
+  const [email, setEmail] = useState(defaultEmail);
+  const [error, setError] = useState(null);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const handleSubmit = useCallback(
+    async (event) => {
+      event.preventDefault();
+      setError(null);
+      setIsSubmitting(true);
+      try {
+        await client.requestPasswordReset(email);
+        setPhase("sent");
+        onSuccess?.();
+      } catch {
+        setError(t("forgotPasswordError"));
+      } finally {
+        setIsSubmitting(false);
+      }
+    },
+    [client, email, onSuccess, t]
+  );
+  const sentContent = /* @__PURE__ */ jsxs("div", { className: "space-y-5", children: [
+    /* @__PURE__ */ jsx(
+      EmptyState,
+      {
+        variant: "minimal",
+        icon: CheckCircleIcon,
+        message: t("forgotPasswordSuccessTitle"),
+        description: t("forgotPasswordSuccessDescription", { email })
+      }
+    ),
+    onBack && /* @__PURE__ */ jsx("div", { className: "text-center", children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: onBack,
+        className: "text-sm font-medium text-ios-blue hover:text-blue-700 dark:hover:text-blue-400 transition-colors",
+        children: t("backToSignIn")
+      }
+    ) })
+  ] });
+  const formContent = /* @__PURE__ */ jsxs("div", { className: "space-y-5", children: [
+    /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-2xl font-bold text-gray-900 dark:text-white", children: t("forgotPasswordTitle") }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500 dark:text-gray-400", children: t("forgotPasswordSubtitle") })
+    ] }),
+    error && /* @__PURE__ */ jsx("div", { className: "rounded-xl bg-red-50 dark:bg-red-900/20 px-4 py-3 text-sm text-ios-red", role: "alert", children: error }),
+    /* @__PURE__ */ jsx(
+      BaseForm,
+      {
+        icon: /* @__PURE__ */ jsx(EnvelopeIcon, { className: "h-5 w-5" }),
+        iconColor: "blue",
+        title: t("forgotPasswordFormTitle"),
+        subtitle: t("forgotPasswordFormSubtitle"),
+        onSubmit: handleSubmit,
+        submitLabel: t("forgotPasswordSubmit"),
+        isLoading: isSubmitting,
+        submitDisabled: !email.trim(),
+        showHeader: false,
+        children: /* @__PURE__ */ jsx(
+          Input,
+          {
+            label: t("emailLabel"),
+            type: "email",
+            value: email,
+            onChange: (event) => setEmail(event.target.value),
+            placeholder: t("emailPlaceholder"),
+            icon: /* @__PURE__ */ jsx(EnvelopeIcon, { className: "h-5 w-5" }),
+            autoComplete: "email",
+            disabled: isSubmitting,
+            required: true,
+            autoFocus: true
+          }
+        )
+      }
+    ),
+    onBack && /* @__PURE__ */ jsx("div", { className: "text-center", children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: onBack,
+        className: "text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200 transition-colors",
+        children: t("backToSignIn")
+      }
+    ) })
+  ] });
+  const activeContent = phase === "sent" ? sentContent : formContent;
+  if (embedded) return activeContent;
+  return /* @__PURE__ */ jsx(Card, { variant: "glass", className: "mx-auto max-w-md p-6 sm:p-8", children: activeContent });
+}
+function ResetPassword({
+  token,
+  onSuccess,
+  passwordPolicy,
+  embedded = false
+}) {
+  const t = useTranslations("windsock");
+  const { client } = useAuth();
+  const [phase, setPhase] = useState("form");
+  const [password, setPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
+  const [error, setError] = useState(null);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const passwordsMatch = password !== "" && confirmPassword !== "" && password === confirmPassword;
+  const hasPasswordMismatch = confirmPassword !== "" && password !== confirmPassword;
+  const handleSubmit = useCallback(
+    async (event) => {
+      event.preventDefault();
+      setError(null);
+      if (!passwordsMatch) {
+        setError(t("passwordMismatchError"));
+        return;
+      }
+      setIsSubmitting(true);
+      try {
+        await client.resetPassword(token, password);
+        setPhase("success");
+        onSuccess?.();
+      } catch {
+        setError(t("resetPasswordError"));
+      } finally {
+        setIsSubmitting(false);
+      }
+    },
+    [client, token, password, passwordsMatch, onSuccess, t]
+  );
+  const successContent = /* @__PURE__ */ jsx("div", { className: "space-y-5", children: /* @__PURE__ */ jsx(
+    EmptyState,
+    {
+      variant: "minimal",
+      icon: CheckCircleIcon,
+      message: t("resetPasswordSuccessTitle"),
+      description: t("resetPasswordSuccessDescription")
+    }
+  ) });
+  const formContent = /* @__PURE__ */ jsxs("div", { className: "space-y-5", children: [
+    /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-2xl font-bold text-gray-900 dark:text-white", children: t("resetPasswordTitle") }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500 dark:text-gray-400", children: t("resetPasswordSubtitle") })
+    ] }),
+    error && /* @__PURE__ */ jsx("div", { className: "rounded-xl bg-red-50 dark:bg-red-900/20 px-4 py-3 text-sm text-ios-red", role: "alert", children: error }),
+    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx(
+          PasswordInput,
+          {
+            label: t("newPasswordLabel"),
+            value: password,
+            onChange: (event) => setPassword(event.target.value),
+            placeholder: t("newPasswordPlaceholder"),
+            icon: /* @__PURE__ */ jsx(LockClosedIcon, { className: "h-5 w-5" }),
+            autoComplete: "new-password",
+            disabled: isSubmitting,
+            required: true,
+            autoFocus: true
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          PasswordStrengthMeter,
+          {
+            password,
+            policy: passwordPolicy,
+            showRequirements: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(
+        PasswordInput,
+        {
+          label: t("confirmPasswordLabel"),
+          value: confirmPassword,
+          onChange: (event) => setConfirmPassword(event.target.value),
+          placeholder: t("confirmPasswordPlaceholder"),
+          icon: /* @__PURE__ */ jsx(LockClosedIcon, { className: "h-5 w-5" }),
+          autoComplete: "new-password",
+          disabled: isSubmitting,
+          error: hasPasswordMismatch ? t("passwordMismatchError") : void 0,
+          success: passwordsMatch,
+          required: true
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "submit",
+          color: "ios-glass-blue",
+          fullWidth: true,
+          disabled: isSubmitting || !passwordsMatch,
+          loading: isSubmitting,
+          children: t("resetPasswordButton")
+        }
+      )
+    ] })
+  ] });
+  const activeContent = phase === "success" ? successContent : formContent;
+  if (embedded) return activeContent;
+  return /* @__PURE__ */ jsx(Card, { variant: "glass", className: "mx-auto max-w-md p-6 sm:p-8", children: activeContent });
+}
+function PasswordlessSignIn({
+  defaultMethod = "email",
+  allowedChannels = ["email", "sms"],
+  onSuccess,
+  onBack,
+  defaultEmail = "",
+  embedded = false
+}) {
+  const t = useTranslations("windsock");
+  const { client } = useAuth();
+  const [step, setStep] = useState("input");
+  const [channel, setChannel] = useState(
+    allowedChannels.includes(defaultMethod) ? defaultMethod : allowedChannels[0] ?? "email"
+  );
+  const [identifier, setIdentifier] = useState(defaultEmail);
+  const [code, setCode] = useState("");
+  const [error, setError] = useState(null);
+  const [isSending, setIsSending] = useState(false);
+  const [isVerifying, setIsVerifying] = useState(false);
+  const channelSegments = allowedChannels.map((ch) => ({
+    value: ch,
+    label: ch === "email" ? t("channelEmail") : t("channelSms")
+  }));
+  const handleSendCode = useCallback(async () => {
+    if (!identifier.trim()) return;
+    setError(null);
+    setIsSending(true);
+    try {
+      await client.sendPasswordlessCode(channel, identifier.trim());
+      setStep("sent");
+      setTimeout(() => setStep("verify"), 1500);
+    } catch {
+      setError(t("passwordlessSendError"));
+    } finally {
+      setIsSending(false);
+    }
+  }, [client, channel, identifier, t]);
+  const handleVerifyCode = useCallback(
+    async (completedCode) => {
+      setError(null);
+      setIsVerifying(true);
+      try {
+        await client.verifyPasswordlessCode(channel, identifier.trim(), completedCode);
+        onSuccess?.();
+      } catch {
+        setError(t("passwordlessVerifyError"));
+        setCode("");
+      } finally {
+        setIsVerifying(false);
+      }
+    },
+    [client, channel, identifier, onSuccess, t]
+  );
+  const inputContent = /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-2xl font-bold text-gray-900 dark:text-white", children: t("passwordlessTitle") }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500 dark:text-gray-400", children: t("passwordlessSubtitle") })
+    ] }),
+    allowedChannels.length > 1 && /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(
+      SegmentedControl,
+      {
+        segments: channelSegments,
+        value: channel,
+        onChange: (value) => {
+          setChannel(value);
+          setIdentifier(value === "email" ? defaultEmail : "");
+          setError(null);
+        },
+        size: "sm"
+      }
+    ) }),
+    error && /* @__PURE__ */ jsx("div", { className: "rounded-xl bg-red-50 dark:bg-red-900/20 px-4 py-3 text-sm text-ios-red", role: "alert", children: error }),
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        label: channel === "email" ? t("emailLabel") : t("phoneLabel"),
+        type: channel === "email" ? "email" : "tel",
+        value: identifier,
+        onChange: (event) => setIdentifier(event.target.value),
+        placeholder: channel === "email" ? t("emailPlaceholder") : t("phonePlaceholder"),
+        icon: channel === "email" ? /* @__PURE__ */ jsx(EnvelopeIcon, { className: "h-5 w-5" }) : /* @__PURE__ */ jsx(DevicePhoneMobileIcon, { className: "h-5 w-5" }),
+        autoComplete: channel === "email" ? "email" : "tel",
+        disabled: isSending,
+        autoFocus: true
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        type: "button",
+        color: "ios-glass-blue",
+        fullWidth: true,
+        onClick: handleSendCode,
+        disabled: isSending || !identifier.trim(),
+        loading: isSending,
+        children: t("passwordlessSendButton")
+      }
+    ),
+    onBack && /* @__PURE__ */ jsx("div", { className: "text-center", children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: onBack,
+        className: "text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200 transition-colors",
+        children: t("backToSignIn")
+      }
+    ) })
+  ] });
+  const sentContent = /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsx(
+      EmptyState,
+      {
+        variant: "minimal",
+        icon: PaperAirplaneIcon,
+        message: t("passwordlessCodeSentTitle"),
+        description: channel === "email" ? t("passwordlessCodeSentEmailDescription", { email: identifier }) : t("passwordlessCodeSentSmsDescription", { phone: identifier })
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(Spinner, {}) })
+  ] });
+  const verifyContent = /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-xl font-bold text-gray-900 dark:text-white", children: t("passwordlessEnterCodeTitle") }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500 dark:text-gray-400", children: channel === "email" ? t("passwordlessEnterCodeEmailSubtitle", { email: identifier }) : t("passwordlessEnterCodeSmsSubtitle", { phone: identifier }) })
+    ] }),
+    error && /* @__PURE__ */ jsx("div", { className: "rounded-xl bg-red-50 dark:bg-red-900/20 px-4 py-3 text-sm text-ios-red text-center", role: "alert", children: error }),
+    /* @__PURE__ */ jsx(
+      OtpInput,
+      {
+        value: code,
+        onChange: setCode,
+        onComplete: handleVerifyCode,
+        error: error ?? void 0,
+        disabled: isVerifying,
+        autoFocus: true
+      }
+    ),
+    isVerifying && /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(Spinner, {}) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-sm", children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => {
+            setStep("input");
+            setCode("");
+            setError(null);
+          },
+          className: "text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200 transition-colors",
+          children: t("passwordlessChangeIdentifier")
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => {
+            setCode("");
+            setError(null);
+            handleSendCode();
+          },
+          disabled: isSending,
+          className: "font-medium text-ios-blue hover:text-blue-700 dark:hover:text-blue-400 transition-colors disabled:opacity-50",
+          children: t("resendEmailButton")
+        }
+      )
+    ] })
+  ] });
+  const activeContent = step === "input" ? inputContent : step === "sent" ? sentContent : verifyContent;
+  if (embedded) return activeContent;
+  return /* @__PURE__ */ jsx(Card, { variant: "glass", className: "mx-auto max-w-md p-6 sm:p-8", children: activeContent });
+}
+function ConsentScreen({
+  application,
+  scopes,
+  grantedScopes,
+  onApprove,
+  onDeny,
+  isSubmitting = false
+}) {
+  const t = useTranslations("windsock");
+  const [checkedScopes, setCheckedScopes] = useState(
+    () => new Set(grantedScopes && grantedScopes.length > 0 ? grantedScopes : scopes.map((s) => s.id))
+  );
+  const handleScopeToggle = useCallback((scopeId, checked) => {
+    setCheckedScopes((previous) => {
+      const next = new Set(previous);
+      if (checked) {
+        next.add(scopeId);
+      } else {
+        next.delete(scopeId);
+      }
+      return next;
+    });
+  }, []);
+  const handleApprove = useCallback(() => {
+    triggerHaptic("light");
+    onApprove(Array.from(checkedScopes));
+  }, [checkedScopes, onApprove]);
+  const handleDeny = useCallback(() => {
+    triggerHaptic("light");
+    onDeny();
+  }, [onDeny]);
+  const appInitials = application.name.split(" ").map((word) => word[0]).join("").slice(0, 2).toUpperCase();
+  return /* @__PURE__ */ jsx(AuthLayout, { children: /* @__PURE__ */ jsx(Card, { variant: "glass", className: "mx-auto w-full max-w-md", children: /* @__PURE__ */ jsxs(CardContent, { className: "space-y-6 p-6 sm:p-8", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-3 text-center", children: [
+      /* @__PURE__ */ jsx(
+        Avatar,
+        {
+          src: application.logoUrl,
+          initials: appInitials,
+          alt: application.name
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-lg font-semibold text-gray-900 dark:text-white", children: application.name }),
+          application.verified ? /* @__PURE__ */ jsx(Badge, { color: "green", children: t("consent.verified") }) : /* @__PURE__ */ jsx(Badge, { color: "amber", children: t("consent.unverified") })
+        ] }),
+        application.url && /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: application.url }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-600 dark:text-gray-300", children: t("consent.wantsAccess") })
+      ] })
+    ] }),
+    !application.verified && /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 rounded-xl border border-amber-500/30 bg-amber-500/10 p-3", children: [
+      /* @__PURE__ */ jsx(ShieldExclamationIcon, { className: "mt-0.5 h-5 w-5 shrink-0 text-amber-600 dark:text-amber-400" }),
+      /* @__PURE__ */ jsx("p", { className: "text-sm text-amber-700 dark:text-amber-300", children: t("consent.unverifiedWarning", { name: application.name }) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-xs font-medium uppercase tracking-wide text-gray-500 dark:text-gray-400", children: t("consent.permissionsLabel") }),
+      /* @__PURE__ */ jsx(ListCard, { children: scopes.map((scope) => /* @__PURE__ */ jsx(
+        ListCardItem,
+        {
+          leading: /* @__PURE__ */ jsx(
+            FormCheckbox,
+            {
+              checked: checkedScopes.has(scope.id),
+              onChange: (checked) => handleScopeToggle(scope.id, checked),
+              label: ""
+            }
+          ),
+          onClick: () => handleScopeToggle(scope.id, !checkedScopes.has(scope.id)),
+          children: /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-900 dark:text-white", children: scope.name }),
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: scope.description })
+          ] })
+        },
+        scope.id
+      )) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 sm:flex-row-reverse", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          color: "ios-glass-blue",
+          fullWidth: true,
+          onClick: handleApprove,
+          loading: isSubmitting,
+          disabled: isSubmitting || checkedScopes.size === 0,
+          children: t("consent.approveButton")
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          outline: true,
+          fullWidth: true,
+          onClick: handleDeny,
+          disabled: isSubmitting,
+          children: t("consent.denyButton")
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "text-center text-xs text-gray-400 dark:text-gray-500", children: t("consent.footerNote") })
+  ] }) }) });
+}
+function SsoConnectorList({ connectors, onSelect, loading = false }) {
+  const t = useTranslations("windsock");
+  if (loading) {
+    return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 py-8 text-sm text-gray-500 dark:text-gray-400", children: [
+      /* @__PURE__ */ jsx(InlineSpinner, {}),
+      /* @__PURE__ */ jsx("span", { children: t("sso.connectorList.loading") })
+    ] });
+  }
+  if (connectors.length === 0) {
+    return /* @__PURE__ */ jsx("p", { className: "py-6 text-center text-sm text-gray-500 dark:text-gray-400", children: t("sso.connectorList.empty") });
+  }
+  return /* @__PURE__ */ jsx(ListCard, { children: connectors.map((connector) => {
+    const initials = connector.name.split(" ").map((word) => word[0]).join("").slice(0, 2).toUpperCase();
+    return /* @__PURE__ */ jsx(
+      ListCardItem,
+      {
+        leading: /* @__PURE__ */ jsx(
+          Avatar,
+          {
+            src: connector.logoUrl,
+            initials,
+            alt: connector.name
+          }
+        ),
+        trailing: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(Badge, { color: "zinc", children: connector.type === "saml" ? t("sso.connectorList.typeSaml") : t("sso.connectorList.typeOidc") }),
+          /* @__PURE__ */ jsx(ChevronRightIcon, { className: "h-4 w-4 text-gray-400" })
+        ] }),
+        onClick: () => onSelect(connector),
+        children: /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-900 dark:text-white", children: connector.name }),
+          connector.domain && /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: connector.domain })
+        ] })
+      },
+      connector.id
+    );
+  }) });
+}
+function SsoEmailForm({
+  onEmailSubmit,
+  onConnectorSelect,
+  defaultEmail = "",
+  embedded = false
+}) {
+  const t = useTranslations("windsock");
+  const [phase, setPhase] = useState("email");
+  const [email, setEmail] = useState(defaultEmail);
+  const [emailError, setEmailError] = useState(null);
+  const [connectors, setConnectors] = useState([]);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [loadingConnectors, setLoadingConnectors] = useState(false);
+  const validateEmail = useCallback(
+    (value) => {
+      if (!value.trim()) {
+        setEmailError(t("sso.emailForm.errorEmailRequired"));
+        return false;
+      }
+      if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
+        setEmailError(t("sso.emailForm.errorEmailInvalid"));
+        return false;
+      }
+      setEmailError(null);
+      return true;
+    },
+    [t]
+  );
+  const handleEmailSubmit = useCallback(async () => {
+    if (!validateEmail(email)) return;
+    setIsSubmitting(true);
+    setLoadingConnectors(true);
+    try {
+      const discovered = await onEmailSubmit(email);
+      setConnectors(discovered);
+      setPhase("connectors");
+    } catch {
+      setEmailError(t("sso.emailForm.errorDiscoveryFailed"));
+    } finally {
+      setIsSubmitting(false);
+      setLoadingConnectors(false);
+    }
+  }, [email, onEmailSubmit, validateEmail, t]);
+  const handleBackToEmail = useCallback(() => {
+    setPhase("email");
+    setConnectors([]);
+    setEmailError(null);
+  }, []);
+  if (phase === "connectors") {
+    const connectorsContent = /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-900 dark:text-white", children: t("sso.emailForm.connectorsTitle") }),
+        /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: t("sso.emailForm.connectorsSubtitle", { email }) })
+      ] }),
+      /* @__PURE__ */ jsx(
+        SsoConnectorList,
+        {
+          connectors,
+          onSelect: onConnectorSelect,
+          loading: loadingConnectors
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "text-center", children: /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: handleBackToEmail,
+          className: "text-sm text-gray-500 transition-colors hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200",
+          children: t("sso.emailForm.backButton")
+        }
+      ) })
+    ] });
+    if (embedded) return connectorsContent;
+    return /* @__PURE__ */ jsx(Card, { variant: "glass", className: "mx-auto w-full max-w-md", children: /* @__PURE__ */ jsx(CardContent, { className: "p-6 sm:p-8", children: connectorsContent }) });
+  }
+  const emailContent = /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-900 dark:text-white", children: t("sso.emailForm.title") }),
+      /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: t("sso.emailForm.subtitle") })
+    ] }),
+    /* @__PURE__ */ jsxs(BaseForm, { onSubmit: handleEmailSubmit, submitLabel: t("sso.emailForm.continueButton"), showFooter: false, children: [
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          type: "email",
+          label: t("sso.emailForm.emailLabel"),
+          placeholder: t("sso.emailForm.emailPlaceholder"),
+          value: email,
+          onChange: (event) => {
+            setEmail(event.target.value);
+            if (emailError) setEmailError(null);
+          },
+          error: emailError ?? void 0,
+          icon: /* @__PURE__ */ jsx(BuildingOffice2Icon, { className: "h-5 w-5" }),
+          disabled: isSubmitting,
+          autoFocus: true,
+          autoComplete: "email"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "submit",
+          color: "ios-glass-blue",
+          fullWidth: true,
+          loading: isSubmitting,
+          disabled: isSubmitting,
+          children: t("sso.emailForm.continueButton")
+        }
+      )
+    ] })
+  ] });
+  if (embedded) return emailContent;
+  return /* @__PURE__ */ jsx(Card, { variant: "glass", className: "mx-auto w-full max-w-md", children: /* @__PURE__ */ jsx(CardContent, { className: "p-6 sm:p-8", children: emailContent }) });
+}
+var DEFAULT_LABELS = {
+  menuLabel: "User menu",
+  userAlt: "User",
+  signOut: "Sign out",
+  signOutConfirmTitle: "Sign out?",
+  signOutConfirmButton: "Sign out",
+  signOutCancelButton: "Cancel"
+};
+function UserButton({ menuItems = [], onSignOut, avatarUrl, labels }) {
+  const resolvedLabels = { ...DEFAULT_LABELS, ...labels };
+  const { user, logout, status } = useAuth();
+  const [confirmSignOut, setConfirmSignOut] = useState(false);
+  if (status !== "authenticated") {
+    return null;
+  }
+  const userInitials = user?.name ? user.name.split(" ").map((word) => word[0]).join("").slice(0, 2).toUpperCase() : user?.email?.slice(0, 2).toUpperCase() ?? "??";
+  const resolvedAvatarUrl = avatarUrl ?? user?.image;
+  const handleSignOutRequest = () => {
+    triggerHaptic("light");
+    setConfirmSignOut(true);
+  };
+  const handleSignOutConfirm = async () => {
+    triggerHaptic("success");
+    setConfirmSignOut(false);
+    try {
+      onSignOut?.();
+      await logout("/");
+    } catch {
+    }
+  };
+  const handleSignOutCancel = () => {
+    triggerHaptic("light");
+    setConfirmSignOut(false);
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(Menu, { as: "div", className: "relative inline-block text-left", children: [
+      /* @__PURE__ */ jsxs(
+        Menu.Button,
+        {
+          className: "flex items-center gap-2 rounded-full p-1 transition-opacity hover:opacity-80 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500",
+          "aria-label": resolvedLabels.menuLabel,
+          children: [
+            /* @__PURE__ */ jsx(
+              Avatar,
+              {
+                src: resolvedAvatarUrl,
+                initials: userInitials,
+                alt: user?.name ?? user?.email ?? resolvedLabels.userAlt
+              }
+            ),
+            /* @__PURE__ */ jsx(ChevronUpDownIcon, { className: "h-4 w-4 text-gray-500 dark:text-gray-400" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Transition,
+        {
+          as: Fragment$1,
+          enter: "transition ease-out duration-100",
+          enterFrom: "transform opacity-0 scale-95",
+          enterTo: "transform opacity-100 scale-100",
+          leave: "transition ease-in duration-75",
+          leaveFrom: "transform opacity-100 scale-100",
+          leaveTo: "transform opacity-0 scale-95",
+          children: /* @__PURE__ */ jsxs(Menu.Items, { className: "liquid-surface absolute right-0 z-50 mt-2 w-60 origin-top-right rounded-2xl shadow-lg ring-1 ring-black/5 focus:outline-none dark:ring-white/10", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 border-b border-gray-200/60 px-4 py-3 dark:border-white/10", children: [
+              /* @__PURE__ */ jsx(
+                Avatar,
+                {
+                  src: resolvedAvatarUrl,
+                  initials: userInitials,
+                  alt: user?.name ?? user?.email ?? resolvedLabels.userAlt
+                }
+              ),
+              /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+                user?.name && /* @__PURE__ */ jsx("p", { className: "truncate text-sm font-medium text-gray-900 dark:text-white", children: user.name }),
+                user?.email && /* @__PURE__ */ jsx("p", { className: "truncate text-xs text-gray-500 dark:text-gray-400", children: user.email })
+              ] })
+            ] }),
+            menuItems.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx("div", { className: "px-1 py-1", children: menuItems.map((item, index) => /* @__PURE__ */ jsx(Menu.Item, { children: ({ active }) => /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => {
+                    triggerHaptic("light");
+                    item.onClick();
+                  },
+                  className: `flex w-full items-center gap-2 rounded-xl px-3 py-2 text-sm transition-colors ${active ? "bg-gray-100 text-gray-900 dark:bg-white/10 dark:text-white" : "text-gray-700 dark:text-gray-300"}`,
+                  children: [
+                    item.icon ? /* @__PURE__ */ jsx("span", { className: "h-4 w-4 shrink-0 text-gray-400", children: item.icon }) : null,
+                    item.label
+                  ]
+                }
+              ) }, index)) }),
+              /* @__PURE__ */ jsx("div", { className: "border-t border-gray-200/60 dark:border-white/10" })
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "border-t border-gray-200/60 px-1 py-1 dark:border-white/10", children: /* @__PURE__ */ jsx(Menu.Item, { children: ({ active }) => /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: handleSignOutRequest,
+                className: `flex w-full items-center gap-2 rounded-xl px-3 py-2 text-sm transition-colors ${active ? "bg-red-50 text-red-700 dark:bg-red-500/10 dark:text-red-400" : "text-red-600 dark:text-red-400"}`,
+                children: [
+                  /* @__PURE__ */ jsx(ArrowRightStartOnRectangleIcon, { className: "h-4 w-4 shrink-0" }),
+                  resolvedLabels.signOut
+                ]
+              }
+            ) }) })
+          ] })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(
+      DynamicIslandConfirm,
+      {
+        open: confirmSignOut,
+        onClose: handleSignOutCancel,
+        onConfirm: handleSignOutConfirm,
+        title: resolvedLabels.signOutConfirmTitle,
+        confirmLabel: resolvedLabels.signOutConfirmButton,
+        cancelLabel: resolvedLabels.signOutCancelButton
+      }
+    )
+  ] });
+}
+
+export { ConsentScreen, ForgotPassword, MfaChallenge, PasswordlessSignIn, ResetPassword, SignIn, SignUp, SsoConnectorList, SsoEmailForm, UserButton, VerifyEmail };
+//# sourceMappingURL=chunk-5HXDJBVX.mjs.map
+//# sourceMappingURL=chunk-5HXDJBVX.mjs.map