v0.19.5

Docs

• Added Layers API documentation.
• Added Layers module documentation.

Added

• Added Vietnamese translation @saosangmo #4378
• Added Component.parents() method.

Changed

• Updates/fixes on TS definition (@gubertcalixto #4389)

Fixed

• Lint staged include ts @Singwai #4375
• Handle default svg properly in the component image when reloading from storage @Singwai #4373
• Properly update ItemView on Layer root change #4370
• Take canvas offsets into account when dropping a new block on the canvas (absolute mode) @contentfree #4387
• Fix trait button command #4388
• Protect Selector Manager views from XSS #4411
• Update Resizer pointer events #4401
• Fix video component autoplay from src #462

v0.19.4

⚠️ Breaking changes

• The main breaking change in this release, is the refactoring of the Storage module in order to bring consistency across various storages (custom and built-in).
  We highly recommend checking out the new Storage module documentation which also shows some common use cases and will be helpful in the upgrade process.
  We're also in the process to release new versions for the related plugins: grapesjs-indexeddb, grapesjs-firestore
  Here is an overview of all the breaking changes:
  • editor.store(currentStorageOptions) and editor.load(currentStorageOptions) are now asynchronous methods and returns respectivly the stored and loaded project data (their first argument is not a callback anymore).
  • Storage Manager methods store/load are also asynchronous now and the signature of their arguments is also changed.
  • Storage API for adding custom storages is also changed.
    Before

    editor.StorageManager.add('new-storage-id', {
      load(keys, clb, clbErr) {...},
      store(data, clb, clbErr) {...},
    }

    After

    editor.StorageManager.add('new-storage-id', {
      async load(storageOptions) {...},
      async store(data, storageOptions) {...},
    }

  • Changed StorageManager configuration. Now all storage type options are moved in their correspective config.storageManager.options[STORAGE_TYPE] default configurations.
    storageManager.checkLocal -> storageManager.options.local.checkLocal
storageManager.headers -> storageManager.options.remote.headers
storageManager.urlStore -> storageManager.options.remote.urlStore
storageManager.urlLoad -> storageManager.options.remote.urlLoad
storageManager.contentTypeJson -> storageManager.options.remote.contentTypeJson
storageManager.credentials -> storageManager.options.remote.credentials
storageManager.fetchOptions -> storageManager.options.remote.fetchOptions
  • Removed config.domComponents.storeWrapper options. The project data will always store the wrapper of your pages.
  • Removed following configurations from StorageManager: storeHtml, storeCss, storeComponents, storeStyles, beforeSend, onComplete, params. The project data JSON doesn't extract any HTML/CSS from your pages anymore, but you're still able to extend your storages in order to enrich your data.

Added

• Added drop validity check before pasting @m-jojo-s #4243
• Added config.canvas.frameContent and config.canvas.frameStyle options (frameStyle deprecates config.baseCss).
• Added norwegian (NB) translation @sifferhans #4283
• Added editor.getProjectData(), editor.loadProjectData(json) methods.
• Added config.projectData option.

Changed

• Convert transform to stack property @codingaddicted #4267
• Create by default all canvas iframes in Standard mode.
• Take into account the canvas scroll offset.

Fixed

• Fixed append of blocks on click #4224
• Fixed order change with the drag of multiple components @lexoyo #4220
• Fixed style manager on selectors sync #4239
• Fixed StyleManager with componentFirst option and combined classes #4310
• Avoid errors from Resizer if the component is removed #4333
• Fixed color picker update on the component select change
• Fixed style image preview from parsed CSS #4362

v0.18.4

⚠️ Removed

• Removed config.wrapperIsBody, config.exportWrapper options.
  Now is the wrapper component itself to indicate what tagName to use and how to output the HTML.
  So, if necessary you can extend the default wrapper as any other component and specify your logic.

editor.Components.addType('wrapper', {
 model: {
   defaults: {
     tagName: 'div', // use `div` instead of `body` in HTML export
   },

   // Skip wrapper in the HTML output
   toHTML(opts) {
     return this.getInnerHTML(opts);
   }
 }
})

Added

• Added index.d.ts file. Thanks to @erdomke

Changed

• Update component toolbar icons
• Improve component delete command

Fixed

• Prevent form submit in ClassTagsView #4166
• Fixed editing logic for links #4145
• Fixed RTE icons in Firefox #4176
• Fixed tagName for SVG elements #4188
• Ensure frame existence in SelectComponent #4187
• Prevent divs on RTE paste and plain text #4195
• Fix issues with the state rule. Closes #4208

v0.18.3

Added

• Add new wrap action to default RTE.
• Added isInstanceOf, isChildOf methods to Component.
• Added component:select:before, component:hover:before events.
  These could be used to prevent some components from being selected/hovered.

editor.on('component:select:before component:hover:before', (cmp, opts) => {
  if (['b', 'i', 'u'].indexOf(cmp.get('tagName')) >= 0) {
    opts.abort = true;
  }
});

Changed

• Avoid JS output if component script function is empty #4140

Fixed

• Fixed textable components #2771
• Fixed toolbar position on undo/redo.
• Avoid selected text HTML5 D&D with draggableComponents disabled #4099
• Fixed sector and property visibility update in Style Manager #4116
• Trigger component:mount once the DOM is appended to the parent #4136

v0.18.2 - Security fixes

Added

• Added Component.getInnerHTML method.
• Added withProps and altQuoteAttr options to Component.toHTML method.
• Added onlyMatched option to CSS code generator.
• Added new options to editor.Parser.parseHtml.
• Added config.parser.optionsHtml configuration options.

Changed

• Make the component resize command more extendable #4097
• Deprecated config.allowScripts in favor of config.parser.optionsHtml.allowScripts.
  ⚠️ As before, config.parser.optionsHtml.allowScripts is false by default but now we also remove unsafe attributes from parsed HTML (eg. on* inline event handlers). In case you need to enable unsafe attributes, you can do it via config.parser.optionsHtml.allowUnsafeAttr option.

Fixed

• Fix XSS in ClassTagsView #4076
• Fix external D&D for Image components #4094

v0.18.1

⚠️ BREAKING CHANGE
This release refactors heavily the Style Manager module by removing private methods and events on which some old plugins were relying, like grapesjs-style-gradient, grapesjs-style-filter and grapesjs-style-bg (they won't work properly with this version until their update).
This change was necessary in order to improve the stability of the module and enable higher customizability.
If you have any customization based on GrapesJS Style Manager, please refer to the new API methods/events here: https://grapesjs.com/docs/api/style_manager.html

Docs

• New Style Manager module page
• Moved all available module events to their relative pages.
• Added Property, PropertyNumber, PropertySelect, PropertyComposite, PropertyStack, Layer in API StyleManager Reference.

Added

• Added getDevice, getState, getComponent methods to CssRule.
• Added getTraits/setTraits to Component API.
• Added messagesAdd option in I18n module.
• Now you can get/add/update builtIn properties via Style Manager API.

Changed

• Improve check for layer visibility #4010
• Enable styleManagerConfig.clearProperties by default.
• Adjust draggable Component property to accept function.

Fixed

• Fixed asset upload events #3934
• Fixed the scroll option for the current frame when requested #3938
• Fixed color input trait #3931
• Adjust position in Absolute Mode for children #3770
• Allow for the title of a block to be passed as an attribute #3992
• Disable pointer events from block labels #3986
• Avoid errors on paste in root #4000
• Fixed devices select padding #4026
• Fixed editor.destroy with selected components #2681
• Update Layer name on the component name change.

v0.17.29

• Fixed the build #3902

v0.17.28

Docs

• Added SelectorManager module documentation
• Added Selector API documentation
• Added State API documentation
• Improved SelectorManager API documentation

Added

• Added new methods to SelectorManager API
• Added new methods to Selector API
• Added getChildAt(index) and getLastChild to Component API
• Track component Selectors in UndoManager #3879

Fixed

• Fixed SVG parsing #3866
• Fixed next/prev selection #3861
• Fixed color picker input update with missing hex #3883
• Fixed headless option #3672 (reply in thread)

v0.17.27

Docs

• Updated Blocks module documentation.
• Updated CSSRule model documentation.
• Added Components & CSS section.
• Added Frame model documentation.

Added

• Added getAllWrapper method to Pages API.
• Added remove and addRules methods to CssComposer API.
• Added onReady method to Editor instance.
• Added support for component related styles.
• Added support for custom Block Manager with the new config.blockManager.custom option. More about this here.

Changed

Fixed

• Fixed CssComposer add/get methods
• Fixed default render of modules containing appendTo #3835

v0.17.26

Docs

• Added Modal module documentation.
• Added Asset model documentation.
• Improved Modal API documentation.
• Improved Assets module documentation.

Added

• Support custom Modal with the new config.modal.custom option.
  More about this here.
• Added modal catch-all event to Modal module.
• Support custom AssetManager with the new config.assetManager.custom option.
  More about this here.
• Added open and close methods to AssetManager.
• Added getType and getSrc methods to Asset class.

Fixed

• Fixed rendering issue with custom traits #3735