v0.14.21

Changed

• Listen for content changes inside ComponentView
• Enabled block:drag:* events when HTML5 Drag&Drop is used

Added

• Added setOptions, addOption and getOptions to select property in Style Manager #1215
• Added the possibility to output custom attributes in toHTML method
• Added the possibility to avoid clearing styles in CSS export
• Added stopPropagation in ComponentTextView on dblclick event
• Added activate and select options to Block models
• Added onAll method to Component model. Executes a callback on any inner component
• Added resetId method on Component and resetId propperty on Block model
  This allows to reset id of the component and its binded css rules.
  This comes handy when you use ids inside you blocks

  <div id="some-id"></div>
  <style>
    #some-id {
      ...
    }
  </style>

  Technically speaking, Blocks are reusable and IDs are not, so this will cause a problem.
  So with this new option, IDs will be changed automatically inside all dropped components

  blockManager.add('some-block', {
    resetId: true,
    content: `<div>...`
  })

Fixed

• Trigger end move for all dropped models. Closes #1196
• Don't trigger component:remove when a component is just deselected. Fixes #1219

v0.14.20

This release mainly brings 2 new features:

• Multiple Component Selection
  

  This is the first version of this feature and allows the user, at first, organize faster the structure of the template.
  The feature is enabled by default but you can disable it by passing multipleSelection: false to GrapesJS init function. To start multiple selection just press CTRL (⌘ for Mac users) and click on any additional component. When multiple components are selected you can't style them (at least, not yet) but you can move, copy and delete them. You can also select a range of multiple components of the same collection/list by pressing ⇧ Shift and clicking on start and end component.

• Dynamic Layers Root
  With Dynamic Layers Root you can change the default wrapper/body root with any other component inside your template.
  On initialization:

  const editor = grapesjs.init({
    container: '#gjs',
    layerManager: {
      root: '#my-root',
      showWrapper: false,
    },
    // ...
  })

  or via API

  editor.LayerManager.setRoot('#other-root');
  // or via Component
  editor.LayerManager.setRoot(editor.getSelected());

Changed

• Don't remove classes starting with {PREFIX}-

Added

• Added destroy() method
• Added setRoot, getRoot methods in Layers, for Dynamic Layers Root
• Added root option to config.LayerManager
• Added multipleSelection option
• Added selectAdd, selectRemove, selectToggle methods in Editor, for Multiple Component Selection feature
• Added new commands and their relative keymaps for easy navigation through the structure
  • core:component-prev (w)
  • core:component-next (s)
  • core:component-enter (d)
  • core:component-exit (a)

Fixed

• Parse important declarations in style properties #1179

Removed

• Replaced change:selectedComponent events with component:toggled

v0.14.17

Changed

• Improved toJSON method of CSSRule
• Try to find a closest model when an element, without it, is selected

Added

• Highlight components in canvas when hovered in Layers #423
• Added scrollTo method to the Canvas module
• Added scrollCanvas, scrollLayers and highlightHover options to Layers module
• Add component's type to its view via data-gjs-type attribute
• Added jest for tests

Fixed

• Trigger change for empty value in traits #270
• Fixed <label> with for attributes #316
• Fixed issues with color traits #1104
• Added remove listener on Panel items #1081
• Update toolbars position when text components are updated #1136
• Fix duplicated edit buttons on component cloning #1129

0.14.15

This version brings up few updates over the Storage module

Changed

• Improve storage:error event

Added

• Added getDirtyCount method to the Editor API
• Add 2 more store events: storage:error:load, storage:error:store
• Add replaceWith method to Component

v0.14.10

Changed

• OpenAssets now accepts types and accept options #1028
• Updated what is passed to component:selected event (model and options)

Added

• Added keepUnusedStyles option for preservation of unused styles #1053
• Improved styleable:* events #1041
• Added component:deselected event

Fixed

• Return the result from runCommand and stopCommand #1051
• Update store after changes to css #1049
• Refocus on resizable components #976
• Make the UndoManager listen for rules changes

Removed

• Removed deprecated select-comp and deselect-comp events

v0.14.9

Changed

• Avoid adding CssRules with empty style object

Added

