Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.attio.com/llms.txt

Use this file to discover all available pages before exploring further.

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).