import * as React from "react"; export type { ChatComposerProp, ChatComposerProp as ChatComposerProps, ChatComposerSubmitTypeProp, } from "../../props/components/data-entry.prop.js"; /** * ChatComposer — the message input of a conversation (Ant Design X `Sender`). * * ## Why a component and not a composition * * Three behaviours live here and nowhere else, and every app that hand-rolls a composer gets at * least one of them wrong: * * 1. **An IME conversion is not a message.** Between `compositionstart` and `compositionend` the * text in the box is a CANDIDATE being converted, and the `Enter` that accepts it belongs to * the IME. A composer that reads that `Enter` as "send" makes Japanese and Vietnamese input * impossible — the first kanji conversion sends a half-written line. The guard is a ref, not * state, because it has to be readable inside the keydown that fires between the two events. * 2. **One trailing action at a time.** While a response streams the send button IS the cancel * button — the same discipline as the picker trailing-action rule. Rendering both is how a * user cancels by aiming for send. * 3. **The draft box is the focus target.** `ref`, `id`, `name` and the whole `FormField` * label/helper/error contract land on the `