Edit History

The versions of an image through iterative edits, newest last. Select one to edit on from it, or compare it with the version it came from.

1
1Original

In use

The Image Edit Studio's strip of versions. Each edit starts from the selected one; picking an older one branches.

Lumen
CreateEditVideo
240 credits
the image

Paint over what to change. Tab reaches the marks: arrow keys move one, Enter edits its note, Delete removes it.

Installation

pnpm dlx shadcn@latest add https://mgp.paukraft.com/r/edit-history.json

EditHistory

A radio group of versions: click one, or use the arrow keys. Send the selected version's src as the next edit's input: FLUX 3 Image's images, Kontext's input_image, or Erase's image with a Markup mask.

PropTypeDefault
historyEditHistoryState

From useEditHistory, which also tracks the selection.

—

Branching

Editing an older version branches instead of discarding what came after it: every version was paid for. The new version is appended with the older one as its parent, and the caption says which it came from.

useEditHistory

PropTypeDefault
originalstring

The image the edits start from. A new one starts a new history.

—
versionsEditVersion[]

Oldest first: { id, prompt, parentId, status, progress?, src?, error?, startedAt?, settledAt? }.

—
selected / parentEditVersion / EditVersion | undefined

What the next edit starts from, and what it was edited from: the two sides of a Compare Slider.

—
push({ prompt, ...result }) => string

Adds an edit of the selected version, queued unless given a status, and selects it. Returns its id.

—
update(id, result: Partial<ImageGenResult>) => void

Applies a task result, e.g. trackBflTask's onResult. Stamps settledAt once it settles.

—
select(id: string) => void

Selects a version, as clicking or the arrow keys do.

—

Parts

PropTypeDefault
EditHistoryRoot{ history } & RadioGroup props

The strip. Scrolls the selected version into view.

—
EditHistoryItem{ version }

A version's thumbnail and number. In flight, its parent blurred under a progress ring.

—
EditHistoryCaption{ history }

The selected version's number, prompt, the version it branched from, and its status while not ready.

—