Profile() — ui Function Reference

Architecture documentation for the Profile() function in github.tsx from the ui codebase.

Function tsx ComponentRegistry ChartRegistry

Entity Profile

ComponentRegistry→ ChartRegistry→ Profile() — ui Function Reference

Dependency Diagram

graph TD
  77b34c7b_d3dd_3d1d_f34f_35fa1706df2f["Profile()"]
  37b4caef_d1dd_c771_008d_90d0735aa244["github.tsx"]
  77b34c7b_d3dd_3d1d_f34f_35fa1706df2f -->|defined in| 37b4caef_d1dd_c771_008d_90d0735aa244
  style 77b34c7b_d3dd_3d1d_f34f_35fa1706df2f fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/registry/bases/radix/blocks/github.tsx lines 1188–1238

function Profile() {
  return (
    <Example title="Profile" className="items-center justify-center">
      <Card className="mx-auto w-full max-w-md">
        <CardHeader>
          <CardTitle>Profile</CardTitle>
          <CardDescription>Manage your profile information.</CardDescription>
        </CardHeader>
        <CardContent>
          <form id="profile">
            <FieldGroup>
              <Field>
                <FieldLabel htmlFor="name">Name</FieldLabel>
                <Input id="name" placeholder="shadcn" />
                <FieldDescription>
                  Your name may appear around GitHub where you contribute or are
                  mentioned. You can remove it at any time.
                </FieldDescription>
              </Field>
              <Field>
                <FieldLabel htmlFor="email">Public Email</FieldLabel>
                <NativeSelect id="email">
                  <option value="m@shadcn.com">m@shadcn.com</option>
                  <option value="m@gmail.com">m@gmail.com</option>
                </NativeSelect>
                <FieldDescription>
                  You can manage verified email addresses in your{" "}
                  <a href="#email-settings">email settings</a>.
                </FieldDescription>
              </Field>
              <Field>
                <FieldLabel htmlFor="bio">Bio</FieldLabel>
                <Textarea
                  id="bio"
                  placeholder="Tell us a little bit about yourself"
                />
                <FieldDescription>
                  You can <span>@mention</span> other users and organizations to
                  link to them.
                </FieldDescription>
              </Field>
            </FieldGroup>
          </form>
        </CardContent>
        <CardFooter>
          <Button form="profile">Save Profile</Button>
        </CardFooter>
      </Card>
    </Example>
  )
}