Password Input

1import { PasswordInput, PasswordInputGroup, PasswordInputInput, PasswordInputTrigger } from "@/components/ui/password-input";
2
3<PasswordInput />

1"use client";
2
3import {
4  PasswordInput as ArkPasswordInput,
5  usePasswordInputContext,
6} from "@ark-ui/react/password-input";
7import { EyeIcon, EyeOffIcon } from "lucide-react";
8import type React from "react";
9import { cn } from "@/lib/utils";
10import {
11  InputGroup,
12  InputGroupAddon,
13  InputGroupButton,
14  InputGroupInput,
15  type InputGroupProps,
16} from "@/registry/react/components/input-group";
17
18export const usePasswordInput = usePasswordInputContext;
19
20interface PasswordInputProps
21  extends React.ComponentProps<typeof ArkPasswordInput.Root>,
22    Pick<InputGroupProps, "size"> {}
23
24export const PasswordInput = (props: PasswordInputProps) => {
25  const { size = "md", className, ...rest } = props;
26
27  return (
28    <ArkPasswordInput.Root