MessageActions

Per-message hover toolbar: Copy, Regenerate, Edit, Branch, Like/Dislike, Delete.

Inspired by Cursor / Claude.ai / ChatGPT per-message actions.

Preview

What it looks like.

Apple Silicon's unified memory means CPU, GPU, and Neural Engine all share one DRAM pool — no PCIe round-trips, no separate VRAM.

Usage

Drop it into your app.

import { MessageActions } from '@locara/components'

<MessageActions
  text={message.content}
  onRegenerate={() => llm.regenerate(message.id)}
  onEdit={() => editMessage(message.id)}
  onBranch={() => branchFrom(message.id)}
  onLike={() => rate(message.id, 'up')}
  onDislike={() => rate(message.id, 'down')}
  liked={message.rating === 'up'}
  disliked={message.rating === 'down'}
  onDelete={() => confirmDelete(message.id)}
/>

Or copy the source into your repo: locara add message-actions

Design notes

Why it works this way.

By default, opacity transitions from 0 → 1 when a parent has :hover or :focus-within. Pass `alwaysVisible` to disable the reveal. Only the actions you wire are rendered, so omit `onEdit` (etc.) when the action isn't applicable to that role.