"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import { forwardRef, useState } from "react";
import { Eye, EyeOff, Lock, CheckCircle2, XCircle } from "lucide-react";
import { Input } from "./input.js";
import { Badge } from "./badge.js";
import { cn } from "../../lib/utils/index.js";
const DEFAULT_REQUIREMENT_LABELS = {
  minChars: "8+ characters",
  uppercase: "One uppercase",
  lowercase: "One lowercase",
  number: "One number"
};
const PasswordInput = forwardRef(
  ({ className, showRequirements = false, showToggle = true, password = "", requirementLabels, ...props }, ref) => {
    const [showPassword, setShowPassword] = useState(false);
    const labels = requirementLabels ?? DEFAULT_REQUIREMENT_LABELS;
    const passwordRequirements = [
      { met: password.length >= 8, text: labels.minChars },
      { met: /[A-Z]/.test(password), text: labels.uppercase },
      { met: /[a-z]/.test(password), text: labels.lowercase },
      { met: /[0-9]/.test(password), text: labels.number }
    ];
    return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
      /* @__PURE__ */ jsxs("div", { className: "relative", children: [
        /* @__PURE__ */ jsx(Lock, { className: "absolute left-3 top-3 h-4 w-4 text-muted-foreground" }),
        /* @__PURE__ */ jsx(
          Input,
          {
            ...props,
            ref,
            type: showPassword ? "text" : "password",
            className: cn("pl-9", showToggle && "pr-9", className)
          }
        ),
        showToggle && /* @__PURE__ */ jsx(
          "button",
          {
            type: "button",
            onClick: () => setShowPassword(!showPassword),
            className: "absolute right-3 top-3 text-muted-foreground hover:text-foreground",
            tabIndex: -1,
            children: showPassword ? /* @__PURE__ */ jsx(EyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(Eye, { className: "h-4 w-4" })
          }
        )
      ] }),
      showRequirements && password && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: passwordRequirements.map((req, index) => /* @__PURE__ */ jsxs(
        Badge,
        {
          variant: req.met ? "default" : "secondary",
          className: "text-xs",
          children: [
            req.met ? /* @__PURE__ */ jsx(CheckCircle2, { className: "w-3 h-3 mr-1" }) : /* @__PURE__ */ jsx(XCircle, { className: "w-3 h-3 mr-1" }),
            req.text
          ]
        },
        index
      )) })
    ] });
  }
);
PasswordInput.displayName = "PasswordInput";
export {
  PasswordInput
};
