RadioGroupChoiceCard() — ui Function Reference

Architecture documentation for the RadioGroupChoiceCard() function in radio-group-choice-card.tsx from the ui codebase.

Function tsx DocumentationAtlas SearchAPI

Entity Profile

DocumentationAtlas→ SearchAPI→ RadioGroupChoiceCard() — ui Function Reference

Dependency Diagram

graph TD
  dba5508a_7900_bc1c_4e79_3ca075c3c65b["RadioGroupChoiceCard()"]
  ca9afca3_6d4b_337c_86c7_32f0b8beaf51["radio-group-choice-card.tsx"]
  dba5508a_7900_bc1c_4e79_3ca075c3c65b -->|defined in| ca9afca3_6d4b_337c_86c7_32f0b8beaf51
  style dba5508a_7900_bc1c_4e79_3ca075c3c65b fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/radix/radio-group-choice-card.tsx lines 10–46

export function RadioGroupChoiceCard() {
  return (
    <RadioGroup defaultValue="plus" className="max-w-sm">
      <FieldLabel htmlFor="plus-plan">
        <Field orientation="horizontal">
          <FieldContent>
            <FieldTitle>Plus</FieldTitle>
            <FieldDescription>
              For individuals and small teams.
            </FieldDescription>
          </FieldContent>
          <RadioGroupItem value="plus" id="plus-plan" />
        </Field>
      </FieldLabel>
      <FieldLabel htmlFor="pro-plan">
        <Field orientation="horizontal">
          <FieldContent>
            <FieldTitle>Pro</FieldTitle>
            <FieldDescription>For growing businesses.</FieldDescription>
          </FieldContent>
          <RadioGroupItem value="pro" id="pro-plan" />
        </Field>
      </FieldLabel>
      <FieldLabel htmlFor="enterprise-plan">
        <Field orientation="horizontal">
          <FieldContent>
            <FieldTitle>Enterprise</FieldTitle>
            <FieldDescription>
              For large teams and enterprises.
            </FieldDescription>
          </FieldContent>
          <RadioGroupItem value="enterprise" id="enterprise-plan" />
        </Field>
      </FieldLabel>
    </RadioGroup>
  )
}