Download and export

export() returns bytes and a sha256; download() saves a file named <source>-<hash8>.<ext>.

const result = await editor.export({ format: 'image/jpeg', quality: 0.9 });
await editor.download({ output: { format: 'image/png' }, embedEditLog: true });

• Below the client limit (16 megapixels by default) the browser renders and downloads locally.
• Above it, or with download({ via: 'server' }), the original and the edit log go to your server endpoint, which renders the full resolution and returns the file. See Proxy flow.
• embedEditLog: true stores the log inside the PNG, JPEG or WebP so it can be reopened later. See Resume editing.

On iOS Safari the download falls back to the share sheet.

The two buttons

Download renders and saves a file. It is shown by default; show-download="never" removes it for hosts that only consume the result through sealpixel:process, and download-label replaces the localized text:

<sealpixel-editor download-label="Save avatar"></sealpixel-editor>
<sealpixel-editor show-download="never"></sealpixel-editor>

The wrappers expose the same as showDownload and downloadLabel props (React, Vue, Svelte) or attributes (Astro).

Undo, redo and the timeline are controlled by show-history: all (default), buttons for undo and redo without the timeline slider, or none, which also disables the ⌘Z / Ctrl+Z shortcuts. The edit log itself keeps recording either way, so a host can still call undo() or timeTravel() programmatically.

<sealpixel-editor show-history="buttons"></sealpixel-editor>

Export renders and hands the result to your page through the sealpixel:process event (onProcess in React, @process in Vue, onprocess in Svelte) without saving anything. Because it does nothing visible on its own, the button appears only while a listener is attached. Set show-export="always" or "never" to override:

<sealpixel-editor show-export="always"></sealpixel-editor>

editor.addEventListener('sealpixel:process', (e) => {
  const { bytes, mimeType, width, height, hash } = e.detail;
  upload(new Blob([bytes], { type: mimeType }), hash);
});

After either action a toast over the stage shows format, dimensions, file size and the first twelve characters of the sha256, and the same text is announced to screen readers. Style it with sealpixel-editor::part(toast).