Message Edit

Edit and resend a message in place, then step between its previous versions.

Install with the shadcn CLI

npxnpx shadcn@4.21.5 add @cavemio/message-edit

First install? Configure @cavemio once

Run npx shadcn@4.21.5 init if shadcn is not set up, then merge this entry into the registries field in your existing components.json. Keep your other settings and registries.

components.json

{
  "registries": {
    "@cavemio": "https://registry.cavemio.dev/r/cavemio-{name}.json"
  }
}

Overview

Edit and resend a message in place, then step between its previous versions.

Uses local demo data; no AI service or network requests.

import { MessageEdit } from "@/components/message-edit";

<MessageEdit text={message} onSubmit={setMessage} />

Props

Prop	Type	Description
`text`	`string`	Required. Current message text.
`onSubmit`	`(text: string) => void`	Required. Called with the edited text; replace the message and regenerate from it.
`disabled`	`boolean`	Optional. Disable editing, e.g. while an answer streams.
`disabledReason`	`string`	Optional. Explanation shown when editing is unavailable.
`versions`	`{ index: number; count: number; onIndexChange: (index: number) => void; }`	Optional. Branches of this message, shown as "2 / 3".
`children`	`React.ReactNode`	Optional. How the sent message renders; defaults to the text.