Up deps

.gitignore

@@ -5,7 +5,7 @@
 .idea
 npm-debug.log*
 yarn-error.log
-yarn.lock
+package-lock.json
 style/.sass-cache/
 stats.json
 

docs/api/assets.md

@@ -18,18 +18,18 @@ Once the editor is instantiated you can use its API. Before using these methods
 const assetManager = editor.AssetManager;
 ```
 
--   [add][2]
--   [get][3]
--   [getAll][4]
--   [getAllVisible][5]
--   [remove][6]
--   [store][7]
--   [load][8]
--   [getContainer][9]
--   [getAssetsEl][10]
--   [addType][11]
--   [getType][12]
--   [getTypes][13]
+*   [add][2]
+*   [get][3]
+*   [getAll][4]
+*   [getAllVisible][5]
+*   [remove][6]
+*   [store][7]
+*   [load][8]
+*   [getContainer][9]
+*   [getAssetsEl][10]
+*   [addType][11]
+*   [getType][12]
+*   [getTypes][13]
 
 ## add
 
@@ -37,8 +37,8 @@ Add new asset/s to the collection. URLs are supposed to be unique
 
 ### Parameters
 
--   `asset` **([string][14] \| [Object][15] \| [Array][16]<[string][14]> | [Array][16]<[Object][15]>)** URL strings or an objects representing the resource.
--   `opts` **[Object][15]?** Options (optional, default `{}`)
+*   `asset` **([string][14] | [Object][15] | [Array][16]<[string][14]> | [Array][16]<[Object][15]>)** URL strings or an objects representing the resource.
+*   `opts` **[Object][15]?** Options (optional, default `{}`)
 
 ### Examples
 
@@ -69,7 +69,7 @@ Returns the asset by URL
 
 ### Parameters
 
--   `src` **[string][14]** URL of the asset
+*   `src` **[string][14]** URL of the asset
 
 ### Examples
 
@@ -87,7 +87,7 @@ Returns **Collection**
 
 ## getAllVisible
 
-Return the visible collection, which containes assets actually rendered
+Return the visible collection, which contains assets actually rendered
 
 Returns **Collection** 
 
@@ -97,7 +97,7 @@ Remove the asset by its URL
 
 ### Parameters
 
--   `src` **[string][14]** URL of the asset
+*   `src` **[string][14]** URL of the asset
 
 ### Examples
 
@@ -113,7 +113,7 @@ Store assets data to the selected storage
 
 ### Parameters
 
--   `noStore` **[Boolean][17]** If true, won't store
+*   `noStore` **[Boolean][17]** If true, won't store
 
 ### Examples
 
@@ -130,7 +130,7 @@ The fetched data will be added to the collection.
 
 ### Parameters
 
--   `data` **[Object][15]** Object of data to load (optional, default `{}`)
+*   `data` **[Object][15]** Object of data to load (optional, default `{}`)
 
 ### Examples
 
@@ -160,8 +160,8 @@ Render assets
 
 ### Parameters
 
--   `assets` **[array][16]** Assets to render, without the argument will render
-                           all global assets
+*   `assets` **[array][16]** Assets to render, without the argument will render
+    all global assets
 
 ### Examples
 
@@ -184,11 +184,11 @@ Add new type. If you want to get more about type definition we suggest to read t
 
 ### Parameters
 
--   `id` **[string][14]** Type ID
--   `definition` **[Object][15]** Definition of the type. Each definition contains
-                               `model` (business logic), `view` (presentation logic)
-                               and `isType` function which recognize the type of the
-                               passed entity
+*   `id` **[string][14]** Type ID
+*   `definition` **[Object][15]** Definition of the type. Each definition contains
+    `model` (business logic), `view` (presentation logic)
+    and `isType` function which recognize the type of the
+    passed entity
 
 ### Examples
 
@@ -206,7 +206,7 @@ Get type
 
 ### Parameters
 
--   `id` **[string][14]** Type ID
+*   `id` **[string][14]** Type ID
 
 Returns **[Object][15]** Type definition
 

docs/api/block_manager.md

@@ -18,15 +18,15 @@ Once the editor is instantiated you can use its API. Before using these methods
 const blockManager = editor.BlockManager;
 ```
 
--   [add][2]
--   [get][3]
--   [getAll][4]
--   [getAllVisible][5]
--   [remove][6]
--   [getConfig][7]
--   [getCategories][8]
--   [getContainer][9]
--   [render][10]
+*   [add][2]
+*   [get][3]
+*   [getAll][4]
+*   [getAllVisible][5]
+*   [remove][6]
+*   [getConfig][7]
+*   [getCategories][8]
+*   [getContainer][9]
+*   [render][10]
 
 ## getConfig
 
@@ -44,16 +44,17 @@ Add new block to the collection.
 
 ### Parameters
 
--   `id` **[string][12]** Block id
--   `opts` **[Object][11]** Options
-    -   `opts.label` **[string][12]** Name of the block
-    -   `opts.content` **[string][12]** HTML content
-    -   `opts.category` **([string][12] \| [Object][11])** Group the block inside a catgegory.
-                                             You should pass objects with id property, eg:
-                                             {id: 'some-uid', label: 'My category'}
-                                             The string will be converted in:
-                                             'someid' => {id: 'someid', label: 'someid'}
-    -   `opts.attributes` **[Object][11]** Block attributes (optional, default `{}`)
+*   `id` **[string][12]** Block id
+*   `opts` **[Object][11]** Options
+
+    *   `opts.label` **[string][12]** Name of the block
+    *   `opts.content` **[string][12]** HTML content
+    *   `opts.category` **([string][12] | [Object][11])** Group the block inside a catgegory.
+        You should pass objects with id property, eg:
+        {id: 'some-uid', label: 'My category'}
+        The string will be converted in:
+        'someid' => {id: 'someid', label: 'someid'}
+    *   `opts.attributes` **[Object][11]** Block attributes (optional, default `{}`)
 
 ### Examples
 
@@ -76,7 +77,7 @@ Return the block by id
 
 ### Parameters
 
--   `id` **[string][12]** Block id
+*   `id` **[string][12]** Block id
 
 ### Examples
 
@@ -112,7 +113,7 @@ Remove a block by id
 
 ### Parameters
 
--   `id` **[string][12]** Block id
+*   `id` **[string][12]** Block id
 
 ### Examples
 
@@ -143,10 +144,11 @@ Render blocks
 
 ### Parameters
 
--   `blocks` **[Array][13]** Blocks to render, without the argument will render all global blocks
--   `opts` **[Object][11]** Options (optional, default `{}`)
-    -   `opts.external` **[Boolean][15]?** Render blocks in a new container (HTMLElement will be returned)
-    -   `opts.ignoreCategories` **[Boolean][15]?** Render blocks without categories
+*   `blocks` **[Array][13]** Blocks to render, without the argument will render all global blocks
+*   `opts` **[Object][11]** Options (optional, default `{}`)
+
+    *   `opts.external` **[Boolean][15]?** Render blocks in a new container (HTMLElement will be returned)
+    *   `opts.ignoreCategories` **[Boolean][15]?** Render blocks without categories
 
 ### Examples
 

docs/api/canvas.md

@@ -18,17 +18,17 @@ Once the editor is instantiated you can use its API. Before using these methods
 const canvas = editor.Canvas;
 ```
 
--   [getConfig][2]
--   [getElement][3]
--   [getFrameEl][4]
--   [getWindow][5]
--   [getDocument][6]
--   [getBody][7]
--   [setCustomBadgeLabel][8]
--   [hasFocus][9]
--   [scrollTo][10]
--   [setZoom][11]
--   [getZoom][12]
+*   [getConfig][2]
+*   [getElement][3]
+*   [getFrameEl][4]
+*   [getWindow][5]
+*   [getDocument][6]
+*   [getBody][7]
+*   [setCustomBadgeLabel][8]
+*   [hasFocus][9]
+*   [scrollTo][10]
+*   [setZoom][11]
+*   [getZoom][12]
 
 ## getConfig
 
@@ -72,7 +72,7 @@ Set custom badge naming strategy
 
 ### Parameters
 
--   `f` **[Function][18]** 
+*   `f` **[Function][18]** 
 
 ### Examples
 
@@ -103,9 +103,10 @@ passed to it. For instance, you can scroll smoothly by using
 
 ### Parameters
 
--   `el` **([HTMLElement][14] | Component)** 
--   `opts` **[Object][13]** Options, same as options for `scrollIntoView` (optional, default `{}`)
-    -   `opts.force` **[Boolean][19]** Force the scroll, even if the element is already visible (optional, default `false`)
+*   `el` **([HTMLElement][14] | Component)** 
+*   `opts` **[Object][13]** Options, same as options for `scrollIntoView` (optional, default `{}`)
+
+    *   `opts.force` **[Boolean][19]** Force the scroll, even if the element is already visible (optional, default `false`)
 
 ### Examples
 
@@ -123,7 +124,7 @@ Set zoom value
 
 ### Parameters
 
--   `value` **[Number][20]** The zoom value, from 0 to 100
+*   `value` **[Number][20]** The zoom value, from 0 to 100
 
 Returns **this** 
 
@@ -139,8 +140,8 @@ Add new frame to the canvas
 
 ### Parameters
 
--   `props` **[Object][13]** Frame properties (optional, default `{}`)
--   `opts`   (optional, default `{}`)
+*   `props` **[Object][13]** Frame properties (optional, default `{}`)
+*   `opts`   (optional, default `{}`)
 
 ### Examples
 

docs/api/commands.md

@@ -18,15 +18,15 @@ Once the editor is instantiated you can use its API. Before using these methods
 const commands = editor.Commands;
 ```
 
--   [add][2]
--   [get][3]
--   [getAll][4]
--   [extend][5]
--   [has][6]
--   [run][7]
--   [stop][8]
--   [isActive][9]
--   [getActive][10]
+*   [add][2]
+*   [get][3]
+*   [getAll][4]
+*   [extend][5]
+*   [has][6]
+*   [run][7]
+*   [stop][8]
+*   [isActive][9]
+*   [getActive][10]
 
 ## add
 
@@ -34,10 +34,10 @@ Add new command to the collection
 
 ### Parameters
 
--   `id` **[string][11]** Command's ID
--   `command` **([Object][12] \| [Function][13])** Object representing your command,
-     By passing just a function it's intended as a stateless command
-     (just like passing an object with only `run` method).
+*   `id` **[string][11]** Command's ID
+*   `command` **([Object][12] | [Function][13])** Object representing your command,
+    By passing just a function it's intended as a stateless command
+    (just like passing an object with only `run` method).
 
 ### Examples
 
@@ -61,7 +61,7 @@ Get command by ID
 
 ### Parameters
 
--   `id` **[string][11]** Command's ID
+*   `id` **[string][11]** Command's ID
 
 ### Examples
 
@@ -78,9 +78,9 @@ Extend the command. The command to extend should be defined as an object
 
 ### Parameters
 
--   `id` **[string][11]** Command's ID
--   `cmd`   (optional, default `{}`)
--   `Object` **[Object][12]** with the new command functions
+*   `id` **[string][11]** Command's ID
+*   `cmd`   (optional, default `{}`)
+*   `Object` **[Object][12]** with the new command functions
 
 ### Examples
 
@@ -100,7 +100,7 @@ Check if command exists
 
 ### Parameters
 
--   `id` **[string][11]** Command's ID
+*   `id` **[string][11]** Command's ID
 
 Returns **[Boolean][14]** 
 
@@ -116,8 +116,8 @@ Execute the command
 
 ### Parameters
 
--   `id` **[String][11]** Command ID
--   `options` **[Object][12]** Options (optional, default `{}`)
+*   `id` **[String][11]** Command ID
+*   `options` **[Object][12]** Options (optional, default `{}`)
 
 ### Examples
 
@@ -133,8 +133,8 @@ Stop the command
 
 ### Parameters
 
--   `id` **[String][11]** Command ID
--   `options` **[Object][12]** Options (optional, default `{}`)
+*   `id` **[String][11]** Command ID
+*   `options` **[Object][12]** Options (optional, default `{}`)
 
 ### Examples
 
@@ -152,7 +152,7 @@ method it can't be registered as active
 
 ### Parameters
 
--   `id` **[String][11]** Command id
+*   `id` **[String][11]** Command id
 
 ### Examples
 

docs/api/component.md

@@ -19,73 +19,72 @@ component.get('tagName');
 
 ### Properties
 
