deblan-mirror/editor.js
deblan-mirror/editor.js
1
0
Fork 0
mirror of https://github.com/codex-team/editor.js synced 2026-03-15 15:15:47 +01:00
Code Issues Projects Releases Wiki Activity
editor.js/docs/tools-inline.md
Peter Savchenko 36f505cb02
 Inline Toolbar Tools base example (#260) 
* Inline Toolbar Tools base example

* texts fixed

* imrpove texts

* little fixes
2018-06-21 17:13:02 +03:00

1.3 KiB
Raw Blame History

Tools for the Inline Toolbar

Similar with Tools represented Blocks, you can create Tools for the Inline Toolbar. It will work with selected fragment of text. The simplest example is bold or italic Tools.

Base structure

Inline Tool should implement next methods

  • render() — create a button
  • surround() — works with selected range
  • checkState() — get Tool's activated state by selected range

render()

Method that returns button to append at the Inline Toolbar

Parameters

Method does not accept any parameters

Return value

type description
HTMLElement element that will be added to the Inline Toolbar

surround(range: Range)

Method that accepts selected range and wrap it somehow

Parameters

name type description
range Range first range of current Selection

Return value

There is no return value

checkState(selection: Selection)

Get Selection and detect if Tool was applied. For example, after that Tool can highlight button or show some details.

Parameters

name type description
selection Selection current Selection

Return value

type description
Boolean true if Tool is active, otherwise false