Todo List

Todo list block (todo). Renders as <ul class="todo-list"> with todo-item children. JSON data: { items: [{ content, done?, items? }], ...common }.

Type: todo · Class: TodoListBlock

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 common fields plus items — an array of { content, done?, items? } for each top-level task.

Returns: object

block.getData();

getItemBlocks#

Returns mounted child blocks; defaults to todo-item type only.

Parameters:

• types (Array) — block types filter

Returns: Array

block.getItemBlocks();

getItems#

Returns the serialized items array (same shape as getData().items).

Returns: Array

block.getItems();

update#

Applies common fields, then replaces all list items when items is an array.

Parameters:

• data (object) — object with the keys below
  • items (Array) — replaces tasks; each item is { content: string, done?: boolean, items?: Array }
  • id, classname, styles, attrs, … — common block fields (see Common update)

Returns: void

block.update({
    items: [
        { content: 'Buy milk', done: true },
        { content: 'Write docs' }
    ]
});

block.update({
    items: [
        {
            content: 'Parent task',
            items: [{ content: 'Nested', done: true }]
        }
    ]
});

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());