"use client";
import * as React8 from 'react';
import { cva } from 'class-variance-authority';
import { clsx } from 'clsx';
import { twMerge } from 'tailwind-merge';
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
import { Slot } from '@radix-ui/react-slot';
import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
import * as LabelPrimitive from '@radix-ui/react-label';
import * as SeparatorPrimitive from '@radix-ui/react-separator';

function cn(...inputs) {
  return twMerge(clsx(inputs));
}
var alertVariants = cva(
  [
    "relative w-full rounded-lg border px-[var(--space-4,1rem)] py-[var(--space-3,0.75rem)] text-sm",
    "transition-all duration-[var(--duration-normal,200ms)] ease-out",
    "[&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:h-4 [&>svg]:w-4 [&>svg]:text-foreground",
    "[&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px]"
  ].join(" "),
  {
    variants: {
      variant: {
        default: "border-foreground/[0.08] bg-background text-foreground",
        destructive: "border-destructive/50 text-destructive [&>svg]:text-destructive bg-destructive/5"
      }
    },
    defaultVariants: { variant: "default" }
  }
);
var Alert = React8.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx(
  "div",
  {
    ref,
    role: "alert",
    className: cn(alertVariants({ variant }), className),
    ...props
  }
));
Alert.displayName = "Alert";
var AlertTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
  "h5",
  {
    ref,
    className: cn("mb-[var(--space-1,0.25rem)] font-medium leading-none tracking-tight", className),
    ...props
  }
));
AlertTitle.displayName = "AlertTitle";
var AlertDescription = React8.forwardRef(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("text-sm [&_p]:leading-relaxed", className), ...props })
);
AlertDescription.displayName = "AlertDescription";
var Card = React8.forwardRef(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
    "div",
    {
      ref,
      className: cn(
        "rounded-lg border border-foreground/[0.08] bg-card text-card-foreground",
        "shadow-sm transition-all duration-[var(--duration-normal,200ms)] ease-out",
        "hover:shadow-md",
        className
      ),
      ...props
    }
  )
);
Card.displayName = "Card";
var CardHeader = React8.forwardRef(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
    "div",
    {
      ref,
      className: cn("flex flex-col space-y-1.5 p-[var(--space-6,1.5rem)]", className),
      ...props
    }
  )
);
CardHeader.displayName = "CardHeader";
var CardTitle = React8.forwardRef(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
    "h3",
    {
      ref,
      className: cn("text-2xl font-semibold leading-none tracking-tight", className),
      ...props
    }
  )
);
CardTitle.displayName = "CardTitle";
var CardDescription = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: cn("text-sm text-muted-foreground", className), ...props }));
CardDescription.displayName = "CardDescription";
var CardContent = React8.forwardRef(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-[var(--space-6,1.5rem)] pt-0", className), ...props })
);
CardContent.displayName = "CardContent";
var CardFooter = React8.forwardRef(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
    "div",
    {
      ref,
      className: cn("flex items-center p-[var(--space-6,1.5rem)] pt-0", className),
      ...props
    }
  )
);
CardFooter.displayName = "CardFooter";
var buttonVariants = cva(
  [
    "inline-flex items-center justify-center gap-[var(--gap-sm,0.5rem)] whitespace-nowrap rounded-md text-sm font-medium",
    "transition-all duration-[var(--duration-normal,200ms)] ease-out",
    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
    "disabled:pointer-events-none disabled:opacity-50",
    "active:scale-[0.98]",
    "[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0"
  ].join(" "),
  {
    variants: {
      variant: {
        default: [
          "bg-primary text-primary-foreground",
          "shadow-sm shadow-primary/20",
          "hover:bg-primary/90 hover:shadow-md hover:shadow-primary/25"
        ].join(" "),
        destructive: [
          "bg-destructive text-destructive-foreground",
          "shadow-sm shadow-destructive/20",
          "hover:bg-destructive/90 hover:shadow-md hover:shadow-destructive/25"
        ].join(" "),
        outline: [
          "border border-input bg-background",
          "shadow-sm inset-ring-1 inset-ring-foreground/[0.06]",
          "hover:bg-accent hover:text-accent-foreground hover:shadow-md hover:inset-ring-foreground/12"
        ].join(" "),
        secondary: [
          "bg-secondary text-secondary-foreground",
          "shadow-sm inset-ring-1 inset-ring-foreground/[0.08]",
          "hover:bg-secondary/80 hover:shadow-md hover:inset-ring-foreground/15"
        ].join(" "),
        ghost: "hover:bg-accent hover:text-accent-foreground",
        link: "text-primary underline-offset-4 hover:underline"
      },
      size: {
        default: "h-[var(--control-height-md,2.5rem)] px-[var(--space-4,1rem)] py-[var(--space-2,0.5rem)]",
        sm: "h-[var(--control-height-sm,2.25rem)] rounded-md px-[var(--space-3,0.75rem)]",
        lg: "h-[var(--control-height-lg,2.75rem)] rounded-md px-[var(--space-8,2rem)] text-base",
        icon: "h-[var(--control-height-md,2.5rem)] w-[var(--control-height-md,2.5rem)]"
      }
    },
    defaultVariants: {
      variant: "default",
      size: "default"
    }
  }
);
var Button = React8.forwardRef(
  ({ className, variant, size, asChild = false, loading = false, children, disabled, ...props }, ref) => {
    const Comp = asChild ? Slot : "button";
    return /* @__PURE__ */ jsx(
      Comp,
      {
        className: cn(buttonVariants({ variant, size, className })),
        ref,
        disabled: disabled || loading,
        "aria-busy": loading || void 0,
        ...props,
        children: loading ? /* @__PURE__ */ jsxs(Fragment, { children: [
          /* @__PURE__ */ jsxs(
            "svg",
            {
              className: "animate-spin h-4 w-4",
              xmlns: "http://www.w3.org/2000/svg",
              fill: "none",
              viewBox: "0 0 24 24",
              "aria-hidden": "true",
              children: [
                /* @__PURE__ */ jsx(
                  "circle",
                  {
                    className: "opacity-25",
                    cx: "12",
                    cy: "12",
                    r: "10",
                    stroke: "currentColor",
                    strokeWidth: "4"
                  }
                ),
                /* @__PURE__ */ jsx(
                  "path",
                  {
                    className: "opacity-75",
                    fill: "currentColor",
                    d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
                  }
                )
              ]
            }
          ),
          children
        ] }) : children
      }
    );
  }
);
Button.displayName = "Button";
var Checkbox = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
  CheckboxPrimitive.Root,
  {
    ref,
    className: cn(
      "group h-4 w-4 shrink-0 rounded-sm border border-input",
      "transition-all duration-[var(--duration-normal,200ms)] ease-out",
      "shadow-sm inset-ring-1 inset-ring-foreground/[0.06]",
      "hover:border-ring/50 hover:shadow-md",
      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
      "disabled:cursor-not-allowed disabled:opacity-50",
      "data-[state=checked]:bg-primary data-[state=checked]:border-primary data-[state=checked]:text-primary-foreground",
      "data-[state=indeterminate]:bg-primary data-[state=indeterminate]:border-primary data-[state=indeterminate]:text-primary-foreground",
      className
    ),
    ...props,
    children: /* @__PURE__ */ jsxs(CheckboxPrimitive.Indicator, { className: cn("flex items-center justify-center text-current"), children: [
      /* @__PURE__ */ jsx(
        "svg",
        {
          xmlns: "http://www.w3.org/2000/svg",
          viewBox: "0 0 24 24",
          fill: "none",
          stroke: "currentColor",
          strokeWidth: "3",
          strokeLinecap: "round",
          strokeLinejoin: "round",
          className: "hidden h-3.5 w-3.5 group-data-[state=checked]:block",
          "aria-hidden": "true",
          children: /* @__PURE__ */ jsx("polyline", { points: "20 6 9 17 4 12" })
        }
      ),
      /* @__PURE__ */ jsx(
        "svg",
        {
          xmlns: "http://www.w3.org/2000/svg",
          viewBox: "0 0 24 24",
          fill: "none",
          stroke: "currentColor",
          strokeWidth: "3",
          strokeLinecap: "round",
          strokeLinejoin: "round",
          className: "hidden h-3.5 w-3.5 group-data-[state=indeterminate]:block",
          "aria-hidden": "true",
          children: /* @__PURE__ */ jsx("line", { x1: "5", y1: "12", x2: "19", y2: "12" })
        }
      )
    ] })
  }
));
Checkbox.displayName = "Checkbox";
var Input = React8.forwardRef(
  ({ className, type, ...props }, ref) => {
    return /* @__PURE__ */ jsx(
      "input",
      {
        type,
        className: cn(
          "flex h-[var(--control-height-md,2.5rem)] w-full rounded-md border border-input bg-background px-[var(--space-3,0.75rem)] py-[var(--space-2,0.5rem)] text-sm",
          "transition-all duration-[var(--duration-normal,200ms)] ease-out",
          // inset-ring gives a self-borne edge so the input field is visible on flat
          // surfaces (token border alone is too low-contrast on bg-background=white).
          "shadow-sm inset-ring-1 inset-ring-foreground/[0.06]",
          "file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground",
          "placeholder:text-muted-foreground",
          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
          "focus-visible:shadow-md focus-visible:border-ring/50",
          "hover:border-ring/30 hover:shadow-md",
          "disabled:cursor-not-allowed disabled:opacity-50",
          className
        ),
        ref,
        ...props
      }
    );
  }
);
Input.displayName = "Input";
var labelVariants = cva(
  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
);
var Label = React8.forwardRef(
  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(LabelPrimitive.Root, { ref, className: cn(labelVariants(), className), ...props })
);
Label.displayName = "Label";
var Separator = React8.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx(
  SeparatorPrimitive.Root,
  {
    ref,
    decorative,
    orientation,
    className: cn(
      "shrink-0 bg-foreground/[0.12]",
      orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
      className
    ),
    ...props
  }
));
Separator.displayName = "Separator";
var EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
function AuthSignUpCard({
  adapter,
  socialProviders,
  signInHref = "/sign-in",
  termsHref = "/terms",
  privacyHref = "/privacy",
  passwordMinLength = 8,
  className,
  onSuccess
}) {
  const [name, setName] = React8.useState("");
  const [email, setEmail] = React8.useState("");
  const [password, setPassword] = React8.useState("");
  const [confirmPassword, setConfirmPassword] = React8.useState("");
  const [acceptTerms, setAcceptTerms] = React8.useState(false);
  const [submitting, setSubmitting] = React8.useState(null);
  const [error, setError] = React8.useState(null);
  const isBusy = submitting !== null;
  function validate() {
    if (!EMAIL_REGEX.test(email)) {
      return { code: "invalid_email", message: "Enter a valid email address." };
    }
    if (password.length < passwordMinLength) {
      return {
        code: "password_too_short",
        message: `Password must be at least ${passwordMinLength} characters.`
      };
    }
    if (password !== confirmPassword) {
      return { code: "password_mismatch", message: "Passwords don't match." };
    }
    if (!acceptTerms) {
      return {
        code: "terms_required",
        message: "Please accept the terms of service to continue."
      };
    }
    return null;
  }
  async function handleSubmit(e) {
    e.preventDefault();
    const validation = validate();
    if (validation) {
      setError(validation);
      return;
    }
    if (!adapter.signUpWithPassword) {
      console.warn(
        "[AuthSignUpCard] adapter.signUpWithPassword is not implemented \u2014 wire it up before exposing the form."
      );
      setError({
        code: "unimplemented",
        message: "Sign-up is currently unavailable. Please try again later."
      });
      return;
    }
    setError(null);
    setSubmitting("password");
    try {
      const result = await adapter.signUpWithPassword({
        email,
        password,
        name: name.trim().length > 0 ? name.trim() : void 0
      });
      if (!result.ok) {
        setError(result.error ?? { code: "unknown", message: "Sign-up failed." });
        return;
      }
      onSuccess?.(result.redirect);
    } finally {
      setSubmitting(null);
    }
  }
  async function handleSocial(provider) {
    if (!adapter.signInWithSocial) {
      console.warn(
        `[AuthSignUpCard] adapter.signInWithSocial is not implemented but a ${provider} button is rendered \u2014 drop the entry from socialProviders or wire the method.`
      );
      setError({
        code: "unimplemented",
        message: "This sign-up option is currently unavailable. Please try a different method."
      });
      return;
    }
    setError(null);
    setSubmitting(provider);
    try {
      const result = await adapter.signInWithSocial({ provider });
      if (!result.ok) {
        setError(result.error ?? { code: "social-failed", message: "Sign-up failed." });
        return;
      }
      onSuccess?.(result.redirect);
    } finally {
      setSubmitting(null);
    }
  }
  return /* @__PURE__ */ jsx("div", { className: cn("flex min-h-svh items-center justify-center p-6 sm:p-10", className), children: /* @__PURE__ */ jsxs(Card, { className: "w-full max-w-md", children: [
    /* @__PURE__ */ jsxs(CardHeader, { className: "space-y-2 text-center", children: [
      /* @__PURE__ */ jsx(CardTitle, { className: "text-2xl", children: "Create your account" }),
      /* @__PURE__ */ jsx(CardDescription, { children: "Get started in seconds \u2014 no credit card required." })
    ] }),
    /* @__PURE__ */ jsxs(CardContent, { className: "space-y-6", children: [
      error ? /* @__PURE__ */ jsxs(Alert, { variant: "destructive", children: [
        /* @__PURE__ */ jsx(AlertTitle, { children: "Couldn\u2019t create account" }),
        /* @__PURE__ */ jsx(AlertDescription, { children: error.message })
      ] }) : null,
      socialProviders && socialProviders.length > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
        /* @__PURE__ */ jsx("div", { className: "grid gap-2", children: socialProviders.map((p) => /* @__PURE__ */ jsxs(
          Button,
          {
            type: "button",
            variant: "outline",
            onClick: () => handleSocial(p.provider),
            disabled: isBusy,
            loading: submitting === p.provider,
            className: "w-full justify-center gap-2",
            children: [
              p.icon,
              /* @__PURE__ */ jsxs("span", { children: [
                "Continue with ",
                p.label
              ] })
            ]
          },
          p.provider
        )) }),
        /* @__PURE__ */ jsxs("div", { className: "relative", children: [
          /* @__PURE__ */ jsx(Separator, {}),
          /* @__PURE__ */ jsx("span", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 bg-card px-2 text-xs uppercase text-muted-foreground", children: "or sign up with email" })
        ] })
      ] }) : null,
      /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", noValidate: true, children: [
        /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
          /* @__PURE__ */ jsxs(Label, { htmlFor: "auth-sign-up-name", children: [
            "Full name ",
            /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "(optional)" })
          ] }),
          /* @__PURE__ */ jsx(
            Input,
            {
              id: "auth-sign-up-name",
              type: "text",
              autoComplete: "name",
              value: name,
              onChange: (e) => setName(e.target.value),
              disabled: isBusy
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
          /* @__PURE__ */ jsx(Label, { htmlFor: "auth-sign-up-email", children: "Email" }),
          /* @__PURE__ */ jsx(
            Input,
            {
              id: "auth-sign-up-email",
              type: "email",
              autoComplete: "email",
              required: true,
              value: email,
              onChange: (e) => setEmail(e.target.value),
              disabled: isBusy
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
          /* @__PURE__ */ jsx(Label, { htmlFor: "auth-sign-up-password", children: "Password" }),
          /* @__PURE__ */ jsx(
            Input,
            {
              id: "auth-sign-up-password",
              type: "password",
              autoComplete: "new-password",
              required: true,
              minLength: passwordMinLength,
              value: password,
              onChange: (e) => setPassword(e.target.value),
              disabled: isBusy,
              "aria-describedby": "auth-sign-up-password-hint"
            }
          ),
          /* @__PURE__ */ jsxs(
            "p",
            {
              id: "auth-sign-up-password-hint",
              className: "text-xs text-muted-foreground",
              children: [
                "At least ",
                passwordMinLength,
                " characters."
              ]
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
          /* @__PURE__ */ jsx(Label, { htmlFor: "auth-sign-up-confirm", children: "Confirm password" }),
          /* @__PURE__ */ jsx(
            Input,
            {
              id: "auth-sign-up-confirm",
              type: "password",
              autoComplete: "new-password",
              required: true,
              value: confirmPassword,
              onChange: (e) => setConfirmPassword(e.target.value),
              disabled: isBusy
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2", children: [
          /* @__PURE__ */ jsx(
            Checkbox,
            {
              id: "auth-sign-up-terms",
              checked: acceptTerms,
              onCheckedChange: (v) => setAcceptTerms(v === true),
              disabled: isBusy,
              className: "mt-0.5"
            }
          ),
          /* @__PURE__ */ jsxs(
            Label,
            {
              htmlFor: "auth-sign-up-terms",
              className: "text-sm font-normal leading-snug",
              children: [
                "I agree to the",
                " ",
                /* @__PURE__ */ jsx(
                  "a",
                  {
                    href: termsHref,
                    className: "font-medium text-foreground underline-offset-4 hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 rounded",
                    children: "Terms of Service"
                  }
                ),
                " ",
                "and",
                " ",
                /* @__PURE__ */ jsx(
                  "a",
                  {
                    href: privacyHref,
                    className: "font-medium text-foreground underline-offset-4 hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 rounded",
                    children: "Privacy Policy"
                  }
                ),
                "."
              ]
            }
          )
        ] }),
        /* @__PURE__ */ jsx(
          Button,
          {
            type: "submit",
            className: "w-full",
            disabled: isBusy,
            loading: submitting === "password",
            children: submitting === "password" ? "Creating account" : "Create account"
          }
        )
      ] })
    ] }),
    /* @__PURE__ */ jsxs(CardFooter, { className: "justify-center text-sm text-muted-foreground", children: [
      "Already have an account?",
      " ",
      /* @__PURE__ */ jsx(
        "a",
        {
          href: signInHref,
          className: "ml-1 font-medium text-foreground underline-offset-4 hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 rounded",
          children: "Sign in"
        }
      )
    ] })
  ] }) });
}

export { AuthSignUpCard };
//# sourceMappingURL=auth-sign-up-card.js.map
//# sourceMappingURL=auth-sign-up-card.js.map