ui Architecture Docs
Home / File/ form-rhf-password.tsx — ui Source File

form-rhf-password.tsx — ui Source File

Architecture documentation for form-rhf-password.tsx, a tsx file in the ui codebase. 11 imports, 0 dependents.

File tsx ComponentRegistry ChartRegistry 11 imports 1 functions

Entity Profile

Dependency Diagram

graph LR
  ca516639_08f4_c750_43a7_99fcf022fda4["form-rhf-password.tsx"]
  1d141819_425e_b5fd_4c8e_32f7c6a42cf2["react"]
  ca516639_08f4_c750_43a7_99fcf022fda4 --> 1d141819_425e_b5fd_4c8e_32f7c6a42cf2
  3d40a3bf_c062_4304_329a_00b1b72e8523["zod"]
  ca516639_08f4_c750_43a7_99fcf022fda4 --> 3d40a3bf_c062_4304_329a_00b1b72e8523
  d39cd1e4_1b2d_9aa2_1d29_fd0b4bfb61c3["lucide-react"]
  ca516639_08f4_c750_43a7_99fcf022fda4 --> d39cd1e4_1b2d_9aa2_1d29_fd0b4bfb61c3
  6d65354d_8f59_2cfc_4783_24b2eb870bc4["react-hook-form"]
  ca516639_08f4_c750_43a7_99fcf022fda4 --> 6d65354d_8f59_2cfc_4783_24b2eb870bc4
  e750d152_1191_1793_7244_99c7f9c595f4["sonner"]
  ca516639_08f4_c750_43a7_99fcf022fda4 --> e750d152_1191_1793_7244_99c7f9c595f4
  6802ce19_522d_e5fb_e458_8826d9f6952e["zod"]
  ca516639_08f4_c750_43a7_99fcf022fda4 --> 6802ce19_522d_e5fb_e458_8826d9f6952e
  57e86e45_ac6e_7278_be08_9092724e8401["button"]
  ca516639_08f4_c750_43a7_99fcf022fda4 --> 57e86e45_ac6e_7278_be08_9092724e8401
  c6d6139d_ea69_3d79_5004_68419bae2ac0["card"]
  ca516639_08f4_c750_43a7_99fcf022fda4 --> c6d6139d_ea69_3d79_5004_68419bae2ac0
  169af77a_46c3_8fec_4801_f34a0f1a3471["field"]
  ca516639_08f4_c750_43a7_99fcf022fda4 --> 169af77a_46c3_8fec_4801_f34a0f1a3471
  41df1c2c_a3b4_dc22_8bc9_310fe8b6ba9b["input-group"]
  ca516639_08f4_c750_43a7_99fcf022fda4 --> 41df1c2c_a3b4_dc22_8bc9_310fe8b6ba9b
  586bc556_dd23_86ef_eaf4_bdd7855462d9["progress"]
  ca516639_08f4_c750_43a7_99fcf022fda4 --> 586bc556_dd23_86ef_eaf4_bdd7855462d9
  style ca516639_08f4_c750_43a7_99fcf022fda4 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

"use client"

import * as React from "react"
import { zodResolver } from "@hookform/resolvers/zod"
import { CheckIcon } from "lucide-react"
import { Controller, useForm, useWatch } from "react-hook-form"
import { toast } from "sonner"
import * as z from "zod"

import { Button } from "@/registry/new-york-v4/ui/button"
import {
  Card,
  CardContent,
  CardDescription,
  CardFooter,
  CardHeader,
  CardTitle,
} from "@/registry/new-york-v4/ui/card"
import {
  Field,
  FieldError,
  FieldGroup,
  FieldLabel,
} from "@/registry/new-york-v4/ui/field"
import {
  InputGroup,
  InputGroupAddon,
  InputGroupInput,
} from "@/registry/new-york-v4/ui/input-group"
import { Progress } from "@/registry/new-york-v4/ui/progress"

const passwordRequirements = [
  {
    id: "length",
    label: "At least 8 characters",
    test: (val: string) => val.length >= 8,
  },
  {
    id: "lowercase",
    label: "One lowercase letter",
    test: (val: string) => /[a-z]/.test(val),
  },
  {
    id: "uppercase",
    label: "One uppercase letter",
    test: (val: string) => /[A-Z]/.test(val),
  },
  { id: "number", label: "One number", test: (val: string) => /\d/.test(val) },
  {
    id: "special",
    label: "One special character",
    test: (val: string) => /[!@#$%^&*(),.?":{}|<>]/.test(val),
  },
]

const formSchema = z.object({
  password: z
    .string()
    .min(8, "Password must be at least 8 characters")
    .refine(
// ... (165 more lines)

Domain

Subdomains

Functions

Dependencies

  • button
  • card
  • field
  • input-group
  • lucide-react
  • progress
  • react
  • react-hook-form
  • sonner
  • zod
  • zod

Source

Frequently Asked Questions

What does form-rhf-password.tsx do?
form-rhf-password.tsx is a source file in the ui codebase, written in tsx. It belongs to the ComponentRegistry domain, ChartRegistry subdomain.
What functions are defined in form-rhf-password.tsx?
form-rhf-password.tsx defines 1 function(s): FormRhfPassword.
What does form-rhf-password.tsx depend on?
form-rhf-password.tsx imports 11 module(s): button, card, field, input-group, lucide-react, progress, react, react-hook-form, and 3 more.
Where is form-rhf-password.tsx in the architecture?
form-rhf-password.tsx is located at apps/v4/registry/new-york-v4/examples/form-rhf-password.tsx (domain: ComponentRegistry, subdomain: ChartRegistry, directory: apps/v4/registry/new-york-v4/examples).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free