--   `type` **[String][1]?** Component type, eg. `text`, `image`, `video`, etc.
--   `tagName` **[String][1]?** HTML tag of the component, eg. `span`. Default: `div`
--   `attributes` **[Object][2]?** Key-value object of the component's attributes, eg. `{ title: 'Hello' }` Default: `{}`
--   `name` **[String][1]?** Name of the component. Will be used, for example, in Layers and badges
--   `removable` **[Boolean][3]?** When `true` the component is removable from the canvas, default: `true`
--   `draggable` **([Boolean][3] \| [String][1])?** Indicates if it's possible to drag the component inside others.
-     You can also specify a query string to indentify elements,
-     eg. `'.some-class[title=Hello], [data-gjs-type=column]'` means you can drag the component only inside elements
-     containing `some-class` class and `Hello` title, and `column` components. Default: `true`
--   `droppable` **([Boolean][3] \| [String][1])?** Indicates if it's possible to drop other components inside. You can use
-    a query string as with `draggable`. Default: `true`
--   `badgable` **[Boolean][3]?** Set to false if you don't want to see the badge (with the name) over the component. Default: `true`
--   `stylable` **([Boolean][3] \| [Array][4]<[String][1]>)?** True if it's possible to style the component.
+*   `type` **[String][1]?** Component type, eg. `text`, `image`, `video`, etc.
+*   `tagName` **[String][1]?** HTML tag of the component, eg. `span`. Default: `div`
+*   `attributes` **[Object][2]?** Key-value object of the component's attributes, eg. `{ title: 'Hello' }` Default: `{}`
+*   `name` **[String][1]?** Name of the component. Will be used, for example, in Layers and badges
+*   `removable` **[Boolean][3]?** When `true` the component is removable from the canvas, default: `true`
+*   `draggable` **([Boolean][3] | [String][1])?** Indicates if it's possible to drag the component inside others.
+    You can also specify a query string to indentify elements,
+    eg. `'.some-class[title=Hello], [data-gjs-type=column]'` means you can drag the component only inside elements
+    containing `some-class` class and `Hello` title, and `column` components. Default: `true`
+*   `droppable` **([Boolean][3] | [String][1] | [Function][4])?** Indicates if it's possible to drop other components inside. You can use
+    a query string as with `draggable`. In the case of a function, target and destination components are passed as arguments, return a Boolean to indicate if the drop is possible. Default: `true`
+*   `badgable` **[Boolean][3]?** Set to false if you don't want to see the badge (with the name) over the component. Default: `true`
+*   `stylable` **([Boolean][3] | [Array][5]<[String][1]>)?** True if it's possible to style the component.
     You can also indicate an array of CSS properties which is possible to style, eg. `['color', 'width']`, all other properties
     will be hidden from the style manager. Default: `true`
