This component is returned by useForm().

Example

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

export function MeetingForm() {
  const {Form, SubmitButton, Experimental_DateTimeInput} = useForm(
    {
      meetingTime: Forms.dateTime(),
    },
    {}
  )
  return (
    <Form
      onSubmit={async (values) => {
        await showToast({
          title: "Form submitted",
          variant: "success",
          text: `Meeting scheduled for ${values.meetingTime?.toLocaleString()}`,
        })
      }}
    >
      <Experimental_DateTimeInput label="Meeting Time" name="meetingTime" />
      <SubmitButton label="Submit" />
    </Form>
  )
}

Props

label
string
required
The label of the date and time input field.
name
string
required
The path to the dateTime value of the input field in your form schema.e.g. "meeting_time", "user.last_login"
disabled
boolean
Whether or not the field should be disabled.Defaults to false (not disabled).