preview.tsx — ui Source File
Architecture documentation for preview.tsx, a tsx file in the ui codebase. 28 imports, 0 dependents.
Entity Profile
Dependency Diagram
graph LR f02a92c6_0fdc_9231_5419_752092d638ff["preview.tsx"] 1d141819_425e_b5fd_4c8e_32f7c6a42cf2["react"] f02a92c6_0fdc_9231_5419_752092d638ff --> 1d141819_425e_b5fd_4c8e_32f7c6a42cf2 f56be340_a522_c6f7_dec3_5906873d14c8["example"] f02a92c6_0fdc_9231_5419_752092d638ff --> f56be340_a522_c6f7_dec3_5906873d14c8 0dfc263e_878b_3500_d535_fddc0e0dc915["alert-dialog"] f02a92c6_0fdc_9231_5419_752092d638ff --> 0dfc263e_878b_3500_d535_fddc0e0dc915 33aff0f4_3c33_c7f6_34d2_7728d844b2e2["avatar"] f02a92c6_0fdc_9231_5419_752092d638ff --> 33aff0f4_3c33_c7f6_34d2_7728d844b2e2 bf2d636f_6015_e4c1_8092_f8992858a1ae["badge"] f02a92c6_0fdc_9231_5419_752092d638ff --> bf2d636f_6015_e4c1_8092_f8992858a1ae 7328fa0a_98b6_fe77_42fd_0d1582b24604["button"] f02a92c6_0fdc_9231_5419_752092d638ff --> 7328fa0a_98b6_fe77_42fd_0d1582b24604 20f0e6b3_a16f_5523_f44c_e3dd2e8e47ca["button-group"] f02a92c6_0fdc_9231_5419_752092d638ff --> 20f0e6b3_a16f_5523_f44c_e3dd2e8e47ca deffd1e6_798d_b7fd_c687_7ccabc947893["card"] f02a92c6_0fdc_9231_5419_752092d638ff --> deffd1e6_798d_b7fd_c687_7ccabc947893 d0febd7f_7a12_3e29_549e_74cdec6501df["checkbox"] f02a92c6_0fdc_9231_5419_752092d638ff --> d0febd7f_7a12_3e29_549e_74cdec6501df 8e406608_85e2_f05c_0c22_e16e2defe135["combobox"] f02a92c6_0fdc_9231_5419_752092d638ff --> 8e406608_85e2_f05c_0c22_e16e2defe135 ac307fe4_34c0_4667_089c_c9e7c15ca708["dropdown-menu"] f02a92c6_0fdc_9231_5419_752092d638ff --> ac307fe4_34c0_4667_089c_c9e7c15ca708 55bab6c5_37fc_a32d_630f_04db6fe6cb43["empty"] f02a92c6_0fdc_9231_5419_752092d638ff --> 55bab6c5_37fc_a32d_630f_04db6fe6cb43 8a527dea_9425_3da4_8ceb_ec3058568dc9["field"] f02a92c6_0fdc_9231_5419_752092d638ff --> 8a527dea_9425_3da4_8ceb_ec3058568dc9 106d51d9_3961_e810_478c_8a9c54987d20["input"] f02a92c6_0fdc_9231_5419_752092d638ff --> 106d51d9_3961_e810_478c_8a9c54987d20 style f02a92c6_0fdc_9231_5419_752092d638ff fill:#6366f1,stroke:#818cf8,color:#fff
Relationship Graph
Source Code
"use client"
import * as React from "react"
import { useState } from "react"
import {
Example,
ExampleWrapper,
} from "@/registry/bases/base/components/example"
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogMedia,
AlertDialogTitle,
AlertDialogTrigger,
} from "@/registry/bases/base/ui/alert-dialog"
import {
Avatar,
AvatarFallback,
AvatarGroup,
AvatarImage,
} from "@/registry/bases/base/ui/avatar"
import { Badge } from "@/registry/bases/base/ui/badge"
import { Button } from "@/registry/bases/base/ui/button"
import { ButtonGroup } from "@/registry/bases/base/ui/button-group"
import {
Card,
CardAction,
CardContent,
CardDescription,
CardFooter,
CardHeader,
CardTitle,
} from "@/registry/bases/base/ui/card"
import { Checkbox } from "@/registry/bases/base/ui/checkbox"
import {
Combobox,
ComboboxContent,
ComboboxEmpty,
ComboboxInput,
ComboboxItem,
ComboboxList,
} from "@/registry/bases/base/ui/combobox"
import {
DropdownMenu,
DropdownMenuCheckboxItem,
DropdownMenuContent,
DropdownMenuGroup,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuPortal,
DropdownMenuRadioGroup,
DropdownMenuRadioItem,
DropdownMenuSeparator,
DropdownMenuShortcut,
// ... (1640 more lines)
Domain
Subdomains
Functions
Dependencies
- alert-dialog
- avatar
- badge
- button
- button-group
- card
- checkbox
- combobox
- dropdown-menu
- empty
- example
- field
- icon-placeholder
- input
- input-group
- item
- label
- popover
- radio-group
- react
- select
- separator
- sheet
- slider
- spinner
- switch
- textarea
- tooltip
Source
Frequently Asked Questions
What does preview.tsx do?
preview.tsx is a source file in the ui codebase, written in tsx. It belongs to the ComponentRegistry domain, UIPrimitives subdomain.
What functions are defined in preview.tsx?
preview.tsx defines 12 function(s): BadgeExamples, ButtonGroupExamples, CoverExample, EmptyAvatarGroup, EmptyWithSpinner, FieldExamples, FormExample, InputGroupExamples, ItemExample, ObservabilityCard, and 2 more.
What does preview.tsx depend on?
preview.tsx imports 28 module(s): alert-dialog, avatar, badge, button, button-group, card, checkbox, combobox, and 20 more.
Where is preview.tsx in the architecture?
preview.tsx is located at apps/v4/registry/bases/base/blocks/preview.tsx (domain: ComponentRegistry, subdomain: UIPrimitives, directory: apps/v4/registry/bases/base/blocks).
Analyze Your Own Codebase
Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.
Try Supermodel Free