ui Architecture Docs
Home / File/ block-viewer.tsx — ui Source File

block-viewer.tsx — ui Source File

Architecture documentation for block-viewer.tsx, a tsx file in the ui codebase. 19 imports, 0 dependents.

File tsx ComponentRegistry UIPrimitives 19 imports 12 functions

Entity Profile

Dependency Diagram

graph LR
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50["block-viewer.tsx"]
  1d141819_425e_b5fd_4c8e_32f7c6a42cf2["react"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> 1d141819_425e_b5fd_4c8e_32f7c6a42cf2
  3eb36dd7_f51a_1431_02e2_7abafe315718["image"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> 3eb36dd7_f51a_1431_02e2_7abafe315718
  ba3d44f3_7b34_f9cc_6283_44817785c0df["link"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> ba3d44f3_7b34_f9cc_6283_44817785c0df
  d39cd1e4_1b2d_9aa2_1d29_fd0b4bfb61c3["lucide-react"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> d39cd1e4_1b2d_9aa2_1d29_fd0b4bfb61c3
  e3a189ea_cc83_2570_3f47_ad87ecca3ddc["react-resizable-panels"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> e3a189ea_cc83_2570_3f47_ad87ecca3ddc
  ceec689a_1334_a657_3c35_094070222b09["schema"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> ceec689a_1334_a657_3c35_094070222b09
  6802ce19_522d_e5fb_e458_8826d9f6952e["zod"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> 6802ce19_522d_e5fb_e458_8826d9f6952e
  a9903b11_2f1d_8437_2ec7_acd8ba077fa8["events"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> a9903b11_2f1d_8437_2ec7_acd8ba077fa8
  7a25f51b_551e_131b_bc51_bd5ccc7c308c["registry"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> 7a25f51b_551e_131b_bc51_bd5ccc7c308c
  16fc7cf6_3e3a_9efc_f45b_63496f779853["use-copy-to-clipboard"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> 16fc7cf6_3e3a_9efc_f45b_63496f779853
  68195618_3220_1f0a_c337_b26b6731e44a["v0-button"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> 68195618_3220_1f0a_c337_b26b6731e44a
  aa2f3ec6_f291_3763_88ec_65a3f5ad5939["button"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> aa2f3ec6_f291_3763_88ec_65a3f5ad5939
  3569d809_9117_156a_db42_ebbe426ff35a["collapsible"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> 3569d809_9117_156a_db42_ebbe426ff35a
  89621339_3efc_0932_6655_aebfb386fc45["resizable"]
  1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 --> 89621339_3efc_0932_6655_aebfb386fc45
  style 1286b7b7_c8bd_53b6_a231_a71e5b6ebd50 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

"use client"

import * as React from "react"
import Image from "next/image"
import Link from "next/link"
import {
  Check,
  ChevronRight,
  Clipboard,
  File,
  Folder,
  Fullscreen,
  Monitor,
  Smartphone,
  Tablet,
  Terminal,
} from "lucide-react"
import { ImperativePanelHandle } from "react-resizable-panels"
import { registryItemFileSchema, registryItemSchema } from "shadcn/schema"
import { z } from "zod"

import { trackEvent } from "@/lib/events"
import { FileTree, createFileTreeForRegistryItemFiles } from "@/lib/registry"
import { useCopyToClipboard } from "@/hooks/use-copy-to-clipboard"
import { V0Button } from "@/components/v0-button"
import { Button } from "@/registry/new-york/ui/button"
import {
  Collapsible,
  CollapsibleContent,
  CollapsibleTrigger,
} from "@/registry/new-york/ui/collapsible"
import {
  ResizableHandle,
  ResizablePanel,
  ResizablePanelGroup,
} from "@/registry/new-york/ui/resizable"
import { Separator } from "@/registry/new-york/ui/separator"
import {
  Sidebar,
  SidebarGroup,
  SidebarGroupContent,
  SidebarGroupLabel,
  SidebarMenu,
  SidebarMenuButton,
  SidebarMenuItem,
  SidebarMenuSub,
  SidebarProvider,
} from "@/registry/new-york/ui/sidebar"
import { Tabs, TabsList, TabsTrigger } from "@/registry/new-york/ui/tabs"
import {
  ToggleGroup,
  ToggleGroupItem,
} from "@/registry/new-york/ui/toggle-group"
import { Style } from "@/registry/registry-styles"

type BlockViewerContext = {
  item: z.infer<typeof registryItemSchema>
  view: "code" | "preview"
  setView: (view: "code" | "preview") => void
  style?: Style["name"]
// ... (395 more lines)

Domain

Subdomains

Functions

Types

Dependencies

  • button
  • collapsible
  • events
  • image
  • link
  • lucide-react
  • react
  • react-resizable-panels
  • registry
  • registry-styles
  • resizable
  • schema
  • separator
  • sidebar
  • tabs
  • toggle-group
  • use-copy-to-clipboard
  • v0-button
  • zod

Source

Frequently Asked Questions

What does block-viewer.tsx do?
block-viewer.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 block-viewer.tsx?
block-viewer.tsx defines 12 function(s): BlockCopyCodeButton, BlockViewer, BlockViewerCode, BlockViewerFileTree, BlockViewerProvider, BlockViewerToolbar, BlockViewerView, Tree, file, style, and 2 more.
What does block-viewer.tsx depend on?
block-viewer.tsx imports 19 module(s): button, collapsible, events, image, link, lucide-react, react, react-resizable-panels, and 11 more.
Where is block-viewer.tsx in the architecture?
block-viewer.tsx is located at deprecated/www/components/block-viewer.tsx (domain: ComponentRegistry, subdomain: UIPrimitives, directory: deprecated/www/components).

Analyze Your Own Codebase

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

Try Supermodel Free