ui Architecture Docs
Home / File/ breadcrumb-responsive.tsx — ui Source File

breadcrumb-responsive.tsx — ui Source File

Architecture documentation for breadcrumb-responsive.tsx, a tsx file in the ui codebase. 7 imports, 0 dependents.

File tsx ComponentRegistry ChartRegistry 7 imports 1 functions

Entity Profile

Dependency Diagram

graph LR
  e99d4e5a_5aec_8468_2d26_80172e5e432d["breadcrumb-responsive.tsx"]
  1d141819_425e_b5fd_4c8e_32f7c6a42cf2["react"]
  e99d4e5a_5aec_8468_2d26_80172e5e432d --> 1d141819_425e_b5fd_4c8e_32f7c6a42cf2
  ba3d44f3_7b34_f9cc_6283_44817785c0df["link"]
  e99d4e5a_5aec_8468_2d26_80172e5e432d --> ba3d44f3_7b34_f9cc_6283_44817785c0df
  5b9fe790_07fa_d673_2d62_394a21141145["use-media-query"]
  e99d4e5a_5aec_8468_2d26_80172e5e432d --> 5b9fe790_07fa_d673_2d62_394a21141145
  ae3635e3_d1ef_d848_ce80_aa7c696f0ec1["breadcrumb"]
  e99d4e5a_5aec_8468_2d26_80172e5e432d --> ae3635e3_d1ef_d848_ce80_aa7c696f0ec1
  57e86e45_ac6e_7278_be08_9092724e8401["button"]
  e99d4e5a_5aec_8468_2d26_80172e5e432d --> 57e86e45_ac6e_7278_be08_9092724e8401
  538a1992_2e44_c995_0fe9_493e88eb6ea5["drawer"]
  e99d4e5a_5aec_8468_2d26_80172e5e432d --> 538a1992_2e44_c995_0fe9_493e88eb6ea5
  d1cb37f2_0d1d_01bc_0d60_a15219afac51["dropdown-menu"]
  e99d4e5a_5aec_8468_2d26_80172e5e432d --> d1cb37f2_0d1d_01bc_0d60_a15219afac51
  style e99d4e5a_5aec_8468_2d26_80172e5e432d fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

"use client"

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

import { useMediaQuery } from "@/hooks/use-media-query"
import {
  Breadcrumb,
  BreadcrumbEllipsis,
  BreadcrumbItem,
  BreadcrumbLink,
  BreadcrumbList,
  BreadcrumbPage,
  BreadcrumbSeparator,
} from "@/registry/new-york-v4/ui/breadcrumb"
import { Button } from "@/registry/new-york-v4/ui/button"
import {
  Drawer,
  DrawerClose,
  DrawerContent,
  DrawerDescription,
  DrawerFooter,
  DrawerHeader,
  DrawerTitle,
  DrawerTrigger,
} from "@/registry/new-york-v4/ui/drawer"
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuTrigger,
} from "@/registry/new-york-v4/ui/dropdown-menu"

const items = [
  { href: "#", label: "Home" },
  { href: "#", label: "Documentation" },
  { href: "#", label: "Build Your Application" },
  { href: "#", label: "Data Fetching" },
  { label: "Caching and Revalidating" },
]

const ITEMS_TO_DISPLAY = 3

export default function BreadcrumbResponsive() {
  const [open, setOpen] = React.useState(false)
  const isDesktop = useMediaQuery("(min-width: 768px)")

  return (
    <Breadcrumb>
      <BreadcrumbList>
        <BreadcrumbItem>
          <BreadcrumbLink asChild>
            <Link href={items[0].href ?? "/"}>{items[0].label}</Link>
          </BreadcrumbLink>
        </BreadcrumbItem>
        <BreadcrumbSeparator />
        {items.length > ITEMS_TO_DISPLAY ? (
          <>
            <BreadcrumbItem>
              {isDesktop ? (
// ... (76 more lines)

Domain

Subdomains

Functions

Dependencies

  • breadcrumb
  • button
  • drawer
  • dropdown-menu
  • link
  • react
  • use-media-query

Source

Frequently Asked Questions

What does breadcrumb-responsive.tsx do?
breadcrumb-responsive.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 breadcrumb-responsive.tsx?
breadcrumb-responsive.tsx defines 1 function(s): BreadcrumbResponsive.
What does breadcrumb-responsive.tsx depend on?
breadcrumb-responsive.tsx imports 7 module(s): breadcrumb, button, drawer, dropdown-menu, link, react, use-media-query.
Where is breadcrumb-responsive.tsx in the architecture?
breadcrumb-responsive.tsx is located at apps/v4/registry/new-york-v4/examples/breadcrumb-responsive.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