• Added new commands lifecycle events, run:{commandName}:before, stop:{commandName}:before, abort:{commandName} #915
• Added core:component-delete command
• Added storage:start:store, storage:start:load, storage:end:store, storage:end:load events
• Added avoidDefaults option (smaller JSON objects in export)
• Added keepEmptyTextNodes option #1023
• Added label property to buttons #1031
• Listen and render traits change on components

Fixed

• Fix some issues with IE11 #768
• Check if the event exists in move command #710
• Fixed youtube loop parameter in Video Component #969
• Don't stringify scripts function in toJSON method #980
• Fixes to make the editor work in IE11 #768
• Fixed media queries ordering bug #896
• Allow multiple at-rules in the CSS #1032
• Support percentage based media-widths #1037

Removed

• Removed controls option for Vimeo videos #977

v0.14.6

Changed

• Don't trigger component:add when components are just moved #868

Added

• Hide very large labels in blocks
• Show a message in trait manager panel when there is no component selected #869

Fixed

• Init correctly components with javascript #873
• Fix errors when the editor is reinitialized #914
• Escape string in HTML attributes #912
• Manage correctly boolean attributes in HTML output #943
• Prevent the editor from being injected twice during development #928
• Fixed the import of components and styles with the same ids #932

Removed

• Removed add:component event

v0.14.5

Changed

• ⚠️ POSSIBLY BREAKING CHANGE ⚠️ Panel ids are moved to classes
  So if you've used selectors like #gjs-pn-* (in CSS/JS) you should change them to .gjs-pn-*
• Append the Modal inside the container element

Added

• Added remove listener to buttons in panels. Closes #824
• Added the possibility to render panels outside of the main editor container, eg.

  editor.Panels.addPanel({
    id: 'myNewPanel',
    el: 'query-selector', // or HTMLELement
  })

• Added the possibility to render Layers, Block, Styles, Selectors and Traits
  outside of the main editor container (via appendTo option), eg.

  grapesjs.init({
    ...
    layerManager: {
      appendTo: 'query-or-element',
      ...
    },
    blockManager: {
      appendTo: 'query-or-element',
      ...
    },
    styleManager: {
      appendTo: 'query-or-element',
      ...
    },
    selectorManager: {
      appendTo: 'query-or-element',
      ...
    },
    traitManager: {
      appendTo: 'query-or-element',
      ...
    }
  });

  Live demo with a totally custom UI
  https://codepen.io/artf/full/MQpZPj/
  

Fixed

• Fixed toolbar position on window resize #810
• Extend correctly Layers options #812
• Parse correctly the integer value with a function #806
• Execute the callback in StorageManager even with an empty storage

0.13.8

Added

• Experimental clearStyles option. Helps removing unused styles
• Added atRuleType property to CSSRule
• Added support for @keyframes and @font-face at-rules #276
• Added closest method in Component
• Added addAttributes method in Component
• Added onRender in ComponentView

Changed

• Update getModelToStyle method and make it the single source of truth for styling
• Update default add and remove listeners in UndoManager

Fixed

• Avoid response errors on store #759
• Pass correctly the component's model on component:update:* events
• Fix the update of the Style Manager with changed state
• Fix toLoad property in Editor (for multiple editor use) #773
• Fix assets preview when filepath has spaces #775
• Extend unbind method to accept object arguments #779
• Clear the canvas offset on resize #699
• Added dragContent in getContentByData of Droppable #792

v0.13.5

Updated

• Update how attributes are exported inside toJSON in Components
• Create randomized ids for Components
• Removed the src attribute from the canvas's iframe

Added

• Added overflow-x: hidden to the wrapper
• Added component:clone event #739
• Added component:remove event #748
• Added prettier with a precommit hook
• Added the possibility to order Block's categories #742
• Added native HTML5 Drag and Drop support, disableable by nativeDnd option (true by default)
  If you use block:drag:* events with this module enabled, you have to switch to these new one
• Added getEl in Component
• Added async loading of images in ComponentImageView with a new file property

Fixed

• Fixed bug with color traits #731
• Fixed bug of the toolbar with small components #752
• Prevent issues with devices with the same width #727