--   `stylable-require` **[Array][4]&lt;[String][1]>?** Indicate an array of style properties to show up which has been marked as `toRequire`. Default: `[]`
--   `unstylable` **[Array][4]&lt;[String][1]>?** Indicate an array of style properties which should be hidden from the style manager. Default: `[]`
--   `style-signature` **[Array][4]&lt;[String][1]>?** This option comes handy when you need to remove or export strictly component-specific rules. Be default, if this option is not empty, the editor will remove rules when there are no components, of that type, in the canvas. Eg. '\['.navbar', '[navbar-']'. Default: `''`
--   `highlightable` **[Boolean][3]?** It can be highlighted with 'dotted' borders if true. Default: `true`
--   `copyable` **[Boolean][3]?** True if it's possible to clone the component. Default: `true`
--   `resizable` **[Boolean][3]?** Indicates if it's possible to resize the component. It's also possible to pass an object as [options for the Resizer][5]. Default: `false`
--   `editable` **[Boolean][3]?** Allow to edit the content of the component (used on Text components). Default: `false`
--   `layerable` **[Boolean][3]?** Set to `false` if you need to hide the component inside Layers. Default: `true`
--   `selectable` **[Boolean][3]?** Allow component to be selected when clicked. Default: `true`
--   `hoverable` **[Boolean][3]?** Shows a highlight outline when hovering on the element if `true`. Default: `true`
--   `void` **[Boolean][3]?** This property is used by the HTML exporter as void elements don't have closing tags, eg. `<br/>`, `<hr/>`, etc. Default: `false`
--   `content` **[String][1]?** Content of the component (not escaped) which will be appended before children rendering. Default: `''`
--   `icon` **[String][1]?** Component's icon, this string will be inserted before the name (in Layers and badge), eg. it can be an HTML string '<i class="fa fa-square-o"></i>'. Default: `''`
--   `script` **([String][1] \| [Function][6])?** Component's javascript. More about it [here][7]. Default: `''`
--   `script-export` **([String][1] \| [Function][6])?** You can specify javascript available only in export functions (eg. when you get the HTML).
+*   `stylable-require` **[Array][5]<[String][1]>?** Indicate an array of style properties to show up which has been marked as `toRequire`. Default: `[]`
+*   `unstylable` **[Array][5]<[String][1]>?** Indicate an array of style properties which should be hidden from the style manager. Default: `[]`
+*   `highlightable` **[Boolean][3]?** It can be highlighted with 'dotted' borders if true. Default: `true`
+*   `copyable` **[Boolean][3]?** True if it's possible to clone the component. Default: `true`
+*   `resizable` **[Boolean][3]?** Indicates if it's possible to resize the component. It's also possible to pass an object as [options for the Resizer][6]. Default: `false`
+*   `editable` **[Boolean][3]?** Allow to edit the content of the component (used on Text components). Default: `false`
+*   `layerable` **[Boolean][3]?** Set to `false` if you need to hide the component inside Layers. Default: `true`
+*   `selectable` **[Boolean][3]?** Allow component to be selected when clicked. Default: `true`
+*   `hoverable` **[Boolean][3]?** Shows a highlight outline when hovering on the element if `true`. Default: `true`
+*   `void` **[Boolean][3]?** This property is used by the HTML exporter as void elements don't have closing tags, eg. `<br/>`, `<hr/>`, etc. Default: `false`
+*   `content` **[String][1]?** Content of the component (not escaped) which will be appended before children rendering. Default: `''`
+*   `icon` **[String][1]?** Component's icon, this string will be inserted before the name (in Layers and badge), eg. it can be an HTML string '<i class="fa fa-square-o"></i>'. Default: `''`
+*   `script` **([String][1] | [Function][4])?** Component's javascript. More about it [here][7]. Default: `''`
+*   `script-export` **([String][1] | [Function][4])?** You can specify javascript available only in export functions (eg. when you get the HTML).
     If this property is defined it will overwrite the `script` one (in export functions). Default: `''`
--   `traits` **[Array][4]&lt;([Object][2] \| [String][1])>?** Component's traits. More about it [here][8]. Default: `['id', 'title']`
--   `propagate` **[Array][4]&lt;[String][1]>?** Indicates an array of properties which will be inhereted by all NEW appended children.
-     For example if you create a component likes this: `{ removable: false, draggable: false, propagate: ['removable', 'draggable'] }`
-     and append some new component inside, the new added component will get the exact same properties indicated in the `propagate` array (and the `propagate` property itself). Default: `[]`
--   `toolbar` **[Array][4]&lt;[Object][2]>?** Set an array of items to show up inside the toolbar when the component is selected (move, clone, delete).
+*   `traits` **[Array][5]<([Object][2] | [String][1])>?** Component's traits. More about it [here][8]. Default: `['id', 'title']`
+*   `propagate` **[Array][5]<[String][1]>?** Indicates an array of properties which will be inhereted by all NEW appended children.
+    For example if you create a component likes this: `{ removable: false, draggable: false, propagate: ['removable', 'draggable'] }`
+    and append some new component inside, the new added component will get the exact same properties indicated in the `propagate` array (and the `propagate` property itself). Default: `[]`
+*   `toolbar` **[Array][5]<[Object][2]>?** Set an array of items to show up inside the toolbar when the component is selected (move, clone, delete).
     Eg. `toolbar: [ { attributes: {class: 'fa fa-arrows'}, command: 'tlb-move' }, ... ]`.
     By default, when `toolbar` property is falsy the editor will add automatically commands like `move`, `delete`, etc. based on its properties.
--   `components` **Collection&lt;[Component][9]>?** Children components. Default: `null`
+*   `components` **Collection<[Component][9]>?** Children components. Default: `null`
 
-## init
+### init
 
 Hook method, called once the model is created
 
-## updated
+### updated
 
 Hook method, called when the model has been updated (eg. updated some model's property)
 
-### Parameters
+#### Parameters
 
--   `property` **[String][1]** Property name, if triggered after some property update
--   `value` **any** Property value, if triggered after some property update
--   `previous` **any** Property previous value, if triggered after some property update
+*   `property` **[String][1]** Property name, if triggered after some property update
+*   `value` **any** Property value, if triggered after some property update
+*   `previous` **any** Property previous value, if triggered after some property update
 
-## removed
+### removed
 
 Hook method, called once the model has been removed
 
-## is
+### is
 
 Check component's type
 
-### Parameters
+#### Parameters
 
--   `type` **[string][1]** Component type
+*   `type` **[string][1]** Component type
 
-### Examples
+#### Examples
 
 ```javascript
 component.is('image')
@@ -94,76 +93,76 @@ component.is('image')
 
 Returns **[Boolean][3]** 
 
-## props
+### props
 
 Return all the propeties
 
 Returns **[Object][2]** 
 
-## index
+### index
 
 Get the index of the component in the parent collection.
 
 Returns **[Number][10]** 
 
-## setDragMode
+### setDragMode
 
 Change the drag mode of the component.
 To get more about this feature read: [https://github.com/artf/grapesjs/issues/1936][11]
 
-### Parameters
+#### Parameters
 
--   `value` **[String][1]** Drag mode, options: 'absolute' | 'translate'
+*   `value` **[String][1]** Drag mode, options: 'absolute' | 'translate'
 
 Returns **this** 
 
-## find
+### find
 
 Find inner components by query string.
 **ATTENTION**: this method works only with already rendered component
 
-### Parameters
+#### Parameters
 
--   `query` **[String][1]** Query string
+*   `query` **[String][1]** Query string
 
-### Examples
+#### Examples
 
 ```javascript
 component.find('div > .class');
 // -> [Component, Component, ...]
 ```
 
-Returns **[Array][4]** Array of components
+Returns **[Array][5]** Array of components
 
-## findType
+### findType
 
 Find all inner components by component type.
 The advantage of this method over `find` is that you can use it
 also before rendering the component
 
-### Parameters
+#### Parameters
 
--   `type` **[String][1]** Component type
+*   `type` **[String][1]** Component type
 
-### Examples
+#### Examples
 
 ```javascript
 const allImages = component.findType('image');
 console.log(allImages[0]) // prints the first found component
 ```
 
-Returns **[Array][4]&lt;[Component][9]>** 
+Returns **[Array][5]<[Component][9]>** 
 
-## closest
+### closest
 
 Find the closest parent component by query string.
 **ATTENTION**: this method works only with already rendered component
 
-### Parameters
+#### Parameters
 
--   `query` **[string][1]** Query string
+*   `query` **[string][1]** Query string
 
-### Examples
+#### Examples
 
 ```javascript
 component.closest('div.some-class');
@@ -172,17 +171,17 @@ component.closest('div.some-class');
 
 Returns **[Component][9]** 
 
-## closestType
+### closestType
 
 Find the closest parent component by its type.
 The advantage of this method over `closest` is that you can use it
 also before rendering the component
 
-### Parameters
+#### Parameters
 
--   `type` **[String][1]** Component type
+*   `type` **[String][1]** Component type
 
-### Examples
+#### Examples
 
 ```javascript
 const Section = component.closestType('section');
@@ -191,45 +190,45 @@ console.log(Section);
 
 Returns **[Component][9]** Found component, otherwise `undefined`
 
-## contains
+### contains
 
 The method returns a Boolean value indicating whether the passed
 component is a descendant of a given component
 
-### Parameters
+#### Parameters
 
--   `component` **[Component][9]** Component to check
+*   `component` **[Component][9]** Component to check
 
 Returns **[Boolean][3]** 
 
-## replaceWith
+### replaceWith
 
 Replace a component with another one
 
-### Parameters
+#### Parameters
 
--   `el` **([String][1] \| [Component][9])** Component or HTML string
+*   `el` **([String][1] | [Component][9])** Component or HTML string
 
-### Examples
+#### Examples
 
 ```javascript
 component.replaceWith('<div>Some new content</div>');
 // -> Component
 ```
 
-Returns **([Component][9] \| [Array][4]&lt;[Component][9]>)** New added component/s
+Returns **([Component][9] | [Array][5]<[Component][9]>)** New added component/s
 
-## setAttributes
+### setAttributes
 
 Update attributes of the component
 
-### Parameters
+#### Parameters
 
--   `attrs` **[Object][2]** Key value attributes
--   `opts`   (optional, default `{}`)
--   `options` **[Object][2]** Options for the model update
+*   `attrs` **[Object][2]** Key value attributes
+*   `opts`   (optional, default `{}`)
+*   `options` **[Object][2]** Options for the model update
 
-### Examples
+#### Examples
 
 ```javascript
 component.setAttributes({ id: 'test', 'data-key': 'value' });
@@ -237,17 +236,17 @@ component.setAttributes({ id: 'test', 'data-key': 'value' });
 
 Returns **this** 
 
-## addAttributes
+### addAttributes
 
 Add attributes to the component
 
-### Parameters
+#### Parameters
 
--   `attrs` **[Object][2]** Key value attributes
--   `opts`   (optional, default `{}`)
--   `options` **[Object][2]** Options for the model update
+*   `attrs` **[Object][2]** Key value attributes
+*   `opts`   (optional, default `{}`)
+*   `options` **[Object][2]** Options for the model update
 
-### Examples
+#### Examples
 
 ```javascript
 component.addAttributes({ 'data-key': 'value' });
@@ -255,17 +254,17 @@ component.addAttributes({ 'data-key': 'value' });
 
 Returns **this** 
 
-## removeAttributes
+### removeAttributes
 
 Remove attributes from the component
 
-### Parameters
+#### Parameters
 
--   `attrs` **([String][1] \| [Array][4]&lt;[String][1]>)** Array of attributes to remove (optional, default `[]`)
--   `opts`   (optional, default `{}`)
--   `options` **[Object][2]** Options for the model update
+*   `attrs` **([String][1] | [Array][5]<[String][1]>)** Array of attributes to remove (optional, default `[]`)
+*   `opts`   (optional, default `{}`)
+*   `options` **[Object][2]** Options for the model update
 
-### Examples
+#### Examples
 
 ```javascript
 component.removeAttributes('some-attr');
@@ -274,22 +273,22 @@ component.removeAttributes(['some-attr1', 'some-attr2']);
 
 Returns **this** 
 
-## getStyle
+### getStyle
 
 Get the style of the component
 
 Returns **[Object][2]** 
 
-## setStyle
+### setStyle
 
 Set the style on the component
 
-### Parameters
+#### Parameters
 
--   `prop` **[Object][2]** Key value style object (optional, default `{}`)
--   `opts`   (optional, default `{}`)
+*   `prop` **[Object][2]** Key value style object (optional, default `{}`)
+*   `opts`   (optional, default `{}`)
 
-### Examples
+#### Examples
 
 ```javascript
 component.setStyle({ color: 'red' });
@@ -297,25 +296,25 @@ component.setStyle({ color: 'red' });
 
 Returns **[Object][2]** 
 
-## getAttributes
+### getAttributes
 
 Return all component's attributes
 
-### Parameters
+#### Parameters
 
--   `opts`   (optional, default `{}`)
+*   `opts`   (optional, default `{}`)
 
 Returns **[Object][2]** 
 
-## addClass
+### addClass
 
 Add classes
 
-### Parameters
+#### Parameters
 
--   `classes` **([Array][4]&lt;[String][1]> | [String][1])** Array or string of classes
+*   `classes` **([Array][5]<[String][1]> | [String][1])** Array or string of classes
 
-### Examples
+#### Examples
 
 ```javascript
 model.addClass('class1');
@@ -324,17 +323,17 @@ model.addClass(['class1', 'class2']);
 // -> [SelectorObject, ...]
 ```
 
-Returns **[Array][4]** Array of added selectors
+Returns **[Array][5]** Array of added selectors
 
-## setClass
+### setClass
 
 Set classes (resets current collection)
 
-### Parameters
+#### Parameters
 
--   `classes` **([Array][4]&lt;[String][1]> | [String][1])** Array or string of classes
+*   `classes` **([Array][5]<[String][1]> | [String][1])** Array or string of classes
 
-### Examples
+#### Examples
 
 ```javascript
 model.setClass('class1');
@@ -343,17 +342,17 @@ model.setClass(['class1', 'class2']);
 // -> [SelectorObject, ...]
 ```
 
-Returns **[Array][4]** Array of added selectors
+Returns **[Array][5]** Array of added selectors
 
-## removeClass
+### removeClass
 
 Remove classes
 
-### Parameters
+#### Parameters
 
--   `classes` **([Array][4]&lt;[String][1]> | [String][1])** Array or string of classes
+*   `classes` **([Array][5]<[String][1]> | [String][1])** Array or string of classes
 
-### Examples
+#### Examples
 
 ```javascript
 model.removeClass('class1');
@@ -362,24 +361,24 @@ model.removeClass(['class1', 'class2']);
 // -> [SelectorObject, ...]
 ```
 
-Returns **[Array][4]** Array of removed selectors
+Returns **[Array][5]** Array of removed selectors
 
-## getClasses
+### getClasses
 
 Returns component's classes as an array of strings
 
-Returns **[Array][4]** 
+Returns **[Array][5]** 
 
-## append
+### append
 
 Add new component children
 
-### Parameters
+#### Parameters
 
--   `components` **([Component][9] \| [String][1])** Component to add
--   `opts` **[Object][2]** Options for the append action (optional, default `{}`)
+*   `components` **([Component][9] | [String][1])** Component to add
+*   `opts` **[Object][2]** Options for the append action (optional, default `{}`)
 
-### Examples
+#### Examples
 
 ```javascript
 someComponent.get('components').length // -> 0
@@ -393,19 +392,19 @@ otherComponent.append([otherComponent3, otherComponent4]);
 someComponent.append(otherComponent, { at: 0 });
 ```
 
-Returns **[Array][4]** Array of appended components
+Returns **[Array][5]** Array of appended components
 
-## components
+### components
 
 Set new collection if `components` are provided, otherwise the
 current collection is returned
 
-### Parameters
+#### Parameters
 
--   `components` **([Component][9] \| [String][1])?** Components to set
--   `opts` **[Object][2]** Options, same as in `Component.append()` (optional, default `{}`)
+*   `components` **([Component][9] | [String][1])?** Components to set
+*   `opts` **[Object][2]** Options, same as in `Component.append()` (optional, default `{}`)
 
-### Examples
+#### Examples
 
 ```javascript
 // Set new collection
@@ -416,27 +415,27 @@ console.log(collection.length);
 // -> 2
 ```
 
-Returns **(Collection | [Array][4]&lt;[Component][9]>)** 
+Returns **(Collection | [Array][5]<[Component][9]>)** 
 
-## empty
+### empty
 
 Remove all inner components
 
--   @return {this}
+*   @return {this}
 
-### Parameters
+#### Parameters
 
--   `opts`   (optional, default `{}`)
+*   `opts`   (optional, default `{}`)
 
-## parent
+### parent
 
 Get the parent component, if exists
 
-### Parameters
+#### Parameters
 
--   `opts`   (optional, default `{}`)
+*   `opts`   (optional, default `{}`)
 
-### Examples
+#### Examples
 
 ```javascript
 component.parent();
@@ -445,15 +444,15 @@ component.parent();
 
 Returns **[Component][9]** 
 
-## getTrait
+### getTrait
 
 Get the trait by id/name
 
-### Parameters
+#### Parameters
 
--   `id` **[String][1]** The `id` or `name` of the trait
+*   `id` **[String][1]** The `id` or `name` of the trait
 
-### Examples
+#### Examples
 
 ```javascript
 const traitTitle = component.getTrait('title');
@@ -462,16 +461,16 @@ traitTitle && traitTitle.set('label', 'New label');
 
 Returns **Trait** Trait model
 
-## updateTrait
+### updateTrait
 
 Update a trait
 
-### Parameters
+#### Parameters
 
--   `id` **[String][1]** The `id` or `name` of the trait
--   `props` **[Object][2]** Object with the props to update
+*   `id` **[String][1]** The `id` or `name` of the trait
+*   `props` **[Object][2]** Object with the props to update
 
-### Examples
+#### Examples
 
 ```javascript
 component.updateTrait('title', {
@@ -482,16 +481,16 @@ component.updateTrait('title', {
 
 Returns **this** 
 
-## getTraitIndex
+### getTraitIndex
 
 Get the trait position index by id/name. Useful in case you want to
 replace some trait, at runtime, with something else.
 
-### Parameters
+#### Parameters
 
--   `id` **[String][1]** The `id` or `name` of the trait
+*   `id` **[String][1]** The `id` or `name` of the trait
 
-### Examples
+#### Examples
 
 ```javascript
 const traitTitle = component.getTraitIndex('title');
@@ -500,33 +499,33 @@ console.log(traitTitle); // 1
 
 Returns **[Number][10]** Index position of the current trait
 
-## removeTrait
+### removeTrait
 
 Remove trait/s by id/s.
 
-### Parameters
+#### Parameters
 
--   `id` **([String][1] \| [Array][4]&lt;[String][1]>)** The `id`/`name` of the trait (or an array)
+*   `id` **([String][1] | [Array][5]<[String][1]>)** The `id`/`name` of the trait (or an array)
 
-### Examples
+#### Examples
 
 ```javascript
 component.removeTrait('title');
 component.removeTrait(['title', 'id']);
 ```
 
-Returns **[Array][4]** Array of removed traits
+Returns **[Array][5]** Array of removed traits
 
-## addTrait
+### addTrait
 
 Add trait/s by id/s.
 
-### Parameters
+#### Parameters
 
--   `trait` **([String][1] \| [Object][2] \| [Array][4]&lt;([String][1] \| [Object][2])>)** Trait to add (or an array of traits)
--   `opts` **Options** Options for the add (optional, default `{}`)
+*   `trait` **([String][1] | [Object][2] | [Array][5]<([String][1] | [Object][2])>)** Trait to add (or an array of traits)
+*   `opts` **Options** Options for the add (optional, default `{}`)
 
-### Examples
+#### Examples
 
 ```javascript
 component.addTrait('title', { at: 1 }); // Add title trait (`at` option is the position index)
@@ -537,32 +536,33 @@ component.addTrait({
 component.addTrait(['title', {...}, ...]);
 ```
 
-Returns **[Array][4]** Array of added traits
+Returns **[Array][5]** Array of added traits
 
-## getName
+### getName
 
 Get the name of the component
 
 Returns **[String][1]** 
 
-## getIcon
+### getIcon
 
 Get the icon string
 
 Returns **[String][1]** 
 
-## toHTML
+### toHTML
 
 Return HTML string of the component
 
-### Parameters
+#### Parameters
 
--   `opts` **[Object][2]** Options (optional, default `{}`)
-    -   `opts.tag` **[String][1]?** Custom tagName
-    -   `opts.attributes` **([Object][2] \| [Function][6])** You can pass an object of custom attributes to replace
+*   `opts` **[Object][2]** Options (optional, default `{}`)
+
+    *   `opts.tag` **[String][1]?** Custom tagName
+    *   `opts.attributes` **([Object][2] | [Function][4])** You can pass an object of custom attributes to replace
         with the current one or you can even pass a function to generate attributes dynamically (optional, default `null`)
 
-### Examples
+#### Examples
 
 ```javascript
 // Simple HTML return
@@ -589,62 +589,62 @@ component.toHTML({
 
 Returns **[String][1]** HTML string
 
-## getChangedProps
+### getChangedProps
 
 Return an object containing only changed props
 
-### Parameters
+#### Parameters
 
--   `res`  
+*   `res`  
 
-## getId
+### getId
 
 Return the component id
 
 Returns **[String][1]** 
 
-## setId
+### setId
 
 Set new id on the component
 
-### Parameters
+#### Parameters
 
--   `id` **[String][1]** 
--   `opts`  
+*   `id` **[String][1]** 
+*   `opts`  
 
 Returns **this** 
 
-## getEl
+### getEl
 
 Get the DOM element of the component.
 This works only if the component is already rendered
 
-### Parameters
+#### Parameters
 
--   `frame` **Frame** Specific frame from which taking the element
+*   `frame` **Frame** Specific frame from which taking the element
 
 Returns **[HTMLElement][12]** 
 
-## getView
+### getView
 
 Get the View of the component.
 This works only if the component is already rendered
 
-### Parameters
+#### Parameters
 
--   `frame` **Frame** Get View of a specific frame
+*   `frame` **Frame** Get View of a specific frame
 
 Returns **ComponentView** 
 
-## onAll
+### onAll
 
 Execute callback function on itself and all inner components
 
-### Parameters
+#### Parameters
 
--   `clb` **[Function][6]** Callback function, the model is passed as an argument
+*   `clb` **[Function][4]** Callback function, the model is passed as an argument
 
-### Examples
+#### Examples
 
 ```javascript
 component.onAll(component => {
@@ -654,26 +654,26 @@ component.onAll(component => {
 
 Returns **this** 
 
-## remove
+### remove
 
 Remove the component
 
-### Parameters
+#### Parameters
 
--   `opts`   (optional, default `{}`)
+*   `opts`   (optional, default `{}`)
 
 Returns **this** 
 
-## move
+### move
 
 Move the component to another destination component
 
-### Parameters
+#### Parameters
 
--   `component` **[Component][9]** Destination component (so the current one will be appended as a child)
--   `opts` **[Object][2]** Options for the append action (optional, default `{}`)
+*   `component` **[Component][9]** Destination component (so the current one will be appended as a child)
+*   `opts` **[Object][2]** Options for the append action (optional, default `{}`)
 
-### Examples
+#### Examples
 
 ```javascript
 // Move the selected component on top of the wrapper
@@ -683,28 +683,28 @@ editor.getSelected().move(dest, { at: 0 });
 
 Returns **this** 
 
-## getList
+### getList
 
 The list of components is taken from the Components module.
 Initially, the list, was set statically on the Component object but it was
 not ok, as it was shared between multiple editor instances
 
-### Parameters
+#### Parameters
 
--   `model`  
+*   `model`  
 
-## checkId
+### checkId
 
 This method checks, for each parsed component and style object
 (are not Components/CSSRules yet), for duplicated id and fixes them
 This method is used in Components.js just after the parsing
 
-### Parameters
+#### Parameters
 
--   `components`  
--   `styles`   (optional, default `[]`)
--   `list`   (optional, default `{}`)
--   `opts`   (optional, default `{}`)
+*   `components`  
+*   `styles`   (optional, default `[]`)
+*   `list`   (optional, default `{}`)
+*   `opts`   (optional, default `{}`)
 
 [1]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
 
@@ -712,11 +712,11 @@ This method is used in Components.js just after the parsing
 
 [3]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean
 
-[4]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
+[4]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function
 
-[5]: https://github.com/artf/grapesjs/blob/master/src/utils/Resizer.js
+[5]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
 
-[6]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function
+[6]: https://github.com/artf/grapesjs/blob/master/src/utils/Resizer.js
 
 [7]: /modules/Components-js.html
 

docs/api/components.md

@@ -18,16 +18,16 @@ Once the editor is instantiated you can use its API. Before using these methods
 const domComponents = editor.DomComponents;
 ```
 
--   [getWrapper][2]
--   [getComponents][3]
--   [addComponent][4]
--   [clear][5]
--   [load][6]
--   [store][7]
--   [addType][8]
--   [getType][9]
--   [getTypes][10]
--   [render][11]
+*   [getWrapper][2]
+*   [getComponents][3]
+*   [addComponent][4]
+*   [clear][5]
+*   [load][6]
+*   [store][7]
+*   [addType][8]
+*   [getType][9]
+*   [getTypes][10]
+*   [render][11]
 
 ## load
 
@@ -37,7 +37,7 @@ The fetched data will be added to the collection
 
 ### Parameters
 
--   `data` **[Object][12]** Object of data to load (optional, default `''`)
+*   `data` **[Object][12]** Object of data to load (optional, default `''`)
 
 Returns **[Object][12]** Loaded data
 
@@ -47,7 +47,7 @@ Store components on the selected storage
 
 ### Parameters
 
--   `noStore` **[Boolean][13]** If true, won't store
+*   `noStore` **[Boolean][13]** If true, won't store
 
 Returns **[Object][12]** Data to store
 
@@ -107,19 +107,20 @@ as 'domComponents.getComponents().add(...)'
 
 ### Parameters
 
--   `component` **([Object][12] | Component | [Array][14]<[Object][12]>)** Component/s to add
-    -   `component.tagName` **[string][15]** Tag name (optional, default `'div'`)
-    -   `component.type` **[string][15]** Type of the component. Available: ''(default), 'text', 'image' (optional, default `''`)
-    -   `component.removable` **[boolean][13]** If component is removable (optional, default `true`)
-    -   `component.draggable` **[boolean][13]** If is possible to move the component around the structure (optional, default `true`)
-    -   `component.droppable` **[boolean][13]** If is possible to drop inside other components (optional, default `true`)
-    -   `component.badgable` **[boolean][13]** If the badge is visible when the component is selected (optional, default `true`)
-    -   `component.stylable` **[boolean][13]** If is possible to style component (optional, default `true`)
-    -   `component.copyable` **[boolean][13]** If is possible to copy&paste the component (optional, default `true`)
-    -   `component.content` **[string][15]** String inside component (optional, default `''`)
-    -   `component.style` **[Object][12]** Style object (optional, default `{}`)
-    -   `component.attributes` **[Object][12]** Attribute object (optional, default `{}`)
--   `opt` **[Object][12]** the options object to be used by the [Components.add][getComponents][3] method (optional, default `{}`)
+*   `component` **([Object][12] | Component | [Array][14]<[Object][12]>)** Component/s to add
+
+    *   `component.tagName` **[string][15]** Tag name (optional, default `'div'`)
+    *   `component.type` **[string][15]** Type of the component. Available: ''(default), 'text', 'image' (optional, default `''`)
+    *   `component.removable` **[boolean][13]** If component is removable (optional, default `true`)
+    *   `component.draggable` **[boolean][13]** If is possible to move the component around the structure (optional, default `true`)
+    *   `component.droppable` **[boolean][13]** If is possible to drop inside other components (optional, default `true`)
+    *   `component.badgable` **[boolean][13]** If the badge is visible when the component is selected (optional, default `true`)
+    *   `component.stylable` **[boolean][13]** If is possible to style component (optional, default `true`)
+    *   `component.copyable` **[boolean][13]** If is possible to copy\&paste the component (optional, default `true`)
+    *   `component.content` **[string][15]** String inside component (optional, default `''`)
+    *   `component.style` **[Object][12]** Style object (optional, default `{}`)
+    *   `component.attributes` **[Object][12]** Attribute object (optional, default `{}`)
+*   `opt` **[Object][12]** the options object to be used by the \[Components.add][getComponents][3] method (optional, default `{}`)
 
 ### Examples
 
@@ -136,7 +137,7 @@ var comp1 = domComponents.addComponent({
 });
 ```
 
-Returns **(Component | [Array][14]&lt;Component>)** Component/s added
+Returns **(Component | [Array][14]\<Component>)** Component/s added
 
 ## render
 
@@ -153,7 +154,7 @@ Remove all components
 
 ### Parameters
 
--   `opts`   (optional, default `{}`)
+*   `opts`   (optional, default `{}`)
 
 Returns **this** 
 
@@ -164,8 +165,8 @@ Read more about this in [Define New Component][17]
 
 ### Parameters
 
--   `type` **[string][15]** Component ID
--   `methods` **[Object][12]** Component methods
+*   `type` **[string][15]** Component ID
+*   `methods` **[Object][12]** Component methods
 
 Returns **this** 
 
@@ -176,7 +177,7 @@ Read more about this in [Define New Component][17]
 
 ### Parameters
 
--   `type` **[string][15]** Component ID
+*   `type` **[string][15]** Component ID
 
 Returns **[Object][12]** Component type defintion, eg. `{ model: ..., view: ... }`
 
@@ -186,10 +187,10 @@ Remove component type
 
 ### Parameters
 
--   `id`  
--   `type` **[string][15]** Component ID
+*   `id`  
+*   `type` **[string][15]** Component ID
 
-Returns **([Object][12] \| [undefined][18])** Removed component type, undefined otherwise
+Returns **([Object][12] | [undefined][18])** Removed component type, undefined otherwise
 
 ## getTypes
 

docs/api/css_composer.md

@@ -19,14 +19,14 @@ Once the editor is instantiated you can use its API. Before using these methods
 const cssComposer = editor.CssComposer;
 ```
 
--   [load][2]
--   [store][3]
--   [add][4]
--   [get][5]
--   [getAll][6]
--   [clear][7]
--   [setRule][8]
--   [getRule][9]
+*   [load][2]
+*   [store][3]
+*   [add][4]
+*   [get][5]
+*   [getAll][6]
+*   [clear][7]
+*   [setRule][8]
+*   [getRule][9]
 
 ## load
 
@@ -36,7 +36,7 @@ The fetched data will be added to the collection
 
 ### Parameters
 
--   `data` **[Object][10]** Object of data to load
+*   `data` **[Object][10]** Object of data to load
 
 Returns **[Object][10]** Loaded rules
 
@@ -46,7 +46,7 @@ Store data to the selected storage
 
 ### Parameters
 
--   `noStore` **[Boolean][11]** If true, won't store
+*   `noStore` **[Boolean][11]** If true, won't store
 
 Returns **[Object][10]** Data to store
 
@@ -56,12 +56,12 @@ Add new rule to the collection, if not yet exists with the same selectors
 
 ### Parameters
 
--   `selectors` **[Array][12]<Selector>** Array of selectors
--   `state` **[String][13]** Css rule state
--   `width` **[String][13]** For which device this style is oriented
--   `opts` **[Object][10]** Options for the add of new rule (optional, default `{}`)
--   `addOpts`   (optional, default `{}`)
--   `props` **[Object][10]** Other props for the rule
+*   `selectors` **[Array][12]\<Selector>** Array of selectors
+*   `state` **[String][13]** Css rule state
+*   `width` **[String][13]** For which device this style is oriented
+*   `opts` **[Object][10]** Options for the add of new rule (optional, default `{}`)
+*   `addOpts`   (optional, default `{}`)
+*   `props` **[Object][10]** Other props for the rule
 
 ### Examples
 
@@ -84,10 +84,10 @@ Get the rule
 
 ### Parameters
 
--   `selectors` **[Array][12]&lt;Selector>** Array of selectors
--   `state` **[String][13]** Css rule state
--   `width` **[String][13]** For which device this style is oriented
--   `ruleProps` **[Object][10]** Other rule props
+*   `selectors` **[Array][12]\<Selector>** Array of selectors
+*   `state` **[String][13]** Css rule state
+*   `width` **[String][13]** For which device this style is oriented
+*   `ruleProps` **[Object][10]** Other rule props
 
 ### Examples
 
@@ -117,7 +117,7 @@ Remove all rules
 
 ### Parameters
 
--   `opts`   (optional, default `{}`)
+*   `opts`   (optional, default `{}`)
 
 Returns **this** 
 
@@ -127,11 +127,12 @@ Add/update the CSS rule with a generic selector
 
 ### Parameters
 
--   `selectors` **[string][13]** Selector, eg. '.myclass'
--   `style` **[Object][10]** Style properties and values
--   `opts` **[Object][10]** Additional properties (optional, default `{}`)
-    -   `opts.atRuleType` **[String][13]** At-rule type, eg. 'media' (optional, default `''`)
-    -   `opts.atRuleParams` **[String][13]** At-rule parameters, eg. '(min-width: 500px)' (optional, default `''`)
+*   `selectors` **[string][13]** Selector, eg. '.myclass'
+*   `style` **[Object][10]** Style properties and values
+*   `opts` **[Object][10]** Additional properties (optional, default `{}`)
+
+    *   `opts.atRuleType` **[String][13]** At-rule type, eg. 'media' (optional, default `''`)
+    *   `opts.atRuleParams` **[String][13]** At-rule parameters, eg. '(min-width: 500px)' (optional, default `''`)
 
 ### Examples
 
@@ -158,8 +159,8 @@ Get the CSS rule by a generic selector
 
 ### Parameters
 
--   `selectors` **[string][13]** Selector, eg. '.myclass:hover'
--   `opts`   (optional, default `{}`)
+*   `selectors` **[string][13]** Selector, eg. '.myclass:hover'
+*   `opts`   (optional, default `{}`)
 
 ### Examples
 
@@ -180,7 +181,7 @@ Find rules, in different states (eg. like `:hover`) and media queries, matching
 
 ### Parameters
 
--   `selector` **[string][13]** Selector, eg. '.myclass'
+*   `selector` **[string][13]** Selector, eg. '.myclass'
 
 ### Examples
 
@@ -191,7 +192,7 @@ const rules = cc.getRules(`#${id}`);
 console.log(rules.map(rule => rule.toCSS()))
 ```
 
-Returns **[Array][12]&lt;CssRule>** 
+Returns **[Array][12]\<CssRule>** 
 
 [1]: https://github.com/artf/grapesjs/blob/master/src/css_composer/config/config.js
 

docs/api/device_manager.md

@@ -18,9 +18,9 @@ Once the editor is instantiated you can use its API. Before using these methods
 const deviceManager = editor.DeviceManager;
 ```
 
--   [add][2]
--   [get][3]
--   [getAll][4]
+*   [add][2]
+*   [get][3]
+*   [getAll][4]
 
 ## add
 
@@ -28,9 +28,9 @@ Add new device to the collection. URLs are supposed to be unique
 
 ### Parameters
 
--   `id` **[String][5]** Device id
--   `width` **[String][5]** Width of the device
--   `opts` **[Object][6]?** Custom options (optional, default `{}`)
+*   `id` **[String][5]** Device id
+*   `width` **[String][5]** Width of the device
+*   `opts` **[Object][6]?** Custom options (optional, default `{}`)
 
 ### Examples
 
@@ -53,7 +53,7 @@ Return device by name
 
 ### Parameters
 
--   `name` **[string][5]** Name of the device
+*   `name` **[string][5]** Name of the device
 
 ### Examples
 

docs/api/editor.md

@@ -23,109 +23,110 @@ editor.on('EVENT-NAME', (some, argument) => {
 
 ### Components
 
--   `component:create` - Component is created (only the model, is not yet mounted in the canvas), called after the init() method
--   `component:mount` - Component is mounted to an element and rendered in canvas
--   `component:add` - Triggered when a new component is added to the editor, the model is passed as an argument to the callback
--   `component:remove` - Triggered when a component is removed, the model is passed as an argument to the callback
--   `component:remove:before` - Triggered before the remove of the component, the model, remove function (if aborted via options, with this function you can complete the remove) and options (use options.abort = true to prevent remove), are passed as arguments to the callback
--   `component:clone` - Triggered when a component is cloned, the new model is passed as an argument to the callback
--   `component:update` - Triggered when a component is updated (moved, styled, etc.), the model is passed as an argument to the callback
--   `component:update:{propertyName}` - Listen any property change, the model is passed as an argument to the callback
--   `component:styleUpdate` - Triggered when the style of the component is updated, the model is passed as an argument to the callback
--   `component:styleUpdate:{propertyName}` - Listen for a specific style property change, the model is passed as an argument to the callback
--   `component:selected` - New component selected, the selected model is passed as an argument to the callback
--   `component:deselected` - Component deselected, the deselected model is passed as an argument to the callback
--   `component:toggled` - Component selection changed, toggled model is passed as an argument to the callback
--   `component:type:add` - New component type added, the new type is passed as an argument to the callback
--   `component:type:update` - Component type updated, the updated type is passed as an argument to the callback
--   `component:drag:start` - Component drag started. Passed an object, to the callback, containing the `target` (component to drag), `parent` (parent of the component) and `index` (component index in the parent)
--   `component:drag` - During component drag. Passed the same object as in `component:drag:start` event, but in this case, `parent` and `index` are updated by the current pointer
--   `component:drag:end` - Component drag ended. Passed the same object as in `component:drag:start` event, but in this case, `parent` and `index` are updated by the final pointer
+*   `component:create` - Component is created (only the model, is not yet mounted in the canvas), called after the init() method
+*   `component:mount` - Component is mounted to an element and rendered in canvas
+*   `component:add` - Triggered when a new component is added to the editor, the model is passed as an argument to the callback
+*   `component:remove` - Triggered when a component is removed, the model is passed as an argument to the callback
+*   `component:remove:before` - Triggered before the remove of the component, the model, remove function (if aborted via options, with this function you can complete the remove) and options (use options.abort = true to prevent remove), are passed as arguments to the callback
+*   `component:clone` - Triggered when a component is cloned, the new model is passed as an argument to the callback
+*   `component:update` - Triggered when a component is updated (moved, styled, etc.), the model is passed as an argument to the callback
+*   `component:update:{propertyName}` - Listen any property change, the model is passed as an argument to the callback
+*   `component:styleUpdate` - Triggered when the style of the component is updated, the model is passed as an argument to the callback
+*   `component:styleUpdate:{propertyName}` - Listen for a specific style property change, the model is passed as an argument to the callback
+*   `component:selected` - New component selected, the selected model is passed as an argument to the callback
+*   `component:deselected` - Component deselected, the deselected model is passed as an argument to the callback
+*   `component:toggled` - Component selection changed, toggled model is passed as an argument to the callback
+*   `component:type:add` - New component type added, the new type is passed as an argument to the callback
+*   `component:type:update` - Component type updated, the updated type is passed as an argument to the callback
+*   `component:drag:start` - Component drag started. Passed an object, to the callback, containing the `target` (component to drag), `parent` (parent of the component) and `index` (component index in the parent)
+*   `component:drag` - During component drag. Passed the same object as in `component:drag:start` event, but in this case, `parent` and `index` are updated by the current pointer
+*   `component:drag:end` - Component drag ended. Passed the same object as in `component:drag:start` event, but in this case, `parent` and `index` are updated by the final pointer
 
 ### Blocks
 
--   `block:add` - New block added
--   `block:remove` - Block removed
--   `block:drag:start` - Started dragging block, model of the block is passed as an argument
--   `block:drag` - Dragging block, the block's model and the drag event are passed as arguments
--   `block:drag:stop` - Dragging of the block is stopped. As agruments for the callback you get, the dropped component model (if dropped successfully) and the model of the block
+*   `block:add` - New block added
+*   `block:remove` - Block removed
+*   `block:drag:start` - Started dragging block, model of the block is passed as an argument
+*   `block:drag` - Dragging block, the block's model and the drag event are passed as arguments
+*   `block:drag:stop` - Dragging of the block is stopped. As agruments for the callback you get, the dropped component model (if dropped successfully) and the model of the block
 
 ### Assets
 
--   `asset:add` - New asset added
--   `asset:remove` - Asset removed
--   `asset:upload:start` - Before the upload is started
--   `asset:upload:end` - After the upload is ended
--   `asset:upload:error` - On any error in upload, passes the error as an argument
--   `asset:upload:response` - On upload response, passes the result as an argument
+*   `asset:add` - New asset added
+*   `asset:remove` - Asset removed
+*   `asset:upload:start` - Before the upload is started
+*   `asset:upload:end` - After the upload is ended
+*   `asset:upload:error` - On any error in upload, passes the error as an argument
+*   `asset:upload:response` - On upload response, passes the result as an argument
 
 ### Keymaps
 
--   `keymap:add` - New keymap added. The new keyamp object is passed as an argument
--   `keymap:remove` - Keymap removed. The removed keyamp object is passed as an argument
--   `keymap:emit` - Some keymap emitted, in arguments you get keymapId, shortcutUsed, Event
--   `keymap:emit:{keymapId}` - `keymapId` emitted, in arguments you get keymapId, shortcutUsed, Event
+*   `keymap:add` - New keymap added. The new keyamp object is passed as an argument
+*   `keymap:remove` - Keymap removed. The removed keyamp object is passed as an argument
+*   `keymap:emit` - Some keymap emitted, in arguments you get keymapId, shortcutUsed, Event
+*   `keymap:emit:{keymapId}` - `keymapId` emitted, in arguments you get keymapId, shortcutUsed, Event
 
 ### Style Manager
 
--   `styleManager:update:target` - The target (Component or CSSRule) is changed
--   `styleManager:change` - Triggered on style property change from new selected component, the view of the property is passed as an argument to the callback
--   `styleManager:change:{propertyName}` - As above but for a specific style property
+*   `styleManager:update:target` - The target (Component or CSSRule) is changed
+*   `styleManager:change` - Triggered on style property change from new selected component, the view of the property is passed as an argument to the callback
+*   `styleManager:change:{propertyName}` - As above but for a specific style property
 
 ### Storages
 
--   `storage:start` - Before the storage request is started
--   `storage:start:store` - Before the store request. The object to store is passed as an argumnet (which you can edit)
--   `storage:start:load` - Before the load request. Items to load are passed as an argumnet (which you can edit)
--   `storage:load` - Triggered when something was loaded from the storage, loaded object passed as an argumnet
--   `storage:store` - Triggered when something is stored to the storage, stored object passed as an argumnet
--   `storage:end` - After the storage request is ended
--   `storage:end:store` - After the store request
--   `storage:end:load` - After the load request
--   `storage:error` - On any error on storage request, passes the error as an argument
--   `storage:error:store` - Error on store request, passes the error as an argument
--   `storage:error:load` - Error on load request, passes the error as an argument
+*   `storage:start` - Before the storage request is started
+*   `storage:start:store` - Before the store request. The object to store is passed as an argumnet (which you can edit)
+*   `storage:start:load` - Before the load request. Items to load are passed as an argumnet (which you can edit)
+*   `storage:load` - Triggered when something was loaded from the storage, loaded object passed as an argumnet
+*   `storage:store` - Triggered when something is stored to the storage, stored object passed as an argumnet
+*   `storage:end` - After the storage request is ended
+*   `storage:end:store` - After the store request
+*   `storage:end:load` - After the load request
+*   `storage:error` - On any error on storage request, passes the error as an argument
+*   `storage:error:store` - Error on store request, passes the error as an argument
+*   `storage:error:load` - Error on load request, passes the error as an argument
 
 ### Canvas
 
--   `canvas:dragenter` - When something is dragged inside the canvas, `DataTransfer` instance passed as an argument
--   `canvas:dragover` - When something is dragging on canvas, `DataTransfer` instance passed as an argument
--   `canvas:drop` - Something is dropped in canvas, `DataTransfer` instance and the dropped model are passed as arguments
--   `canvas:dragend` - When a drag operation is ended, `DataTransfer` instance passed as an argument
--   `canvas:dragdata` - On any dataTransfer parse, `DataTransfer` instance and the `result` are passed as arguments.
-    By changing `result.content` you're able to customize what is dropped
+*   `canvas:dragenter` - When something is dragged inside the canvas, `DataTransfer` instance passed as an argument
+*   `canvas:dragover` - When something is dragging on canvas, `DataTransfer` instance passed as an argument
+*   `canvas:drop` - Something is dropped in canvas, `DataTransfer` instance and the dropped model are passed as arguments
+*   `canvas:dragend` - When a drag operation is ended, `DataTransfer` instance passed as an argument
+*   `canvas:dragdata` - On any dataTransfer parse, `DataTransfer` instance and the `result` are passed as arguments.
+
+By changing `result.content` you're able to customize what is dropped
 
 ### Selectors
 
--   `selector:add` - New selector is add. Passes the new selector as an argument
--   `selector:remove` - Selector removed. Passes the removed selector as an argument
--   `selector:update` - Selector updated. Passes the updated selector as an argument
--   `selector:state` - State changed. Passes the new state value as an argument
+*   `selector:add` - New selector is add. Passes the new selector as an argument
+*   `selector:remove` - Selector removed. Passes the removed selector as an argument
+*   `selector:update` - Selector updated. Passes the updated selector as an argument
+*   `selector:state` - State changed. Passes the new state value as an argument
 
 ### RTE
 
--   `rte:enable` - RTE enabled. The view, on which RTE is enabled, is passed as an argument
--   `rte:disable` - RTE disabled. The view, on which RTE is disabled, is passed as an argument
+*   `rte:enable` - RTE enabled. The view, on which RTE is enabled, is passed as an argument
+*   `rte:disable` - RTE disabled. The view, on which RTE is disabled, is passed as an argument
 
 ### Modal
 
--   `modal:open` - Modal is opened
--   `modal:close` - Modal is closed
+*   `modal:open` - Modal is opened
+*   `modal:close` - Modal is closed
 
 ### Parser
 
--   `parse:html` - On HTML parse, an object containing the input and the output of the parser is passed as an argument
--   `parse:css` - On CSS parse, an object containing the input and the output of the parser is passed as an argument
+*   `parse:html` - On HTML parse, an object containing the input and the output of the parser is passed as an argument
+*   `parse:css` - On CSS parse, an object containing the input and the output of the parser is passed as an argument
 
 ### Commands
 
--   `run:{commandName}` - Triggered when some command is called to run (eg. editor.runCommand('preview'))
--   `stop:{commandName}` - Triggered when some command is called to stop (eg. editor.stopCommand('preview'))
--   `run:{commandName}:before` - Triggered before the command is called
--   `stop:{commandName}:before` - Triggered before the command is called to stop
--   `abort:{commandName}` - Triggered when the command execution is aborted (`editor.on(`run:preview:before`, opts => opts.abort = 1);`)
--   `run` - Triggered on run of any command. The id and the result are passed as arguments to the callback
--   `stop` - Triggered on stop of any command. The id and the result are passed as arguments to the callback
+*   `run:{commandName}` - Triggered when some command is called to run (eg. editor.runCommand('preview'))
+*   `stop:{commandName}` - Triggered when some command is called to stop (eg. editor.stopCommand('preview'))
+*   `run:{commandName}:before` - Triggered before the command is called
+*   `stop:{commandName}:before` - Triggered before the command is called to stop
+*   `abort:{commandName}` - Triggered when the command execution is aborted (`editor.on(`run:preview:before`, opts => opts.abort = 1);`)
+*   `run` - Triggered on run of any command. The id and the result are passed as arguments to the callback
+*   `stop` - Triggered on stop of any command. The id and the result are passed as arguments to the callback
 
 ### Pages
 
@@ -133,11 +134,11 @@ Check the [Pages][2] module.
 
 ### General
 
--   `canvasScroll` - Canvas is scrolled
--   `update` - The structure of the template is updated (its HTML/CSS)
--   `undo` - Undo executed
--   `redo` - Redo executed
--   `load` - Editor is loaded
+*   `canvasScroll` - Canvas is scrolled
+*   `update` - The structure of the template is updated (its HTML/CSS)
+*   `undo` - Undo executed
+*   `redo` - Redo executed
+*   `load` - Editor is loaded
 
 ## getConfig
 
@@ -145,10 +146,10 @@ Returns configuration object
 
 ### Parameters
 
--   `prop` **[string][3]?** Property name
+*   `prop` **[string][3]?** Property name
 
 Returns **any** Returns the configuration object or
- the value of the specified property
+the value of the specified property
 
 ## getHtml
 
@@ -156,8 +157,9 @@ Returns HTML built inside canvas
 
 ### Parameters
 
--   `opts` **[Object][4]** Options (optional, default `{}`)
-    -   `opts.cleanId` **[Boolean][5]** Remove unnecessary IDs (eg. those created automatically) (optional, default `false`)
+*   `opts` **[Object][4]** Options (optional, default `{}`)
+
+    *   `opts.cleanId` **[Boolean][5]** Remove unnecessary IDs (eg. those created automatically) (optional, default `false`)
 
 Returns **[string][3]** HTML string
 
@@ -167,8 +169,9 @@ Returns CSS built inside canvas
 
 ### Parameters
 
--   `opts` **[Object][4]** Options (optional, default `{}`)
-    -   `opts.avoidProtected` **[Boolean][5]** Don't include protected CSS (optional, default `false`)
+*   `opts` **[Object][4]** Options (optional, default `{}`)
+
+    *   `opts.avoidProtected` **[Boolean][5]** Don't include protected CSS (optional, default `false`)
 
 Returns **[string][3]** CSS string
 
@@ -196,8 +199,8 @@ Set components inside editor's canvas. This method overrides actual components
 
 ### Parameters
 
--   `components` **([Array][6]<[Object][4]> | [Object][4] \| [string][3])** HTML string or components model
--   `opt` **[Object][4]** the options object to be used by the [setComponents][em#setComponents][7] method (optional, default `{}`)
+*   `components` **([Array][6]<[Object][4]> | [Object][4] | [string][3])** HTML string or components model
+*   `opt` **[Object][4]** the options object to be used by the \[setComponents][em#setComponents][7] method (optional, default `{}`)
 
 ### Examples
 
@@ -219,9 +222,10 @@ Add components
 
 ### Parameters
 
--   `components` **([Array][6]&lt;[Object][4]> | [Object][4] \| [string][3])** HTML string or components model
--   `opts` **[Object][4]** Options
-    -   `opts.avoidUpdateStyle` **[Boolean][5]** If the HTML string contains styles,
+*   `components` **([Array][6]<[Object][4]> | [Object][4] | [string][3])** HTML string or components model
+*   `opts` **[Object][4]** Options
+
+    *   `opts.avoidUpdateStyle` **[Boolean][5]** If the HTML string contains styles,
         by default, they will be created and, if already exist, updated. When this option
         is true, styles already created will not be updated. (optional, default `false`)
 
@@ -237,7 +241,7 @@ editor.addComponents({
 });
 ```
 
-Returns **[Array][6]&lt;Component>** 
+Returns **[Array][6]\<Component>** 
 
 ## getStyle
 
@@ -251,8 +255,8 @@ Set style inside editor's canvas. This method overrides actual style
 
 ### Parameters
 
--   `style` **([Array][6]&lt;[Object][4]> | [Object][4] \| [string][3])** CSS string or style model
--   `opt` **[Object][4]** the options object to be used by the [setStyle][em#setStyle][8] method (optional, default `{}`)
+*   `style` **([Array][6]<[Object][4]> | [Object][4] | [string][3])** CSS string or style model
+*   `opt` **[Object][4]** the options object to be used by the \[setStyle][em#setStyle][8] method (optional, default `{}`)
 
 ### Examples
 
@@ -295,9 +299,10 @@ Select a component
 
 ### Parameters
 
--   `el` **(Component | [HTMLElement][9])** Component to select
--   `opts` **[Object][4]?** Options
-    -   `opts.scroll` **[Boolean][5]?** Scroll canvas to the selected element
+*   `el` **(Component | [HTMLElement][9])** Component to select
+*   `opts` **[Object][4]?** Options
+
+    *   `opts.scroll` **[Boolean][5]?** Scroll canvas to the selected element
 
 ### Examples
 
@@ -316,7 +321,7 @@ Add component to selection
 
 ### Parameters
 
--   `el` **(Component | [HTMLElement][9] \| [Array][6])** Component to select
+*   `el` **(Component | [HTMLElement][9] | [Array][6])** Component to select
 
 ### Examples
 
@@ -332,7 +337,7 @@ Remove component from selection
 
 ### Parameters
 
--   `el` **(Component | [HTMLElement][9] \| [Array][6])** Component to select
+*   `el` **(Component | [HTMLElement][9] | [Array][6])** Component to select
 
 ### Examples
 
@@ -348,7 +353,7 @@ Toggle component selection
 
 ### Parameters
 
--   `el` **(Component | [HTMLElement][9] \| [Array][6])** Component to select
+*   `el` **(Component | [HTMLElement][9] | [Array][6])** Component to select
 
 ### Examples
 
@@ -365,7 +370,7 @@ change the canvas to the proper width
 
 ### Parameters
 
--   `name` **[string][3]** Name of the device
+*   `name` **[string][3]** Name of the device
 
 ### Examples
 
@@ -395,8 +400,8 @@ Execute command
 
 ### Parameters
 
--   `id` **[string][3]** Command ID
--   `options` **[Object][4]** Custom options (optional, default `{}`)
+*   `id` **[string][3]** Command ID
+*   `options` **[Object][4]** Custom options (optional, default `{}`)
 
 ### Examples
 
@@ -412,8 +417,8 @@ Stop the command if stop method was provided
 
 ### Parameters
 
--   `id` **[string][3]** Command ID
--   `options` **[Object][4]** Custom options (optional, default `{}`)
+*   `id` **[string][3]** Command ID
+*   `options` **[Object][4]** Custom options (optional, default `{}`)
 
 ### Examples
 
@@ -429,7 +434,7 @@ Store data to the current storage
 
 ### Parameters
 
--   `clb` **[Function][10]** Callback function
+*   `clb` **[Function][10]** Callback function
 
 Returns **[Object][4]** Stored data
 
@@ -439,7 +444,7 @@ Load data from the current storage
 
 ### Parameters
 
--   `clb` **[Function][10]** Callback function
+*   `clb` **[Function][10]** Callback function
 
 Returns **[Object][4]** Stored data
 
@@ -467,9 +472,10 @@ refresh you'll get misleading position of tools
 
 ### Parameters
 
--   `opts`  
--   `options` **[Object][4]?** Options
-    -   `options.tools` **[Boolean][5]** Update the position of tools (eg. rich text editor, component highlighter, etc.) (optional, default `false`)
+*   `opts`  
+*   `options` **[Object][4]?** Options
+
+    *   `options.tools` **[Boolean][5]** Update the position of tools (eg. rich text editor, component highlighter, etc.) (optional, default `false`)
 
 ## setCustomRte
 
@@ -477,7 +483,7 @@ Replace the built-in Rich Text Editor with a custom one.
 
 ### Parameters
 
--   `obj` **[Object][4]** Custom RTE Interface
+*   `obj` **[Object][4]** Custom RTE Interface
 
 ### Examples
 
@@ -517,7 +523,7 @@ custom parser, pass `null` as the argument
 
 ### Parameters
 
--   `parser` **([Function][10] | null)** Parser function
+*   `parser` **([Function][10] | null)** Parser function
 
 ### Examples
 
@@ -543,7 +549,7 @@ To get more about this feature read: [https://github.com/artf/grapesjs/issues/19
 
 ### Parameters
 
--   `value` **[String][3]** Drag mode, options: 'absolute' | 'translate'
+*   `value` **[String][3]** Drag mode, options: 'absolute' | 'translate'
 
 Returns **this** 
 
@@ -553,10 +559,11 @@ Trigger event log message
 
 ### Parameters
 
--   `msg` **any** Message to log
--   `opts` **[Object][4]** Custom options (optional, default `{}`)
-    -   `opts.ns` **[String][3]** Namespace of the log (eg. to use in plugins) (optional, default `''`)
-    -   `opts.level` **[String][3]** Level of the log, `debug`, `info`, `warning`, `error` (optional, default `'debug'`)
+*   `msg` **any** Message to log
+*   `opts` **[Object][4]** Custom options (optional, default `{}`)
+
+    *   `opts.ns` **[String][3]** Namespace of the log (eg. to use in plugins) (optional, default `''`)
+    *   `opts.level` **[String][3]** Level of the log, `debug`, `info`, `warning`, `error` (optional, default `'debug'`)
 
 ### Examples
 
@@ -577,11 +584,12 @@ Translate label
 
 ### Parameters
 
--   `args` **...any** 
--   `key` **[String][3]** Label to translate
--   `opts` **[Object][4]?** Options for the translation
-    -   `opts.params` **[Object][4]?** Params for the translation
-    -   `opts.noWarn` **[Boolean][5]?** Avoid warnings in case of missing resources
+*   `args` **...any** 
+*   `key` **[String][3]** Label to translate
+*   `opts` **[Object][4]?** Options for the translation
+
+    *   `opts.params` **[Object][4]?** Params for the translation
+    *   `opts.noWarn` **[Boolean][5]?** Avoid warnings in case of missing resources
 
 ### Examples
 
@@ -601,8 +609,8 @@ Attach event
 
 ### Parameters
 
--   `event` **[string][3]** Event name
--   `callback` **[Function][10]** Callback function
+*   `event` **[string][3]** Event name
+*   `callback` **[Function][10]** Callback function
 
 Returns **this** 
 
@@ -612,8 +620,8 @@ Attach event and detach it after the first run
 
 ### Parameters
 
--   `event` **[string][3]** Event name
--   `callback` **[Function][10]** Callback function
+*   `event` **[string][3]** Event name
+*   `callback` **[Function][10]** Callback function
 
 Returns **this** 
 
@@ -623,8 +631,8 @@ Detach event
 
 ### Parameters
 
--   `event` **[string][3]** Event name
--   `callback` **[Function][10]** Callback function
+*   `event` **[string][3]** Event name
+*   `callback` **[Function][10]** Callback function
 
 Returns **this** 
 
@@ -634,7 +642,7 @@ Trigger event
 
 ### Parameters
 
--   `event` **[string][3]** Event to trigger
+*   `event` **[string][3]** Event to trigger
 
 Returns **this** 
 

docs/api/i18n.md

@@ -25,9 +25,9 @@ const i18n = editor.I18n;
 
 ### Events
 
--   `i18n:add` - New set of messages is added
--   `i18n:update` - The set of messages is updated
--   `i18n:locale` - Locale changed
+*   `i18n:add` - New set of messages is added
+*   `i18n:update` - The set of messages is updated
+*   `i18n:locale` - Locale changed
 
 ## getConfig
 
@@ -41,7 +41,7 @@ Update current locale
 
 ### Parameters
 
--   `locale` **[String][3]** Locale value
+*   `locale` **[String][3]** Locale value
 
 ### Examples
 
@@ -63,9 +63,10 @@ Get all messages
 
 ### Parameters
 
--   `lang` **[String][3]?** Specify the language of messages to return
--   `opts` **[Object][2]?** Options (optional, default `{}`)
-    -   `opts.debug` **[Boolean][4]?** Show warnings in case of missing language
+*   `lang` **[String][3]?** Specify the language of messages to return
+*   `opts` **[Object][2]?** Options (optional, default `{}`)
+
+    *   `opts.debug` **[Boolean][4]?** Show warnings in case of missing language
 
 ### Examples
 
@@ -84,7 +85,7 @@ Set new set of messages
 
 ### Parameters
 
--   `msg` **[Object][2]** Set of messages
+*   `msg` **[Object][2]** Set of messages
 
 ### Examples
 
@@ -105,7 +106,7 @@ Update messages
 
 ### Parameters
 
--   `msg` **[Object][2]** Set of messages to add
+*   `msg` **[Object][2]** Set of messages to add
 
 ### Examples
 
@@ -126,10 +127,11 @@ Translate the locale message
 
 ### Parameters
 
--   `key` **[String][3]** Label to translate
--   `opts` **[Object][2]?** Options for the translation (optional, default `{}`)
-    -   `opts.params` **[Object][2]?** Params for the translation
-    -   `opts.debug` **[Boolean][4]?** Show warnings in case of missing resources
+*   `key` **[String][3]** Label to translate
+*   `opts` **[Object][2]?** Options for the translation (optional, default `{}`)
+
+    *   `opts.params` **[Object][2]?** Params for the translation
+    *   `opts.debug` **[Boolean][4]?** Show warnings in case of missing resources
 
 ### Examples
 

docs/api/keymaps.md

@@ -25,12 +25,12 @@ Once the editor is instantiated you can use its API. Before using these methods
 const keymaps = editor.Keymaps;
 ```
 
--   [getConfig][1]
--   [add][2]
--   [get][3]
--   [getAll][4]
--   [remove][5]
--   [removeAll][6]
+*   [getConfig][1]
+*   [add][2]
+*   [get][3]
+*   [getAll][4]
+*   [remove][5]
+*   [removeAll][6]
 
 ## getConfig
 
@@ -44,10 +44,10 @@ Add new keymap
 
 ### Parameters
 
--   `id` **[string][8]** Keymap id
--   `keys` **[string][8]** Keymap keys, eg. `ctrl+a`, `⌘+z, ctrl+z`
--   `handler` **([Function][9] \| [string][8])** Keymap handler, might be a function
--   `opts` **[Object][7]** Options (optional, default `{}`)
+*   `id` **[string][8]** Keymap id
+*   `keys` **[string][8]** Keymap keys, eg. `ctrl+a`, `⌘+z, ctrl+z`
+*   `handler` **([Function][9] | [string][8])** Keymap handler, might be a function
+*   `opts` **[Object][7]** Options (optional, default `{}`)
 
 ### Examples
 
@@ -66,7 +66,7 @@ editor.on('keymap:emit', (id, shortcut, e) => {
 ```
 
 Returns **[Object][7]** Added keymap
- or just a command id as a string
+or just a command id as a string
 
 ## get
 
@@ -74,7 +74,7 @@ Get the keymap by id
 
 ### Parameters
 
--   `id` **[string][8]** Keymap id
+*   `id` **[string][8]** Keymap id
 
 ### Examples
 
@@ -104,7 +104,7 @@ Remove the keymap by id
 
 ### Parameters
 
--   `id` **[string][8]** Keymap id
+*   `id` **[string][8]** Keymap id
 
 ### Examples
 

docs/api/modal_dialog.md

@@ -18,15 +18,15 @@ Once the editor is instantiated you can use its API. Before using these methods
 const modal = editor.Modal;
 ```
 
--   [open][2]
--   [close][3]
--   [isOpen][4]
--   [setTitle][5]
--   [getTitle][6]
--   [setContent][7]
--   [getContent][8]
--   [onceClose][9]
--   [onceOpen][10]
+*   [open][2]
+*   [close][3]
+*   [isOpen][4]
+*   [setTitle][5]
+*   [getTitle][6]
+*   [setContent][7]
+*   [getContent][8]
+*   [onceClose][9]
+*   [onceOpen][10]
 
 ## open
 
@@ -34,10 +34,11 @@ Open the modal window
 
 ### Parameters
 
--   `opts` **[Object][11]** Options (optional, default `{}`)
-    -   `opts.title` **([String][12] \| [HTMLElement][13])?** Title to set for the modal
-    -   `opts.content` **([String][12] \| [HTMLElement][13])?** Content to set for the modal
-    -   `opts.attributes` **[Object][11]?** Updates the modal wrapper with custom attributes
+*   `opts` **[Object][11]** Options (optional, default `{}`)
+
+    *   `opts.title` **([String][12] | [HTMLElement][13])?** Title to set for the modal
+    *   `opts.content` **([String][12] | [HTMLElement][13])?** Content to set for the modal
+    *   `opts.attributes` **[Object][11]?** Updates the modal wrapper with custom attributes
 
 Returns **this** 
 
@@ -54,7 +55,7 @@ The callback will be called one only time
 
 ### Parameters
 
--   `clb` **[Function][14]** 
+*   `clb` **[Function][14]** 
 
 Returns **this** 
 
@@ -65,7 +66,7 @@ The callback will be called one only time
 
 ### Parameters
 
--   `clb` **[Function][14]** 
+*   `clb` **[Function][14]** 
 
 Returns **this** 
 
@@ -81,7 +82,7 @@ Set the title to the modal window
 
 ### Parameters
 
--   `title` **[string][12]** Title
+*   `title` **[string][12]** Title
 
 ### Examples
 
@@ -103,7 +104,7 @@ Set the content of the modal window
 
 ### Parameters
 
--   `content` **([string][12] \| [HTMLElement][13])** Content
+*   `content` **([string][12] | [HTMLElement][13])** Content
 
 ### Examples
 

docs/api/pages.md

@@ -27,21 +27,21 @@ const pageManager = editor.Pages;
 
 ## Available Events
 
--   `page:add` - Added new page. The page is passed as an argument to the callback
--   `page:remove` - Page removed. The page is passed as an argument to the callback
--   `page:select` - New page selected. The newly selected page and the previous one, are passed as arguments to the callback
--   `page:update` - Page updated. The updated page and the object containing changes are passed as arguments to the callback
--   `page` - Catch-all event for all the events mentioned above. An object containing all the available data about the triggered event is passed as an argument to the callback
+*   `page:add` - Added new page. The page is passed as an argument to the callback
+*   `page:remove` - Page removed. The page is passed as an argument to the callback
+*   `page:select` - New page selected. The newly selected page and the previous one, are passed as arguments to the callback
+*   `page:update` - Page updated. The updated page and the object containing changes are passed as arguments to the callback
+*   `page` - Catch-all event for all the events mentioned above. An object containing all the available data about the triggered event is passed as an argument to the callback
 
 ## Methods
 
--   [add][1]
--   [get][2]
--   [getAll][3]
--   [getMain][4]
--   [remove][5]
--   [select][6]
--   [getSelected][7]
+*   [add][1]
+*   [get][2]
+*   [getAll][3]
+*   [getMain][4]
+*   [remove][5]
+*   [select][6]
+*   [getSelected][7]
 
 ## add
 
@@ -49,8 +49,8 @@ Add new page
 
 ### Parameters
 
--   `props` **[Object][8]** Page properties
--   `opts` **[Object][8]?** Options (optional, default `{}`)
+*   `props` **[Object][8]** Page properties
+*   `opts` **[Object][8]?** Options (optional, default `{}`)
 
 ### Examples
 
@@ -70,8 +70,8 @@ Remove page
 
 ### Parameters
 
--   `page` **([String][9] | Page)** Page or page id
--   `opts`   (optional, default `{}`)
+*   `page` **([String][9] | Page)** Page or page id
+*   `opts`   (optional, default `{}`)
 
 ### Examples
 
@@ -90,7 +90,7 @@ Get page by id
 
 ### Parameters
 
--   `id` **[String][9]** Page id
+*   `id` **[String][9]** Page id
 
 ### Examples
 
@@ -122,7 +122,7 @@ Get all pages
 const arrayOfPages = pageManager.getAll();
 ```
 
-Returns **[Array][10]<Page>** 
+Returns **[Array][10]\<Page>** 
 
 ## select
 
@@ -130,8 +130,8 @@ Change the selected page. This will switch the page rendered in canvas
 
 ### Parameters
 
--   `page` **([String][9] | Page)** Page or page id
--   `opts`   (optional, default `{}`)
+*   `page` **([String][9] | Page)** Page or page id
+*   `opts`   (optional, default `{}`)
 
 ### Examples
 

docs/api/panels.md

@@ -18,14 +18,14 @@ Once the editor is instantiated you can use its API. Before using these methods
 const panelManager = editor.Panels;
 ```
 
--   [addPanel][2]
--   [addButton][3]
--   [getButton][4]
--   [getPanel][5]
--   [getPanels][6]
--   [getPanelsEl][7]
--   [removePanel][8]
--   [removeButton][9]
+*   [addPanel][2]
+*   [addButton][3]
+*   [getButton][4]
+*   [getPanel][5]
+*   [getPanels][6]
+*   [getPanelsEl][7]
+*   [removePanel][8]
+*   [removeButton][9]
 
 ## getPanels
 
@@ -45,7 +45,7 @@ Add new panel to the collection
 
 ### Parameters
 
--   `panel` **([Object][11] | Panel)** Object with right properties or an instance of Panel
+*   `panel` **([Object][11] | Panel)** Object with right properties or an instance of Panel
 
 ### Examples
 
@@ -65,7 +65,7 @@ Remove a panel from the collection
 
 ### Parameters
 
--   `panel` **([Object][11] | Panel | [String][12])** Object with right properties or an instance of Panel or Painel id
+*   `panel` **([Object][11] | Panel | [String][12])** Object with right properties or an instance of Panel or Painel id
 
 ### Examples
 
@@ -87,7 +87,7 @@ Get panel by ID
 
 ### Parameters
 
--   `id` **[string][12]** Id string
+*   `id` **[string][12]** Id string
 
 ### Examples
 
@@ -103,8 +103,8 @@ Add button to the panel
 
 ### Parameters
 
--   `panelId` **[string][12]** Panel's ID
--   `button` **([Object][11] | Button)** Button object or instance of Button
+*   `panelId` **[string][12]** Panel's ID
+*   `button` **([Object][11] | Button)** Button object or instance of Button
 
 ### Examples
 
@@ -142,9 +142,9 @@ Remove button from the panel
 
 ### Parameters
 
--   `panelId` **[String][12]** Panel's ID
--   `button`  
--   `buttonId` **[String][12]** Button's ID
+*   `panelId` **[String][12]** Panel's ID
+*   `button`  
+*   `buttonId` **[String][12]** Button's ID
 
 ### Examples
 
@@ -168,8 +168,8 @@ Get button from the panel
 
 ### Parameters
 
--   `panelId` **[string][12]** Panel's ID
--   `id` **[string][12]** Button's ID
+*   `panelId` **[string][12]** Panel's ID
+*   `id` **[string][12]** Button's ID
 
 ### Examples
 

docs/api/rich_text_editor.md

@@ -21,11 +21,11 @@ Once the editor is instantiated you can use its API. Before using these methods
 const rte = editor.RichTextEditor;
 ```
 
--   [add][3]
--   [get][4]
--   [getAll][5]
--   [remove][6]
--   [getToolbarEl][7]
+*   [add][3]
+*   [get][4]
+*   [getAll][5]
+*   [remove][6]
+*   [getToolbarEl][7]
 
 ## add
 
@@ -33,8 +33,8 @@ Add a new action to the built-in RTE toolbar
 
 ### Parameters
 
--   `name` **[string][8]** Action name
--   `action` **[Object][9]** Action options (optional, default `{}`)
+*   `name` **[string][8]** Action name
+*   `action` **[Object][9]** Action options (optional, default `{}`)
 
 ### Examples
 
@@ -102,7 +102,7 @@ Get the action by its name
 
 ### Parameters
 
--   `name` **[string][8]** Action name
+*   `name` **[string][8]** Action name
 
 ### Examples
 
@@ -125,7 +125,7 @@ Remove the action from the toolbar
 
 ### Parameters
 
--   `name` **[string][8]** 
+*   `name` **[string][8]** 
 
 ### Examples
 

docs/api/selector_manager.md

@@ -19,9 +19,9 @@ span > #send-btn.btn{
 
 In this scenario we get:
 
--   span     -> selector of type `tag`
--   send-btn -> selector of type `id`
--   btn      -> selector of type `class`
+*   span     -> selector of type `tag`
+*   send-btn -> selector of type `id`
+*   btn      -> selector of type `class`
 
 So, for example, being `btn` the same class entity it'll be easier to refactor and track things.
 
@@ -41,13 +41,13 @@ Once the editor is instantiated you can use its API. Before using these methods
 const selectorManager = editor.SelectorManager;
 ```
 
--   [getConfig][2]
--   [add][3]
--   [addClass][4]
--   [get][5]
--   [getAll][6]
--   [setState][7]
--   [getState][8]
+*   [getConfig][2]
+*   [add][3]
+*   [addClass][4]
+*   [get][5]
+*   [getAll][6]
+*   [setState][7]
+*   [getState][8]
 
 ## getConfig
 
@@ -61,7 +61,7 @@ Change the selector state
 
 ### Parameters
 
--   `value` **[String][10]** State value
+*   `value` **[String][10]** State value
 
 ### Examples
 
@@ -83,10 +83,11 @@ Add a new selector to collection if it's not already exists. Class type is a def
 
 ### Parameters
 
--   `name` **([String][10] \| [Array][11])** Selector/s name
--   `opts` **[Object][9]** Selector options (optional, default `{}`)
-    -   `opts.label` **[String][10]** Label for the selector, if it's not provided the label will be the same as the name (optional, default `''`)
-    -   `opts.type` **[String][10]** Type of the selector. At the moment, only 'class' (1) is available (optional, default `1`)
+*   `name` **([String][10] | [Array][11])** Selector/s name
+*   `opts` **[Object][9]** Selector options (optional, default `{}`)
+
+    *   `opts.label` **[String][10]** Label for the selector, if it's not provided the label will be the same as the name (optional, default `''`)
+    *   `opts.type` **[String][10]** Type of the selector. At the moment, only 'class' (1) is available (optional, default `1`)
 
 ### Examples
 
@@ -109,7 +110,7 @@ Add class selectors
 
 ### Parameters
 
--   `classes` **([Array][11] \| [string][10])** Array or string of classes
+*   `classes` **([Array][11] | [string][10])** Array or string of classes
 
 ### Examples
 
@@ -128,8 +129,8 @@ Get the selector by its name
 
 ### Parameters
 
--   `name` **([String][10] \| [Array][11])** Selector name
--   `type` **[String][10]** Selector type
+*   `name` **([String][10] | [Array][11])** Selector name
+*   `type` **[String][10]** Selector type
 
 ### Examples
 
@@ -153,7 +154,7 @@ Return escaped selector name
 
 ### Parameters
 
--   `name` **[String][10]** Selector name to escape
+*   `name` **[String][10]** Selector name to escape
 
 Returns **[String][10]** Escaped name
 

docs/api/storage_manager.md

@@ -18,20 +18,20 @@ Once the editor is instantiated you can use its API. Before using these methods
 const storageManager = editor.StorageManager;
 ```
 
--   [getConfig][2]
--   [isAutosave][3]
--   [setAutosave][4]
--   [getStepsBeforeSave][5]
--   [setStepsBeforeSave][6]
--   [setStepsBeforeSave][6]
--   [getStorages][7]
--   [getCurrent][8]
--   [getCurrentStorage][9]
--   [setCurrent][10]
--   [add][11]
--   [get][12]
--   [store][13]
--   [load][14]
+*   [getConfig][2]
+*   [isAutosave][3]
+*   [setAutosave][4]
+*   [getStepsBeforeSave][5]
+*   [setStepsBeforeSave][6]
+*   [setStepsBeforeSave][6]
+*   [getStorages][7]
+*   [getCurrent][8]
+*   [getCurrentStorage][9]
+*   [setCurrent][10]
+*   [add][11]
+*   [get][12]
+*   [store][13]
+*   [load][14]
 
 ## getConfig
 
@@ -51,7 +51,7 @@ Set autosave value
 
 ### Parameters
 
--   `v` **[Boolean][16]** 
+*   `v` **[Boolean][16]** 
 
 Returns **this** 
 
@@ -67,7 +67,7 @@ Set steps required before trigger autosave
 
 ### Parameters
 
--   `v` **[number][17]** 
+*   `v` **[number][17]** 
 
 Returns **this** 
 
@@ -77,10 +77,11 @@ Add new storage
 
 ### Parameters
 
--   `id` **[string][18]** Storage ID
--   `storage` **[Object][15]** Storage wrapper
-    -   `storage.load` **[Function][19]** Load method
-    -   `storage.store` **[Function][19]** Store method
+*   `id` **[string][18]** Storage ID
+*   `storage` **[Object][15]** Storage wrapper
+
+    *   `storage.load` **[Function][19]** Load method
+    *   `storage.store` **[Function][19]** Store method
 
 ### Examples
 
@@ -112,7 +113,7 @@ Returns storage by id
 
 ### Parameters
 
--   `id` **[string][18]** Storage ID
+*   `id` **[string][18]** Storage ID
 
 Returns **([Object][15] | null)** 
 
@@ -134,7 +135,7 @@ Set current storage type
 
 ### Parameters
 
--   `id` **[string][18]** Storage ID
+*   `id` **[string][18]** Storage ID
 
 Returns **this** 
 
@@ -144,8 +145,8 @@ Store key-value resources in the current storage
 
 ### Parameters
 
--   `data` **[Object][15]** Data in key-value format, eg. {item1: value1, item2: value2}
--   `clb` **[Function][19]** Callback function
+*   `data` **[Object][15]** Data in key-value format, eg. {item1: value1, item2: value2}
+*   `clb` **[Function][19]** Callback function
 
 ### Examples
 
@@ -161,8 +162,8 @@ Load resource from the current storage by keys
 
 ### Parameters
 
--   `keys` **([string][18] \| [Array][20]<[string][18]>)** Keys to load
--   `clb` **[Function][19]** Callback function
+*   `keys` **([string][18] | [Array][20]<[string][18]>)** Keys to load
+*   `clb` **[Function][19]** Callback function
 
 ### Examples
 

docs/api/style_manager.md

@@ -19,20 +19,20 @@ Once the editor is instantiated you can use its API. Before using these methods
 const styleManager = editor.StyleManager;
 ```
 
--   [getConfig][2]
--   [addSector][3]
--   [getSector][4]
--   [removeSector][5]
--   [getSectors][6]
--   [addProperty][7]
--   [getProperty][8]
--   [removeProperty][9]
--   [getProperties][10]
--   [getModelToStyle][11]
--   [addType][12]
--   [getType][13]
--   [getTypes][14]
--   [createType][15]
+*   [getConfig][2]
+*   [addSector][3]
+*   [getSector][4]
+*   [removeSector][5]
+*   [getSectors][6]
+*   [addProperty][7]
+*   [getProperty][8]
+*   [removeProperty][9]
+*   [getProperties][10]
+*   [getModelToStyle][11]
+*   [addType][12]
+*   [getType][13]
+*   [getTypes][14]
+*   [createType][15]
 
 ## getConfig
 
@@ -47,13 +47,14 @@ that one will be returned
 
 ### Parameters
 
--   `id` **[string][17]** Sector id
--   `sector` **[Object][16]** Object representing sector
-    -   `sector.name` **[string][17]** Sector's label (optional, default `''`)
-    -   `sector.open` **[Boolean][18]** Indicates if the sector should be opened (optional, default `true`)
-    -   `sector.properties` **[Array][19]<[Object][16]>** Array of properties (optional, default `[]`)
--   `opts`   (optional, default `{}`)
--   `options` **[Object][16]** Options (optional, default `{}`)
+*   `id` **[string][17]** Sector id
+*   `sector` **[Object][16]** Object representing sector
+
+    *   `sector.name` **[string][17]** Sector's label (optional, default `''`)
+    *   `sector.open` **[Boolean][18]** Indicates if the sector should be opened (optional, default `true`)
+    *   `sector.properties` **[Array][19]<[Object][16]>** Array of properties (optional, default `[]`)
+*   `opts`   (optional, default `{}`)
+*   `options` **[Object][16]** Options (optional, default `{}`)
 
 ### Examples
 
@@ -74,8 +75,8 @@ Get sector by id
 
 ### Parameters
 
--   `id` **[string][17]** Sector id
--   `opts`   (optional, default `{}`)
+*   `id` **[string][17]** Sector id
+*   `opts`   (optional, default `{}`)
 
 ### Examples
 
@@ -91,7 +92,7 @@ Remove a sector by id
 
 ### Parameters
 
--   `id` **[string][17]** Sector id
+*   `id` **[string][17]** Sector id
 
 ### Examples
 
@@ -113,25 +114,26 @@ Add property to the sector identified by id
 
 ### Parameters
 
--   `sectorId` **[string][17]** Sector id
--   `property` **[Object][16]** Property object
-    -   `property.name` **[string][17]** Name of the property (optional, default `''`)
-    -   `property.property` **[string][17]** CSS property, eg. `min-height` (optional, default `''`)
-    -   `property.type` **[string][17]** Type of the property: integer | radio | select | color | file | composite | stack (optional, default `''`)
-    -   `property.units` **[Array][19]&lt;[string][17]>** Unit of measure available, eg. ['px','%','em']. Only for integer type (optional, default `[]`)
-    -   `property.unit` **[string][17]** Default selected unit from `units`. Only for integer type (optional, default `''`)
-    -   `property.min` **[number][20]** Min possible value. Only for integer type (optional, default `null`)
-    -   `property.max` **[number][20]** Max possible value. Only for integer type (optional, default `null`)
-    -   `property.defaults` **[string][17]** Default value (optional, default `''`)
-    -   `property.info` **[string][17]** Some description (optional, default `''`)
-    -   `property.icon` **[string][17]** Class name. If exists no text will be displayed (optional, default `''`)
-    -   `property.preview` **[Boolean][18]** Show layers preview. Only for stack type (optional, default `false`)
-    -   `property.functionName` **[string][17]** Indicates if value need to be wrapped in some function, for istance `transform: rotate(90deg)` (optional, default `''`)
-    -   `property.properties` **[Array][19]&lt;[Object][16]>** Nested properties for composite and stack type (optional, default `[]`)
-    -   `property.layers` **[Array][19]&lt;[Object][16]>** Layers for stack properties (optional, default `[]`)
-    -   `property.list` **[Array][19]&lt;[Object][16]>** List of possible options for radio and select types (optional, default `[]`)
--   `opts`   (optional, default `{}`)
--   `options` **[Object][16]** Options (optional, default `{}`)
+*   `sectorId` **[string][17]** Sector id
+*   `property` **[Object][16]** Property object
+
+    *   `property.name` **[string][17]** Name of the property (optional, default `''`)
+    *   `property.property` **[string][17]** CSS property, eg. `min-height` (optional, default `''`)
+    *   `property.type` **[string][17]** Type of the property: integer | radio | select | color | file | composite | stack (optional, default `''`)
+    *   `property.units` **[Array][19]<[string][17]>** Unit of measure available, eg. \['px','%','em']. Only for integer type (optional, default `[]`)
+    *   `property.unit` **[string][17]** Default selected unit from `units`. Only for integer type (optional, default `''`)
+    *   `property.min` **[number][20]** Min possible value. Only for integer type (optional, default `null`)
+    *   `property.max` **[number][20]** Max possible value. Only for integer type (optional, default `null`)
+    *   `property.defaults` **[string][17]** Default value (optional, default `''`)
+    *   `property.info` **[string][17]** Some description (optional, default `''`)
+    *   `property.icon` **[string][17]** Class name. If exists no text will be displayed (optional, default `''`)
+    *   `property.preview` **[Boolean][18]** Show layers preview. Only for stack type (optional, default `false`)
+    *   `property.functionName` **[string][17]** Indicates if value need to be wrapped in some function, for istance `transform: rotate(90deg)` (optional, default `''`)
+    *   `property.properties` **[Array][19]<[Object][16]>** Nested properties for composite and stack type (optional, default `[]`)
+    *   `property.layers` **[Array][19]<[Object][16]>** Layers for stack properties (optional, default `[]`)
+    *   `property.list` **[Array][19]<[Object][16]>** List of possible options for radio and select types (optional, default `[]`)
+*   `opts`   (optional, default `{}`)
+*   `options` **[Object][16]** Options (optional, default `{}`)
 
 ### Examples
 
@@ -160,8 +162,8 @@ Get property by its CSS name and sector id
 
 ### Parameters
 
--   `sectorId` **[string][17]** Sector id
--   `name` **[string][17]** CSS property name (or id), eg. 'min-height'
+*   `sectorId` **[string][17]** Sector id
+*   `name` **[string][17]** CSS property name (or id), eg. 'min-height'
 
 ### Examples
 
@@ -177,8 +179,8 @@ Remove a property from the sector
 
 ### Parameters
 
--   `sectorId` **[string][17]** Sector id
--   `name` **[string][17]** CSS property name, eg. 'min-height'
+*   `sectorId` **[string][17]** Sector id
+*   `name` **[string][17]** CSS property name, eg. 'min-height'
 
 ### Examples
 
@@ -194,7 +196,7 @@ Get properties of the sector
 
 ### Parameters
 
--   `sectorId` **[string][17]** Sector id
+*   `sectorId` **[string][17]** Sector id
 
 ### Examples
 
@@ -213,8 +215,8 @@ one or more classes, the function will return the corresponding CSS Rule
 
 ### Parameters
 
--   `model` **Model** 
--   `options`   (optional, default `{}`)
+*   `model` **Model** 
+*   `options`   (optional, default `{}`)
 
 Returns **Model** 
 
@@ -224,11 +226,11 @@ Add new property type
 
 ### Parameters
 
--   `id` **[string][17]** Type ID
--   `definition` **[Object][16]** Definition of the type. Each definition contains
-                               `model` (business logic), `view` (presentation logic)
-                               and `isType` function which recognize the type of the
-                               passed entity
+*   `id` **[string][17]** Type ID
+*   `definition` **[Object][16]** Definition of the type. Each definition contains
+    `model` (business logic), `view` (presentation logic)
+    and `isType` function which recognize the type of the
+    passed entity
 
 ### Examples
 
@@ -264,7 +266,7 @@ Get type
 
 ### Parameters
 
--   `id` **[string][17]** Type ID
+*   `id` **[string][17]** Type ID
 
 Returns **[Object][16]** Type definition
 
@@ -280,10 +282,11 @@ Create new property from type
 
 ### Parameters
 
--   `id` **[string][17]** Type ID
--   `options` **[Object][16]** Options (optional, default `{}`)
-    -   `options.model` **[Object][16]** Custom model object (optional, default `{}`)
-    -   `options.view` **[Object][16]** Custom view object (optional, default `{}`)
+*   `id` **[string][17]** Type ID
+*   `options` **[Object][16]** Options (optional, default `{}`)
+
+    *   `options.model` **[Object][16]** Custom model object (optional, default `{}`)
+    *   `options.view` **[Object][16]** Custom view object (optional, default `{}`)
 
 ### Examples
 
@@ -305,8 +308,8 @@ It could be a Component, CSSRule, or a string of any CSS selector
 
 ### Parameters
 
--   `target` **(Component | CSSRule | [String][17])** 
--   `opts`  
+*   `target` **(Component | CSSRule | [String][17])** 
+*   `opts`  
 
 Returns **Styleable** A Component or CSSRule
 

docs/api/undo_manager.md

@@ -9,20 +9,20 @@ Once the editor is instantiated you can use its API. Before using these methods
 const um = editor.UndoManager;
 ```
 
--   [getConfig][1]
--   [add][2]
--   [remove][3]
--   [removeAll][4]
--   [start][5]
--   [stop][6]
--   [undo][7]
--   [undoAll][8]
--   [redo][9]
--   [redoAll][10]
--   [hasUndo][11]
--   [hasRedo][12]
--   [getStack][13]
--   [clear][14]
+*   [getConfig][1]
+*   [add][2]
+*   [remove][3]
+*   [removeAll][4]
+*   [start][5]
+*   [stop][6]
+*   [undo][7]
+*   [undoAll][8]
+*   [redo][9]
+*   [redoAll][10]
+*   [hasUndo][11]
+*   [hasRedo][12]
+*   [getStack][13]
+*   [clear][14]
 
 ## getConfig
 
@@ -44,7 +44,7 @@ Note: New Components and CSSRules will be added automatically
 
 ### Parameters
 
--   `entity` **(Model | Collection)** Entity to track
+*   `entity` **(Model | Collection)** Entity to track
 
 ### Examples
 
@@ -60,7 +60,7 @@ Remove and stop tracking the entity (Model/Collection)
 
 ### Parameters
 
--   `entity` **(Model | Collection)** Entity to remove
+*   `entity` **(Model | Collection)** Entity to remove
 
 ### Examples
 
@@ -112,7 +112,7 @@ Undo last change
 
 ### Parameters
 
--   `all`   (optional, default `true`)
+*   `all`   (optional, default `true`)
 
 ### Examples
 
@@ -140,7 +140,7 @@ Redo last change
 
 ### Parameters
 
--   `all`   (optional, default `true`)
+*   `all`   (optional, default `true`)
 
 ### Examples
 
@@ -193,8 +193,8 @@ Note: New Components and CSSRules will be added automatically
 
 ### Parameters
 
--   `obj`  
--   `entity` **(Model | Collection)** Entity to track
+*   `obj`  
+*   `entity` **(Model | Collection)** Entity to track
 
 Returns **[Boolean][16]** 
 
@@ -218,7 +218,7 @@ The difference between `getStack` is when you do multiple operations at a time,
 like appending multiple components:
 `editor.getWrapper().append(`<div>C1</div><div>C2</div>`);`
 `getStack` will return a collection length of 2.
- `getStackGroup` instead will group them as a single operation (the first
+`getStackGroup` instead will group them as a single operation (the first
 inserted component will be returned in the list) by returning an array length of 1.
 
 Returns **[Array][17]** 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "grapesjs",
   "description": "Free and Open Source Web Builder Framework",
-  "version": "0.17.14",
+  "version": "0.17.18",
   "author": "Artur Arseniev",
   "license": "BSD-3-Clause",
   "homepage": "http://grapesjs.com",
@@ -21,7 +21,6 @@
     "cash-dom": "^2.3.9",
     "codemirror": "^5.61.1",
     "codemirror-formatting": "^1.0.0",
-    "eslint": "^7.28.0",
     "keymaster": "^1.6.2",
     "promise-polyfill": "^8.1.3",
     "spectrum-colorpicker": "^1.8.0",
@@ -30,7 +29,8 @@
   "devDependencies": {
     "@babel/cli": "^7.14.5",
     "@vuepress/plugin-google-analytics": "^1.8.2",
-    "documentation": "^8.1.2",
+    "documentation": "^13.2.5",
+    "eslint": "^7.28.0",
     "grapesjs-cli": "^1.0.15",
     "husky": "^2.7.0",
     "jest": "^24.9.0",
@@ -43,6 +43,10 @@
     "vuepress": "^1.8.2",
     "whatwg-fetch": "^3.6.2"
   },
+  "resolutions": {
+    "backbone-undo/backbone": "1.3.3",
+    "backbone-undo/underscore": "^1.13.1"
+  },
   "keywords": [
     "grapes",
     "grapesjs",
@@ -55,21 +59,6 @@
     "builder"
   ],
   "babel": {
-    "presets": [
-      [
-        "@babel/preset-env",
-        {
-          "targets": [
-            "> 1%",
-            "ie 11",
-            "safari 8"
-          ]
-        }
-      ]
-    ],
-    "plugins": [
-      "@babel/plugin-transform-runtime"
-    ],
     "env": {
       "test": {
         "presets": [

src/styles/scss/main.scss

@@ -1,4 +1,5 @@
 /* stylelint-disable */
+@use 'sass:math';
 @import "spectrum-colorpicker/spectrum";
 @import "codemirror/lib/codemirror";
 @import "codemirror/theme/hopscotch";
@@ -351,7 +352,7 @@ $colorsAll: (one, $primaryColor),
 	outline: 3px solid $colorYell;
 	outline-offset: -3px;
 	text-align: center;
-	font-size: $imageCompDim/3;
+	font-size: math.div($imageCompDim, 3);
 	cursor: pointer;
 
   	&.fa-picture-o::after{

test/specs/parser/model/ParserCss.js

@@ -356,18 +356,18 @@ describe('ParserCss', () => {
     expect(obj.parse(str)).toEqual([result]);
   });
 
-  test.skip('Parse CSS with custom async parser', async () => {
-    var str = '.test1 { color:red }';
-    var result = {
-      selectors: ['test1'],
-      style: { color: 'blue' }
-    };
-    obj = new ParserCss({
-      parserCss: async () => [result]
-    });
-    const cssResult = await obj.parse(str);
-    expect(cssResult).toEqual([result]);
-  });
+  // test.skip('Parse CSS with custom async parser', async () => {
+  //   var str = '.test1 { color:red }';
+  //   var result = {
+  //     selectors: ['test1'],
+  //     style: { color: 'blue' }
+  //   };
+  //   obj = new ParserCss({
+  //     parserCss: async () => [result]
+  //   });
+  //   const cssResult = await obj.parse(str);
+  //   expect(cssResult).toEqual([result]);
+  // });
 
   test('Check node with font-face rule', () => {
     const style = {