Elements

57 / 59 · Generative

Create task

A short task-creation Form: title, description, due date, and a submit button.

Installation

npm install @assistant-ui/react-generative-ui

Usage

import { renderGenerativeUI } from "@assistant-ui/react-generative-ui";

<div data-aui-theme="elements">
  {renderGenerativeUI(spec, library, { status: "done" })}
</div>

Spec

Interaction
{
  "$type": "Form",
  "$action": {
    "type": "create_task"
  },
  "children": [
    {
      "$type": "Input",
      "$key": "title",
      "name": "title",
      "label": "Title",
      "placeholder": "Task title"
    },
    {
      "$type": "Input",
      "$key": "description",
      "name": "description",
      "label": "Description",
      "multiline": true,
      "placeholder": "Add more detail..."
    },
    {
      "$type": "DatePicker",
      "$key": "due",
      "name": "dueDate",
      "label": "Due date"
    },
    {
      "$type": "Button",
      "$key": "create",
      "label": "Create task",
      "buttonStyle": "primary",
      "block": true,
      "submit": true
    }
  ]
}

Component vocabulary →