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

radio-group-example.tsx — ui Source File

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

File tsx ComponentRegistry ChartRegistry 3 imports 7 functions

Entity Profile

Dependency Diagram

graph LR
  d12829dd_5ced_9aa9_2bcb_2101c3088829["radio-group-example.tsx"]
  da02b53a_0c1d_d1a1_af31_74d99f1cdd7a["example"]
  d12829dd_5ced_9aa9_2bcb_2101c3088829 --> da02b53a_0c1d_d1a1_af31_74d99f1cdd7a
  e2659e08_4bcd_4a08_ab57_ce3a18c3b284["field"]
  d12829dd_5ced_9aa9_2bcb_2101c3088829 --> e2659e08_4bcd_4a08_ab57_ce3a18c3b284
  5cd858e9_1e62_eeb9_0ee4_aabdd8ff0389["radio-group"]
  d12829dd_5ced_9aa9_2bcb_2101c3088829 --> 5cd858e9_1e62_eeb9_0ee4_aabdd8ff0389
  style d12829dd_5ced_9aa9_2bcb_2101c3088829 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import {
  Example,
  ExampleWrapper,
} from "@/registry/bases/radix/components/example"
import {
  Field,
  FieldContent,
  FieldDescription,
  FieldLabel,
  FieldLegend,
  FieldSet,
} from "@/registry/bases/radix/ui/field"
import {
  RadioGroup,
  RadioGroupItem,
} from "@/registry/bases/radix/ui/radio-group"

export default function RadioGroupExample() {
  return (
    <ExampleWrapper>
      <RadioGroupBasic />
      <RadioGroupWithDescriptions />
      <RadioGroupWithFieldSet />
      <RadioGroupGrid />
      <RadioGroupDisabled />
      <RadioGroupInvalid />
    </ExampleWrapper>
  )
}

function RadioGroupBasic() {
  return (
    <Example title="Basic">
      <RadioGroup defaultValue="comfortable">
        <Field orientation="horizontal">
          <RadioGroupItem value="default" id="r1" />
          <FieldLabel htmlFor="r1" className="font-normal">
            Default
          </FieldLabel>
        </Field>
        <Field orientation="horizontal">
          <RadioGroupItem value="comfortable" id="r2" />
          <FieldLabel htmlFor="r2" className="font-normal">
            Comfortable
          </FieldLabel>
        </Field>
        <Field orientation="horizontal">
          <RadioGroupItem value="compact" id="r3" />
          <FieldLabel htmlFor="r3" className="font-normal">
            Compact
          </FieldLabel>
        </Field>
      </RadioGroup>
    </Example>
  )
}

function RadioGroupWithDescriptions() {
  return (
    <Example title="With Descriptions">
// ... (163 more lines)

Domain

Subdomains

Functions

Dependencies

  • example
  • field
  • radio-group

Source

Frequently Asked Questions

What does radio-group-example.tsx do?
radio-group-example.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 radio-group-example.tsx?
radio-group-example.tsx defines 7 function(s): RadioGroupBasic, RadioGroupDisabled, RadioGroupExample, RadioGroupGrid, RadioGroupInvalid, RadioGroupWithDescriptions, RadioGroupWithFieldSet.
What does radio-group-example.tsx depend on?
radio-group-example.tsx imports 3 module(s): example, field, radio-group.
Where is radio-group-example.tsx in the architecture?
radio-group-example.tsx is located at apps/v4/registry/bases/radix/examples/radio-group-example.tsx (domain: ComponentRegistry, subdomain: ChartRegistry, directory: apps/v4/registry/bases/radix/examples).

Analyze Your Own Codebase

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

Try Supermodel Free