ui Architecture Docs
Home / File/ popover-alignments.tsx — ui Source File

popover-alignments.tsx — ui Source File

Architecture documentation for popover-alignments.tsx, a tsx file in the ui codebase. 2 imports, 0 dependents.

File tsx DocumentationAtlas Changelog 2 imports 1 functions

Entity Profile

Dependency Diagram

graph LR
  567cee51_6914_fa06_f8b0_5e75674b5cff["popover-alignments.tsx"]
  4b1d2128_46d9_46f0_b915_b6e1925b7876["button"]
  567cee51_6914_fa06_f8b0_5e75674b5cff --> 4b1d2128_46d9_46f0_b915_b6e1925b7876
  97b1d83c_62f2_f7a6_4edb_030a627d9a9d["popover"]
  567cee51_6914_fa06_f8b0_5e75674b5cff --> 97b1d83c_62f2_f7a6_4edb_030a627d9a9d
  style 567cee51_6914_fa06_f8b0_5e75674b5cff fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { Button } from "@/examples/radix/ui/button"
import {
  Popover,
  PopoverContent,
  PopoverTrigger,
} from "@/examples/radix/ui/popover"

export function PopoverAlignments() {
  return (
    <div className="flex gap-6">
      <Popover>
        <PopoverTrigger asChild>
          <Button variant="outline" size="sm">
            Start
          </Button>
        </PopoverTrigger>
        <PopoverContent align="start" className="w-40">
          Aligned to start
        </PopoverContent>
      </Popover>
      <Popover>
        <PopoverTrigger asChild>
          <Button variant="outline" size="sm">
            Center
          </Button>
        </PopoverTrigger>
        <PopoverContent align="center" className="w-40">
          Aligned to center
        </PopoverContent>
      </Popover>
      <Popover>
        <PopoverTrigger asChild>
          <Button variant="outline" size="sm">
            End
          </Button>
        </PopoverTrigger>
        <PopoverContent align="end" className="w-40">
          Aligned to end
        </PopoverContent>
      </Popover>
    </div>
  )
}

Domain

Subdomains

Functions

Dependencies

  • button
  • popover

Source

Frequently Asked Questions

What does popover-alignments.tsx do?
popover-alignments.tsx is a source file in the ui codebase, written in tsx. It belongs to the DocumentationAtlas domain, Changelog subdomain.
What functions are defined in popover-alignments.tsx?
popover-alignments.tsx defines 1 function(s): PopoverAlignments.
What does popover-alignments.tsx depend on?
popover-alignments.tsx imports 2 module(s): button, popover.
Where is popover-alignments.tsx in the architecture?
popover-alignments.tsx is located at apps/v4/examples/radix/popover-alignments.tsx (domain: DocumentationAtlas, subdomain: Changelog, directory: apps/v4/examples/radix).

Analyze Your Own Codebase

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

Try Supermodel Free