ToggleGroupSpacing() — ui Function Reference

Architecture documentation for the ToggleGroupSpacing() function in toggle-group-spacing.tsx from the ui codebase.

Function tsx DocumentationAtlas Changelog

Entity Profile

DocumentationAtlas→ Changelog→ ToggleGroupSpacing() — ui Function Reference

Dependency Diagram

graph TD
  cbc31977_6700_4a3a_b87e_1eddb95bb374["ToggleGroupSpacing()"]
  3bf51a21_afca_f182_1c5a_a794a34091a2["toggle-group-spacing.tsx"]
  cbc31977_6700_4a3a_b87e_1eddb95bb374 -->|defined in| 3bf51a21_afca_f182_1c5a_a794a34091a2
  style cbc31977_6700_4a3a_b87e_1eddb95bb374 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/base/toggle-group-spacing.tsx lines 3–20

export function ToggleGroupSpacing() {
  return (
    <ToggleGroup size="sm" defaultValue={["top"]} variant="outline" spacing={2}>
      <ToggleGroupItem value="top" aria-label="Toggle top">
        Top
      </ToggleGroupItem>
      <ToggleGroupItem value="bottom" aria-label="Toggle bottom">
        Bottom
      </ToggleGroupItem>
      <ToggleGroupItem value="left" aria-label="Toggle left">
        Left
      </ToggleGroupItem>
      <ToggleGroupItem value="right" aria-label="Toggle right">
        Right
      </ToggleGroupItem>
    </ToggleGroup>
  )
}