Skip to main content
This component is returned by useForm().

Example

task-form.tsx
import React from "react"
import {Forms, useForm, showToast} from "attio/client"

export function TaskForm() {
  const {Form, SubmitButton, TextInput, AttioUserCombobox} = useForm(
    {
      title: Forms.string(),
      description: Forms.string().multiline(),
      assignToId: Forms.string(),
    },
    {}
  )
  return (
    <Form
      onSubmit={async (values) => {
        await showToast({
          title: "Form submitted",
          variant: "success",
          text: `Task "${values.title}" was assigned to workspace member ID ${values.assignToId}`,
        })
      }}
    >
      <TextInput label="Title" name="title" />
      <TextInput label="Description" name="description" />
      <AttioUserCombobox label="Assign to" name="assignToId" />
      <SubmitButton label="Submit" />
    </Form>
  )
}

Props

label
string
required
The label of the Attio workspace user combobox input field.
name
string
required
The path to the string value of the input field in your form schema. e.g. "user", "task.assigned_to_id"
disabled
boolean
Whether or not the field should be disabled.Defaults to false (not disabled).