FieldInput() — ui Function Reference

Architecture documentation for the FieldInput() function in field-input.tsx from the ui codebase.

Function tsx DocumentationAtlas ContentSourcing

Entity Profile

DocumentationAtlas→ ContentSourcing→ FieldInput() — ui Function Reference

Dependency Diagram

graph TD
  20ef687f_d527_b608_8138_214cbfbadeb0["FieldInput()"]
  57c37ad9_153e_0946_9369_d668b162df49["field-input.tsx"]
  20ef687f_d527_b608_8138_214cbfbadeb0 -->|defined in| 57c37ad9_153e_0946_9369_d668b162df49
  style 20ef687f_d527_b608_8138_214cbfbadeb0 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/radix/field-input.tsx lines 10–31

export default function FieldInput() {
  return (
    <FieldSet className="w-full max-w-xs">
      <FieldGroup>
        <Field>
          <FieldLabel htmlFor="username">Username</FieldLabel>
          <Input id="username" type="text" placeholder="Max Leiter" />
          <FieldDescription>
            Choose a unique username for your account.
          </FieldDescription>
        </Field>
        <Field>
          <FieldLabel htmlFor="password">Password</FieldLabel>
          <FieldDescription>
            Must be at least 8 characters long.
          </FieldDescription>
          <Input id="password" type="password" placeholder="••••••••" />
        </Field>
      </FieldGroup>
    </FieldSet>
  )
}