Blocks

class MyTool { constructor({data, api}){ this.api = api; // ... } refreshContent() { this.api.blocks.render({ blocks: [ { type: "image", data: { url: "https://cdn.pixabay.com/photo/2017/09/01/21/53/blue-2705642_1280.jpg" } }, { type: "header", data: { text: "New header", level: 2 } } ] }); } // ... other methods }

☝️

Note.

Method has a shorthand

Delete

Method removes Block with index. If index is not passed, current Block will be removed

Parameters

Number index of Block that needs to be deleted

Return value

Method does not return anything

delete(index?: number): void

Note that Blocks below will be shifted up

Example

class MyTool { constructor({data, api}){ this.api = api; // ... } deleteSomeBlock() { this.api.blocks.delete(2); // delete 3rd Block } // ... other methods }

Swap

☝️

Deprecated

Please use move instead

Method swaps two Blocks

Parameters

`Number`	First Block index
`Number`	Second Block index

Return value

Method does not return anything

swap(fromIndex: number, toIndex: number): void

Example

class MyTool { constructor({data, api}){ this.api = api; // ... } changeBlockPositions() { this.api.blocks.swap(1, 2); // swap 1 and 2 Blocks } // ... other methods }

move

The method moves block from the passed index to another one.

☝️

Note

The first argument is the toIndex, and the second is from

Parameters

`Number`	Destination index
`Number`	Index of Block to move. By default, it's the index of the current block.

Return value

Method does not return anything

move(toIndex: number, fromIndex?: number): void

Example

class MyTool { constructor({data, api}){ this.api = api; // ... } moveBlockToTop() { this.api.blocks.move(0); // move current Block to the fisrt place } // ... other methods }

getBlockByIndex

Method returns Block HTML content by index

Parameters

Number Index of Block that will be returned

Return value

BlockAPI Block API object for Block instance

getBlockByIndex(index: number): BlockAPI

Example

class MyTool { constructor({data, api}){ this.api = api; // ... } myMethod() { this.api.blocks.getBlockByIndex(1); // get first Block contents } // ... other methods }

getCurrentBlockIndex

Method returns index of current Block

Parameters

This method has no arguments

Return value

Number Index of currently focused Block

getCurrentBlockIndex(): number

Example

class MyTool { constructor({data, api}){ this.api = api; // ... } isFirstBlock() { return this.api.blocks.getCurrentBlockIndex() === 0; } // ... other methods }

getBlocksCount

Method returns number of Blocks

Parameters

This method has no arguments

Return value

Number Count of rendered Blocks

getBlocksCount(): number

Example

class MyTool { constructor({data, api}){ this.api = api; // ... } isLastBlock() { return this.api.blocks.getCurrentBlockIndex() === this.api.blocks.getBlocksCount() - 1; } // ... other methods }

stretchBlock

Method allow Plugins to use 100% space of Block content. For example, to stretch images

Parameters

`Number`	index of Block that will be full-width
`Boolean`	state of stretching

Return value

stretchBlock(index: number, status: boolean = true): void

Example

class MyTool { constructor({data, api}){ this.api = api; // ... } stretchMyImage() { this.api.blocks.stretchBlock(1, true); } // ... other methods }

insert

Method inserts new Block with pasted type and data.

Parameters

`String`	New Block type
`Object`	New Block data
`Object`	Config for new Block's Tool
`Number`	Position for block. By default, it will inserted after current Block
`Boolean`	Need to set focus or not.

Return value

Method does not return anything

insert(type?: string, data?: BlockToolData, config?: ToolConfig, index?: number, needToFocus?: boolean): void

insertNewBlock

Method inserts new Block after focused Block and sets new focus

☝️

Deprecated

This method will be removed with next major release. Use insert() instead