"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import * as React from "react";
import { Eye, EyeOff, Lock } from "lucide-react";
import { useT } from "@open-mercato/shared/lib/i18n/context";
import { cn } from "@open-mercato/shared/lib/utils";
import { inputWrapperVariants, inputElementVariants } from "./input.js";
const PasswordInput = React.forwardRef(
  ({
    className,
    inputClassName,
    size,
    showLockIcon = true,
    revealable = true,
    revealed: revealedProp,
    onRevealedChange,
    showLabel,
    hideLabel,
    disabled,
    ...props
  }, ref) => {
    const t = useT();
    const resolvedShowLabel = showLabel ?? t("ui.inputs.passwordInput.show", "Show password");
    const resolvedHideLabel = hideLabel ?? t("ui.inputs.passwordInput.hide", "Hide password");
    const [internalRevealed, setInternalRevealed] = React.useState(false);
    const isControlled = revealedProp !== void 0;
    const revealed = isControlled ? revealedProp : internalRevealed;
    const toggleRevealed = React.useCallback(() => {
      const next = !revealed;
      if (!isControlled) setInternalRevealed(next);
      onRevealedChange?.(next);
    }, [revealed, isControlled, onRevealedChange]);
    return /* @__PURE__ */ jsxs("div", { className: cn(inputWrapperVariants({ size }), className), "data-slot": "password-input-wrapper", children: [
      showLockIcon ? /* @__PURE__ */ jsx(Lock, { className: "size-4 shrink-0 text-muted-foreground", "aria-hidden": "true" }) : null,
      /* @__PURE__ */ jsx(
        "input",
        {
          ref,
          type: revealed ? "text" : "password",
          disabled,
          className: cn(inputElementVariants({ size }), inputClassName),
          ...props
        }
      ),
      revealable ? /* @__PURE__ */ jsx(
        "button",
        {
          type: "button",
          onClick: toggleRevealed,
          "aria-label": revealed ? resolvedHideLabel : resolvedShowLabel,
          "aria-pressed": revealed,
          disabled,
          className: "flex shrink-0 items-center justify-center rounded-sm text-muted-foreground transition-colors hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:cursor-not-allowed disabled:opacity-50",
          children: revealed ? /* @__PURE__ */ jsx(EyeOff, { className: "size-4", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Eye, { className: "size-4", "aria-hidden": "true" })
        }
      ) : null
    ] });
  }
);
PasswordInput.displayName = "PasswordInput";
export {
  PasswordInput
};
//# sourceMappingURL=password-input.js.map
