ui Architecture Docs
Home / File/ button-group-example.tsx — ui Source File

button-group-example.tsx — ui Source File

Architecture documentation for button-group-example.tsx, a tsx file in the ui codebase. 11 imports, 0 dependents.

File tsx ComponentRegistry UIPrimitives 11 imports 18 functions

Entity Profile

Dependency Diagram

graph LR
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df["button-group-example.tsx"]
  f56be340_a522_c6f7_dec3_5906873d14c8["example"]
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df --> f56be340_a522_c6f7_dec3_5906873d14c8
  7328fa0a_98b6_fe77_42fd_0d1582b24604["button"]
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df --> 7328fa0a_98b6_fe77_42fd_0d1582b24604
  20f0e6b3_a16f_5523_f44c_e3dd2e8e47ca["button-group"]
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df --> 20f0e6b3_a16f_5523_f44c_e3dd2e8e47ca
  ac307fe4_34c0_4667_089c_c9e7c15ca708["dropdown-menu"]
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df --> ac307fe4_34c0_4667_089c_c9e7c15ca708
  8a527dea_9425_3da4_8ceb_ec3058568dc9["field"]
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df --> 8a527dea_9425_3da4_8ceb_ec3058568dc9
  106d51d9_3961_e810_478c_8a9c54987d20["input"]
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df --> 106d51d9_3961_e810_478c_8a9c54987d20
  1fc17a46_59d6_3716_6581_5cf015f0af50["input-group"]
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df --> 1fc17a46_59d6_3716_6581_5cf015f0af50
  00db19de_4bff_5fd7_3fcb_a9b94babaf3b["label"]
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df --> 00db19de_4bff_5fd7_3fcb_a9b94babaf3b
  d80c6389_7118_33c6_94f6_8ae48c4d9f8b["select"]
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df --> d80c6389_7118_33c6_94f6_8ae48c4d9f8b
  2b4184c3_5c46_f908_0cc6_fa22dfa7c663["tooltip"]
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df --> 2b4184c3_5c46_f908_0cc6_fa22dfa7c663
  de6fac54_74ca_6c25_8f8b_d1ba3287dbf2["icon-placeholder"]
  d41ef55a_d021_eff9_a1f7_cf3a6ebe42df --> de6fac54_74ca_6c25_8f8b_d1ba3287dbf2
  style d41ef55a_d021_eff9_a1f7_cf3a6ebe42df fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

"use client"

import {
  Example,
  ExampleWrapper,
} from "@/registry/bases/base/components/example"
import { Button } from "@/registry/bases/base/ui/button"
import {
  ButtonGroup,
  ButtonGroupText,
} from "@/registry/bases/base/ui/button-group"
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuGroup,
  DropdownMenuItem,
  DropdownMenuSeparator,
  DropdownMenuTrigger,
} from "@/registry/bases/base/ui/dropdown-menu"
import { Field, FieldGroup } from "@/registry/bases/base/ui/field"
import { Input } from "@/registry/bases/base/ui/input"
import {
  InputGroup,
  InputGroupAddon,
  InputGroupInput,
} from "@/registry/bases/base/ui/input-group"
import { Label } from "@/registry/bases/base/ui/label"
import {
  Select,
  SelectContent,
  SelectGroup,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from "@/registry/bases/base/ui/select"
import {
  Tooltip,
  TooltipContent,
  TooltipTrigger,
} from "@/registry/bases/base/ui/tooltip"
import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"

export default function ButtonGroupExample() {
  return (
    <ExampleWrapper>
      <ButtonGroupBasic />
      <ButtonGroupWithInput />
      <ButtonGroupWithText />
      <ButtonGroupWithDropdown />
      <ButtonGroupWithSelect />
      <ButtonGroupWithIcons />
      <ButtonGroupWithInputGroup />
      <ButtonGroupWithFields />
      <ButtonGroupWithLike />
      <ButtonGroupWithSelectAndInput />
      <ButtonGroupNested />
      <ButtonGroupPagination />
      <ButtonGroupPaginationSplit />
      <ButtonGroupNavigation />
      <ButtonGroupTextAlignment />
// ... (690 more lines)

Domain

Subdomains

Functions

Dependencies

  • button
  • button-group
  • dropdown-menu
  • example
  • field
  • icon-placeholder
  • input
  • input-group
  • label
  • select
  • tooltip

Source

Frequently Asked Questions

What does button-group-example.tsx do?
button-group-example.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 button-group-example.tsx?
button-group-example.tsx defines 18 function(s): ButtonGroupBasic, ButtonGroupExample, ButtonGroupNavigation, ButtonGroupNested, ButtonGroupPagination, ButtonGroupPaginationSplit, ButtonGroupTextAlignment, ButtonGroupVertical, ButtonGroupVerticalNested, ButtonGroupWithDropdown, and 8 more.
What does button-group-example.tsx depend on?
button-group-example.tsx imports 11 module(s): button, button-group, dropdown-menu, example, field, icon-placeholder, input, input-group, and 3 more.
Where is button-group-example.tsx in the architecture?
button-group-example.tsx is located at apps/v4/registry/bases/base/examples/button-group-example.tsx (domain: ComponentRegistry, subdomain: UIPrimitives, directory: apps/v4/registry/bases/base/examples).

Analyze Your Own Codebase

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

Try Supermodel Free