ui Architecture Docs
Home / File/ mdx-components.tsx — ui Source File

mdx-components.tsx — ui Source File

Architecture documentation for mdx-components.tsx, a tsx file in the ui codebase. 22 imports, 0 dependents.

File tsx DocumentationAtlas ContentSourcing 22 imports 1 functions

Entity Profile

Dependency Diagram

graph LR
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f["mdx-components.tsx"]
  1d141819_425e_b5fd_4c8e_32f7c6a42cf2["react"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> 1d141819_425e_b5fd_4c8e_32f7c6a42cf2
  3eb36dd7_f51a_1431_02e2_7abafe315718["image"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> 3eb36dd7_f51a_1431_02e2_7abafe315718
  ba3d44f3_7b34_f9cc_6283_44817785c0df["link"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> ba3d44f3_7b34_f9cc_6283_44817785c0df
  858e60a8_4233_8866_a501_707e973859f9["page-tree"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> 858e60a8_4233_8866_a501_707e973859f9
  b5f7acc2_8550_f8f0_0425_a71c6d434acd["source"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> b5f7acc2_8550_f8f0_0425_a71c6d434acd
  79081a1f_55a3_945a_fb8c_d53d6d3eab81["utils"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> 79081a1f_55a3_945a_fb8c_d53d6d3eab81
  2ed524bb_43b4_8b36_ba96_71693b08acd3["callout"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> 2ed524bb_43b4_8b36_ba96_71693b08acd3
  6376fc50_6942_1e18_ec42_0a4d4b19a698["code-block-command"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> 6376fc50_6942_1e18_ec42_0a4d4b19a698
  571632b7_8b4c_6184_6e9b_c90b8deac152["code-collapsible-wrapper"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> 571632b7_8b4c_6184_6e9b_c90b8deac152
  5c762ba8_e5b9_daaf_a3e1_5cd41240bd09["code-tabs"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> 5c762ba8_e5b9_daaf_a3e1_5cd41240bd09
  7478bc40_c1f7_407b_1a68_526885831907["component-preview"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> 7478bc40_c1f7_407b_1a68_526885831907
  dda68338_1183_340a_3c3e_bb23b5396d0d["component-source"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> dda68338_1183_340a_3c3e_bb23b5396d0d
  a09c1978_a86c_e053_5c34_f62be206e500["components-list"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> a09c1978_a86c_e053_5c34_f62be206e500
  402113bd_a10d_0255_fccf_87fa40fd281a["copy-button"]
  fd8bfdd9_c49c_2075_293b_5d3432ffd52f --> 402113bd_a10d_0255_fccf_87fa40fd281a
  style fd8bfdd9_c49c_2075_293b_5d3432ffd52f fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import * as React from "react"
import Image from "next/image"
import Link from "next/link"

import { type PageTreeFolder } from "@/lib/page-tree"
import { source } from "@/lib/source"
import { cn } from "@/lib/utils"
import { Callout } from "@/components/callout"
import { CodeBlockCommand } from "@/components/code-block-command"
import { CodeCollapsibleWrapper } from "@/components/code-collapsible-wrapper"
import { CodeTabs } from "@/components/code-tabs"
import { ComponentPreview } from "@/components/component-preview"
import { ComponentSource } from "@/components/component-source"
import { ComponentsList } from "@/components/components-list"
import { CopyButton } from "@/components/copy-button"
import { DirectoryList } from "@/components/directory-list"
import { getIconForLanguageExtension } from "@/components/icons"
import {
  Accordion,
  AccordionContent,
  AccordionItem,
  AccordionTrigger,
} from "@/registry/new-york-v4/ui/accordion"
import {
  Alert,
  AlertDescription,
  AlertTitle,
} from "@/registry/new-york-v4/ui/alert"
import { AspectRatio } from "@/registry/new-york-v4/ui/aspect-ratio"
import { Button } from "@/registry/new-york-v4/ui/button"
import { Kbd } from "@/registry/new-york-v4/ui/kbd"
import {
  Tabs,
  TabsContent,
  TabsList,
  TabsTrigger,
} from "@/registry/new-york-v4/ui/tabs"

// Wrapper component that passes the components folder from the server.
// This is only used on /docs/components/ index page, so default to radix.
function ComponentsListWrapper() {
  const componentsFolder = source.pageTree.children.find(
    (page) => page.$id === "components"
  )

  if (componentsFolder?.type !== "folder") {
    return null
  }

  return (
    <ComponentsList
      componentsFolder={componentsFolder as PageTreeFolder}
      currentBase="radix"
    />
  )
}

export const mdxComponents = {
  h1: ({ className, ...props }: React.ComponentProps<"h1">) => (
    <h1
// ... (329 more lines)

Domain

Subdomains

Functions

Dependencies

  • accordion
  • alert
  • aspect-ratio
  • button
  • callout
  • code-block-command
  • code-collapsible-wrapper
  • code-tabs
  • component-preview
  • component-source
  • components-list
  • copy-button
  • directory-list
  • icons
  • image
  • kbd
  • link
  • page-tree
  • react
  • source
  • tabs
  • utils

Source

Frequently Asked Questions

What does mdx-components.tsx do?
mdx-components.tsx is a source file in the ui codebase, written in tsx. It belongs to the DocumentationAtlas domain, ContentSourcing subdomain.
What functions are defined in mdx-components.tsx?
mdx-components.tsx defines 1 function(s): ComponentsListWrapper.
What does mdx-components.tsx depend on?
mdx-components.tsx imports 22 module(s): accordion, alert, aspect-ratio, button, callout, code-block-command, code-collapsible-wrapper, code-tabs, and 14 more.
Where is mdx-components.tsx in the architecture?
mdx-components.tsx is located at apps/v4/mdx-components.tsx (domain: DocumentationAtlas, subdomain: ContentSourcing, directory: apps/v4).

Analyze Your Own Codebase

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

Try Supermodel Free