List Item

Editable list item (list-item). Renders as <li> in a regular list (not todo). JSON data: { content: string, ...common }; nested sublists are preserved alongside item content.

Type: list-item · Class: ListItemBlock

Access:

app.block.get()
app.blocks.findByEl(el)
app.blocks.create(type)

App code:

const block = app.block.get();

Plugin:

const block = this.app.block.get();

getData#

Returns the serializable JSON data object for this block, including type-specific fields.

Returns: object

block.getData();

update#

Applies common fields, then replaces the item content HTML when content is set (nested lists under the <li> are preserved).

Parameters:

• data (object) — object with the keys below
  • content (string) — item HTML (without nested <ul>/<ol>)
  • id, classname, styles, attrs, … — common block fields (see Common update)

Returns: void

block.update({ content: 'Revised item' });

block.update({ content: 'Item with <strong>emphasis</strong>' });

getNestedLists#

Returns direct child <ul> and <ol> elements inside this list item.

Returns: Array<HTMLElement>

block.getNestedLists();

hasNestedList#

Returns whether this list item contains at least one nested list.

Returns: boolean

block.hasNestedList();

detachNestedLists#

Removes and returns all nested list elements from this item.

Returns: Array<HTMLElement>

block.detachNestedLists();

detachNestedListItems#

Removes nested lists and returns the detached <li> elements from them.

Returns: Array<HTMLElement>

block.detachNestedListItems();

getTopLevelListRoot#

Walks up from this block's element and returns the outermost <ul> or <ol> ancestor inside the editor (including nested lists).

Parameters:

• editable (HTMLElement | null) — optional editor root that bounds the walk (defaults to app.host.getEditor())

Returns: HTMLElement | null

block.getTopLevelListRoot();
block.getTopLevelListRoot(app.host.getEditor());