useComposer

Draft state, live segment math, and submit wiring — the logic behind Composer, for when you want your own input UI.

Usage

import { useComposer, useThread } from "@handset/react";

const thread = useThread(conversationId);
const composer = useComposer({ send: thread.send });

composer.setBody("Your table is ready 🎉");
composer.segmentInfo; // { segments: 1, encoding: "ucs2", remaining: 48, … }
await composer.submit(); // clears on success, restores the draft on failure

countSegments is also exported standalone — GSM-7 vs UCS-2 detection, extended-char double counting, 160/153 and 70/67 boundaries — for showing costs anywhere else (campaign builders, template editors).

Options

Options
Prop	Type	Default	Description
send	(input: SendInput) => Promise<Message>	—	Where submitted drafts go.
disabled	boolean	false	Blocks submit (e.g. opted-out contact).

Returns

Return value
Prop	Type	Default	Description
body	string	—	The current draft.
setBody	(value: string) => void	—	Update the draft.
segmentInfo	SegmentInfo	—	Segments, encoding, remaining chars, per-segment capacity.
canSend	boolean	—	Non-empty draft, not disabled, not already sending.
submit	() => Promise<void>	—	Send the draft. Clears on success; restores it and sets error on failure.
isSending	boolean	—	True while a submit is in flight.
error	Error \| null	—	Last send failure.