ui Architecture Docs
Home / File/ sidebar.tsx — ui Source File

sidebar.tsx — ui Source File

Architecture documentation for sidebar.tsx, a tsx file in the ui codebase. 5 imports, 1 dependents.

File tsx ComponentRegistry UIPrimitives 5 imports 1 dependents 1 functions

Entity Profile

Dependency Diagram

graph LR
  2c088549_d62b_0edf_84f1_877cd2093245["sidebar.tsx"]
  163e8432_9f96_406b_3feb_33518ea942ea["playlists.ts"]
  2c088549_d62b_0edf_84f1_877cd2093245 --> 163e8432_9f96_406b_3feb_33518ea942ea
  d4bb3a85_22f9_01fb_3a64_2a74e85ab274["Playlist"]
  2c088549_d62b_0edf_84f1_877cd2093245 --> d4bb3a85_22f9_01fb_3a64_2a74e85ab274
  79081a1f_55a3_945a_fb8c_d53d6d3eab81["utils"]
  2c088549_d62b_0edf_84f1_877cd2093245 --> 79081a1f_55a3_945a_fb8c_d53d6d3eab81
  aa2f3ec6_f291_3763_88ec_65a3f5ad5939["button"]
  2c088549_d62b_0edf_84f1_877cd2093245 --> aa2f3ec6_f291_3763_88ec_65a3f5ad5939
  87012fb0_00c6_7ce4_2418_e4e3b26e5dac["scroll-area"]
  2c088549_d62b_0edf_84f1_877cd2093245 --> 87012fb0_00c6_7ce4_2418_e4e3b26e5dac
  054ca25e_f665_64b0_351d_ed2a653946c8["page.tsx"]
  054ca25e_f665_64b0_351d_ed2a653946c8 --> 2c088549_d62b_0edf_84f1_877cd2093245
  style 2c088549_d62b_0edf_84f1_877cd2093245 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { cn } from "@/lib/utils"
import { Button } from "@/registry/new-york/ui/button"
import { ScrollArea } from "@/registry/new-york/ui/scroll-area"

import { Playlist } from "../data/playlists"

interface SidebarProps extends React.HTMLAttributes<HTMLDivElement> {
  playlists: Playlist[]
}

export function Sidebar({ className, playlists }: SidebarProps) {
  return (
    <div className={cn("pb-12", className)}>
      <div className="space-y-4 py-4">
        <div className="px-3 py-2">
          <h2 className="mb-2 px-4 text-lg font-semibold tracking-tight">
            Discover
          </h2>
          <div className="space-y-1">
            <Button variant="secondary" className="w-full justify-start">
              <svg
                xmlns="http://www.w3.org/2000/svg"
                viewBox="0 0 24 24"
                fill="none"
                stroke="currentColor"
                strokeWidth="2"
                strokeLinecap="round"
                strokeLinejoin="round"
                className="mr-2 h-4 w-4"
              >
                <circle cx="12" cy="12" r="10" />
                <polygon points="10 8 16 12 10 16 10 8" />
              </svg>
              Listen Now
            </Button>
            <Button variant="ghost" className="w-full justify-start">
              <svg
                xmlns="http://www.w3.org/2000/svg"
                viewBox="0 0 24 24"
                fill="none"
                stroke="currentColor"
                strokeWidth="2"
                strokeLinecap="round"
                strokeLinejoin="round"
                className="mr-2 h-4 w-4"
              >
                <rect width="7" height="7" x="3" y="3" rx="1" />
                <rect width="7" height="7" x="14" y="3" rx="1" />
                <rect width="7" height="7" x="14" y="14" rx="1" />
                <rect width="7" height="7" x="3" y="14" rx="1" />
              </svg>
              Browse
            </Button>
            <Button variant="ghost" className="w-full justify-start">
              <svg
                xmlns="http://www.w3.org/2000/svg"
                viewBox="0 0 24 24"
                fill="none"
                stroke="currentColor"
                strokeWidth="2"
// ... (145 more lines)

Domain

Subdomains

Functions

Types

Dependencies

Imported By

Source

Frequently Asked Questions

What does sidebar.tsx do?
sidebar.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 sidebar.tsx?
sidebar.tsx defines 1 function(s): Sidebar.
What does sidebar.tsx depend on?
sidebar.tsx imports 5 module(s): Playlist, button, playlists.ts, scroll-area, utils.
What files import sidebar.tsx?
sidebar.tsx is imported by 1 file(s): page.tsx.
Where is sidebar.tsx in the architecture?
sidebar.tsx is located at deprecated/www/app/(app)/examples/music/components/sidebar.tsx (domain: ComponentRegistry, subdomain: UIPrimitives, directory: deprecated/www/app/(app)/examples/music/components).

Analyze Your Own Codebase

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

Try Supermodel Free