Embed

A media widget for images, video, audio, or files — local upload or a remote URL. A pure widget block: no runs at all, contentIds is always empty.

json

{
  "id": "e1",
  "type": "embed",
  "contentIds": [],
  "props": {
    "kind": "image",
    "src": "https://example.com/photo.jpg",
    "name": "photo.jpg",
    "mimeType": "image/jpeg",
    "align": "center",
    "width": 100
  }
}

Prop	Type	Notes
`kind`	`'image' \| 'video' \| 'audio' \| 'file'`	Default `'file'`.
`src`	`string`	An external URL, or a `data:` URL for a locally-uploaded file.
`name`	`string`	Original filename or the URL — used as alt text / download name / link text.
`mimeType`	`string`	Set on local uploads.
`align`	`'left' \| 'center' \| 'right'`	Positions the widget within the line.
`width`	`number` (20–100)	Percentage width — image/video only, adjustable via a resize handle.

There is no upload-to-a-server path — this is a zero-runtime-dependency package with no backend of its own. A locally-uploaded file is stored as a data: URL directly in the document, which is fine for a demo or a small note but will bloat a document with large files; wire your own upload handling if you need it (host it yourself, then set src to the resulting URL).

Slash command

Embed (or Image/Video/File) — keywords: image, video, audio, file, embed, upload.

Styling

.be-embed (wrapper), .be-embed-image/.be-embed-video/.be-embed-frame/.be-embed-file-link per kind, .be-embed-dropzone for the empty/upload state, and a .be-embed-toolbar for align/resize controls.

Using it in your editor

useEditor() registers every built-in block by default, embed included. To register only the blocks you use instead:

jsx

import { useEditor, NoteloomEditor, registerBlocks, paragraphBlockType, embedBlockType } from 'noteloom';

function Editor() {
  const editor = useEditor({
    registerBlocks: (registry) => registerBlocks(registry, { paragraph: paragraphBlockType, embed: embedBlockType }),
  });
  return <NoteloomEditor editor={editor} />;
}

See Picking only the blocks you want for combining this with other types.