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

select.tsx — ui Source File

Architecture documentation for select.tsx, a tsx file in the ui codebase. 4 imports, 0 dependents.

File tsx ComponentRegistry ChartRegistry 4 imports 7 functions

Entity Profile

Dependency Diagram

graph LR
  1d7cc6d2_901a_09b3_af7d_2edd7f293757["select.tsx"]
  1d141819_425e_b5fd_4c8e_32f7c6a42cf2["react"]
  1d7cc6d2_901a_09b3_af7d_2edd7f293757 --> 1d141819_425e_b5fd_4c8e_32f7c6a42cf2
  ffcc9928_5c20_2e4d_edca_1bfec87c47c8["react-select"]
  1d7cc6d2_901a_09b3_af7d_2edd7f293757 --> ffcc9928_5c20_2e4d_edca_1bfec87c47c8
  d39cd1e4_1b2d_9aa2_1d29_fd0b4bfb61c3["lucide-react"]
  1d7cc6d2_901a_09b3_af7d_2edd7f293757 --> d39cd1e4_1b2d_9aa2_1d29_fd0b4bfb61c3
  79081a1f_55a3_945a_fb8c_d53d6d3eab81["utils"]
  1d7cc6d2_901a_09b3_af7d_2edd7f293757 --> 79081a1f_55a3_945a_fb8c_d53d6d3eab81
  style 1d7cc6d2_901a_09b3_af7d_2edd7f293757 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

"use client"

import * as React from "react"
import * as SelectPrimitive from "@radix-ui/react-select"
import { Check, ChevronDown, ChevronUp } from "lucide-react"

import { cn } from "@/lib/utils"

const Select = SelectPrimitive.Root

const SelectGroup = SelectPrimitive.Group

const SelectValue = SelectPrimitive.Value

const SelectTrigger = React.forwardRef<
  React.ElementRef<typeof SelectPrimitive.Trigger>,
  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>
>(({ className, children, ...props }, ref) => (
  <SelectPrimitive.Trigger
    ref={ref}
    className={cn(
      "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
      className
    )}
    {...props}
  >
    {children}
    <SelectPrimitive.Icon asChild>
      <ChevronDown className="h-4 w-4 opacity-50" />
    </SelectPrimitive.Icon>
  </SelectPrimitive.Trigger>
))
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName

const SelectScrollUpButton = React.forwardRef<
  React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>
>(({ className, ...props }, ref) => (
  <SelectPrimitive.ScrollUpButton
    ref={ref}
    className={cn(
      "flex cursor-default items-center justify-center py-1",
      className
    )}
    {...props}
  >
    <ChevronUp className="h-4 w-4" />
  </SelectPrimitive.ScrollUpButton>
))
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName

const SelectScrollDownButton = React.forwardRef<
  React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>
>(({ className, ...props }, ref) => (
  <SelectPrimitive.ScrollDownButton
    ref={ref}
    className={cn(
      "flex cursor-default items-center justify-center py-1",
      className
// ... (101 more lines)

Domain

Subdomains

Functions

Dependencies

  • lucide-react
  • react
  • react-select
  • utils

Source

Frequently Asked Questions

What does select.tsx do?
select.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 select.tsx?
select.tsx defines 7 function(s): SelectContent, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger.
What does select.tsx depend on?
select.tsx imports 4 module(s): lucide-react, react, react-select, utils.
Where is select.tsx in the architecture?
select.tsx is located at deprecated/www/registry/default/ui/select.tsx (domain: ComponentRegistry, subdomain: ChartRegistry, directory: deprecated/www/registry/default/ui).

Analyze Your Own Codebase

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

Try Supermodel Free