Password Input

An input component that allows users to enter a password.

Installation

npx shadcn@latest add @tetra-ui/password-input

import { PasswordInput } from "@/components/ui/password-input";

<PasswordInput placeholder="Enter your password" />

A show/hide button is built in. Users can tap the eye icon to reveal or mask the password.

<PasswordInput disabled placeholder="Enter your password" />

<PasswordInput invalid placeholder="Enter your password" />

Native Sheet

A sheet component that can be used to display content in a modal.

Popover

Displays content in a portal relative to the triggering button element.