field-demo.tsx — ui Source File
Architecture documentation for field-demo.tsx, a tsx file in the ui codebase. 26 imports, 1 dependents.
Entity Profile
Dependency Diagram
graph LR b9b36d9d_9701_6134_d4ee_41213e7f1788["field-demo.tsx"] 1d141819_425e_b5fd_4c8e_32f7c6a42cf2["react"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> 1d141819_425e_b5fd_4c8e_32f7c6a42cf2 39a0d62e_8e7d_d097_eb95_91d2bca361f7["icons-react"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> 39a0d62e_8e7d_d097_eb95_91d2bca361f7 f9e8c1ea_9de4_3e04_ca27_b15cada2e81e["date-fns"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> f9e8c1ea_9de4_3e04_ca27_b15cada2e81e 46c758ca_dd64_66c4_37b9_b30acc3c853c["input-otp"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> 46c758ca_dd64_66c4_37b9_b30acc3c853c d39cd1e4_1b2d_9aa2_1d29_fd0b4bfb61c3["lucide-react"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> d39cd1e4_1b2d_9aa2_1d29_fd0b4bfb61c3 bfc8708c_7488_3983_8998_32b793781735["react-day-picker"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> bfc8708c_7488_3983_8998_32b793781735 79081a1f_55a3_945a_fb8c_d53d6d3eab81["utils"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> 79081a1f_55a3_945a_fb8c_d53d6d3eab81 550576ca_32fe_8288_72d6_10281189833b["avatar"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> 550576ca_32fe_8288_72d6_10281189833b 4c79c55d_d834_3cdd_ce17_cc4f4eb47d55["badge"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> 4c79c55d_d834_3cdd_ce17_cc4f4eb47d55 57e86e45_ac6e_7278_be08_9092724e8401["button"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> 57e86e45_ac6e_7278_be08_9092724e8401 d431e985_324f_ebc5_0383_4b336fa5e906["button-group"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> d431e985_324f_ebc5_0383_4b336fa5e906 7bfe56e6_25f1_1b2f_588d_f14238c3c071["calendar"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> 7bfe56e6_25f1_1b2f_588d_f14238c3c071 c6d6139d_ea69_3d79_5004_68419bae2ac0["card"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> c6d6139d_ea69_3d79_5004_68419bae2ac0 4f6bcac7_12b3_b724_9762_64ace071aa20["checkbox"] b9b36d9d_9701_6134_d4ee_41213e7f1788 --> 4f6bcac7_12b3_b724_9762_64ace071aa20 style b9b36d9d_9701_6134_d4ee_41213e7f1788 fill:#6366f1,stroke:#818cf8,color:#fff
Relationship Graph
Source Code
"use client"
import { useState } from "react"
import {
IconCircle,
IconCircleCheckFilled,
IconInfoCircle,
IconMinus,
IconPlus,
IconUsers,
IconWorld,
} from "@tabler/icons-react"
import { addDays, format } from "date-fns"
import { REGEXP_ONLY_DIGITS } from "input-otp"
import {
CalendarIcon,
ClockIcon,
DownloadIcon,
FileTextIcon,
FolderIcon,
MonitorIcon,
} from "lucide-react"
import { type DateRange } from "react-day-picker"
import { cn } from "@/lib/utils"
import {
Avatar,
AvatarFallback,
AvatarImage,
} from "@/registry/new-york-v4/ui/avatar"
import { Badge } from "@/registry/new-york-v4/ui/badge"
import { Button } from "@/registry/new-york-v4/ui/button"
import { ButtonGroup } from "@/registry/new-york-v4/ui/button-group"
import { Calendar } from "@/registry/new-york-v4/ui/calendar"
import {
Card,
CardContent,
CardDescription,
CardHeader,
CardTitle,
} from "@/registry/new-york-v4/ui/card"
import { Checkbox } from "@/registry/new-york-v4/ui/checkbox"
import {
Field,
FieldContent,
FieldDescription,
FieldGroup,
FieldLabel,
FieldLegend,
FieldSeparator,
FieldSet,
FieldTitle,
} from "@/registry/new-york-v4/ui/field"
import { Input } from "@/registry/new-york-v4/ui/input"
import {
InputGroup,
InputGroupAddon,
InputGroupInput,
} from "@/registry/new-york-v4/ui/input-group"
import {
// ... (4898 more lines)
Domain
Subdomains
Functions
- BasicFields()
- CheckoutForm()
- ClusterConfig()
- ComplexFormDemo()
- ComplexFormInvalidDemo()
- ContactForm()
- FeedbackForm()
- FieldDemo()
- FinderPreferencesForm()
- FormCheckboxDemo()
- FormDatePickerDemo()
- FormFieldGroupOutlineDemo()
- FormFieldSeparatorDemo()
- FormFieldSetDemo()
- FormInputDemo()
- FormInputTypesDemo()
- FormOTPDemo()
- FormOrientationDemo()
- FormRadioDemo()
- FormSelectDemo()
- FormSliderDemo()
- FormSpecialInputTypesDemo()
- FormSwitchDemo()
- FormTextareaDemo()
- FormToggleGroupDemo()
- HearAboutUs()
- JobApplicationForm()
- LoginForm()
- NewsletterForm()
- PaymentForm()
- PrivacySettings()
- ProfileSettingsForm()
- ShippingMethods()
- SignupForm()
- SubscriptionPlan()
- SurveyForm()
Dependencies
- avatar
- badge
- button
- button-group
- calendar
- card
- checkbox
- date-fns
- field
- icons-react
- input
- input-group
- input-otp
- input-otp
- lucide-react
- popover
- radio-group
- react
- react-day-picker
- select
- separator
- slider
- switch
- textarea
- toggle-group
- utils
Source
Frequently Asked Questions
What does field-demo.tsx do?
field-demo.tsx is a source file in the ui codebase, written in tsx. It belongs to the DocumentationAtlas domain, Changelog subdomain.
What functions are defined in field-demo.tsx?
field-demo.tsx defines 36 function(s): BasicFields, CheckoutForm, ClusterConfig, ComplexFormDemo, ComplexFormInvalidDemo, ContactForm, FeedbackForm, FieldDemo, FinderPreferencesForm, FormCheckboxDemo, and 26 more.
What does field-demo.tsx depend on?
field-demo.tsx imports 26 module(s): avatar, badge, button, button-group, calendar, card, checkbox, date-fns, and 18 more.
What files import field-demo.tsx?
field-demo.tsx is imported by 1 file(s): component-registry.ts.
Where is field-demo.tsx in the architecture?
field-demo.tsx is located at apps/v4/app/(internal)/sink/components/field-demo.tsx (domain: DocumentationAtlas, subdomain: Changelog, directory: apps/v4/app/(internal)/sink/components).
Analyze Your Own Codebase
Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.
Try Supermodel Free