FieldRadio() — ui Function Reference

Architecture documentation for the FieldRadio() function in field-radio.tsx from the ui codebase.

Function tsx DocumentationAtlas SearchAPI

Entity Profile

DocumentationAtlas→ SearchAPI→ FieldRadio() — ui Function Reference

Dependency Diagram

graph TD
  1b599d9a_9c44_ecc8_d7e7_abe971d38fe5["FieldRadio()"]
  e7680a3a_8141_9e08_ec1a_00d56e3624cf["field-radio.tsx"]
  1b599d9a_9c44_ecc8_d7e7_abe971d38fe5 -->|defined in| e7680a3a_8141_9e08_ec1a_00d56e3624cf
  style 1b599d9a_9c44_ecc8_d7e7_abe971d38fe5 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/base/field-radio.tsx lines 10–39

export function FieldRadio() {
  return (
    <FieldSet className="w-full max-w-xs">
      <FieldLegend variant="label">Subscription Plan</FieldLegend>
      <FieldDescription>
        Yearly and lifetime plans offer significant savings.
      </FieldDescription>
      <RadioGroup defaultValue="monthly">
        <Field orientation="horizontal">
          <RadioGroupItem value="monthly" id="plan-monthly" />
          <FieldLabel htmlFor="plan-monthly" className="font-normal">
            Monthly ($9.99/month)
          </FieldLabel>
        </Field>
        <Field orientation="horizontal">
          <RadioGroupItem value="yearly" id="plan-yearly" />
          <FieldLabel htmlFor="plan-yearly" className="font-normal">
            Yearly ($99.99/year)
          </FieldLabel>
        </Field>
        <Field orientation="horizontal">
          <RadioGroupItem value="lifetime" id="plan-lifetime" />
          <FieldLabel htmlFor="plan-lifetime" className="font-normal">
            Lifetime ($299.99)
          </FieldLabel>
        </Field>
      </RadioGroup>
    </FieldSet>
  )
}