FieldChoiceCard() — ui Function Reference

Architecture documentation for the FieldChoiceCard() function in field-choice-card.tsx from the ui codebase.

Function tsx DocumentationAtlas Changelog

Entity Profile

DocumentationAtlas→ Changelog→ FieldChoiceCard() — ui Function Reference

Dependency Diagram

graph TD
  a7a66592_2708_a1ae_e37d_2b33e90647d2["FieldChoiceCard()"]
  d729d51f_553c_e73c_9a68_cfc8a53d31f7["field-choice-card.tsx"]
  a7a66592_2708_a1ae_e37d_2b33e90647d2 -->|defined in| d729d51f_553c_e73c_9a68_cfc8a53d31f7
  style a7a66592_2708_a1ae_e37d_2b33e90647d2 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/base/field-choice-card.tsx lines 13–48

export default function FieldChoiceCard() {
  return (
    <FieldGroup className="w-full max-w-xs">
      <FieldSet>
        <FieldLegend variant="label">Compute Environment</FieldLegend>
        <FieldDescription>
          Select the compute environment for your cluster.
        </FieldDescription>
        <RadioGroup defaultValue="kubernetes">
          <FieldLabel htmlFor="kubernetes-r2h">
            <Field orientation="horizontal">
              <FieldContent>
                <FieldTitle>Kubernetes</FieldTitle>
                <FieldDescription>
                  Run GPU workloads on a K8s cluster.
                </FieldDescription>
              </FieldContent>
              <RadioGroupItem value="kubernetes" id="kubernetes-r2h" />
            </Field>
          </FieldLabel>
          <FieldLabel htmlFor="vm-z4k">
            <Field orientation="horizontal">
              <FieldContent>
                <FieldTitle>Virtual Machine</FieldTitle>
                <FieldDescription>
                  Access a cluster to run GPU workloads.
                </FieldDescription>
              </FieldContent>
              <RadioGroupItem value="vm" id="vm-z4k" />
            </Field>
          </FieldLabel>
        </RadioGroup>
      </FieldSet>
    </FieldGroup>
  )
}