ToggleSizes() — ui Function Reference

Architecture documentation for the ToggleSizes() function in toggle-sizes.tsx from the ui codebase.

Function tsx DocumentationAtlas ContentSourcing

Entity Profile

DocumentationAtlas→ ContentSourcing→ ToggleSizes() — ui Function Reference

Dependency Diagram

graph TD
  01f1de54_e6ad_6f72_e145_b4f52ee9ebd2["ToggleSizes()"]
  4351dc30_2825_0816_068b_84d74b116b26["toggle-sizes.tsx"]
  01f1de54_e6ad_6f72_e145_b4f52ee9ebd2 -->|defined in| 4351dc30_2825_0816_068b_84d74b116b26
  style 01f1de54_e6ad_6f72_e145_b4f52ee9ebd2 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/radix/toggle-sizes.tsx lines 3–17

export function ToggleSizes() {
  return (
    <div className="flex flex-wrap items-center gap-2">
      <Toggle variant="outline" aria-label="Toggle small" size="sm">
        Small
      </Toggle>
      <Toggle variant="outline" aria-label="Toggle default" size="default">
        Default
      </Toggle>
      <Toggle variant="outline" aria-label="Toggle large" size="lg">
        Large
      </Toggle>
    </div>
  )
}