Chat input

The chat input component wraps a textarea in Density input styling and includes a send button.

import { Button, ChatInput, Panel } from "density-base-ui";

export default function ChatInputExample() {
  return (
    <Panel>
      <form
        aria-label="Chat composer"
        onSubmit={(event) => {
          event.preventDefault();
        }}
      >
        <ChatInput
          aria-label="Message"
          defaultValue="Summarize the release notes"
          optionsContent={<Button type="button">Draft</Button>}
        />
      </form>
    </Panel>
  );
}

Props

Prop	Attribute	Values	Default
`optionsContent`	None	React node	None
`density-size`	`data-dn-size`	Density size	`md`
textarea props	Native textarea attributes	Native	Native

Options content

Use optionsContent for model selectors, attachment controls, or mode buttons that sit to the left of the send button.