noteloom

Select (inline)

An inline dropdown chip with in-editor add/remove-option UI — the raw, general-purpose version of a select field. Insertable anywhere via the "/" menu, with a blank option list you fill in as you go.

json
{
  "id": "r1",
  "type": "select",
  "value": "",
  "marks": {},
  "data": {
    "options": [
      { "value": "todo", "label": "To do" },
      { "value": "done", "label": "Done" }
    ],
    "selectedValue": "todo",
    "placeholder": "Select…"
  }
}

For a named, reusable field type — "Status", "Priority", an @-mention field backed by a live API — you almost always want createSelectFieldType instead of registering raw select runs by hand; it builds a fully configured inline type (label, placeholder, color variant, static or async/API-backed options) from a plain config object.

Slash command

Select — keywords: select, dropdown, choice, picker.

Styling

Rendered with class .be-inline-select.

Using it in your editor

useEditor() registers every built-in inline type by default, select included. To register only the ones you use instead:

jsx
import { useEditor, NoteloomEditor, registerInlineTypes, selectInlineType } from 'noteloom';

function Editor() {
  const editor = useEditor({
    registerInlineTypes: (inlineRegistry) => registerInlineTypes(inlineRegistry, { select: selectInlineType }),
  });
  return <NoteloomEditor editor={editor} />;
}

This is the generic, built-in select — for a named dropdown with your own options ("Status", "Priority", an "@mention"), see Custom select field types instead, which builds a whole new inline type from a config object rather than reusing this one.