Merge branch 'dev' into up-storage-manager

CONTRIBUTING.md

@@ -18,7 +18,7 @@ Working on your first Pull Request? You can learn how from this **free** series,
 
 ## Submitting code
 
-Any code change should be submitted as a pull request. Before start working on something make always a search in opened issues and pull requests, this might help you to avoid waisting time.
+Any code change should be submitted as a pull request. Before start working on something make always a search in opened issues and pull requests, this might help you to avoid wasting time.
 
 A pull request could be a bug fix, new feature and much more, but in all cases, **open a new issue** and talk about what you want to do. Often happens to work on something already fixed (ready to release) or in progress.
 

src/commands/view/ComponentDelete.js

@@ -1,27 +1,23 @@
 import { isArray } from 'underscore';
 
 export default {
-  run(ed, sender, opts = {}) {
+  run(ed, s, opts = {}) {
     const toSelect = [];
     let components = opts.component || ed.getSelectedAll();
     components = isArray(components) ? [...components] : [components];
 
-    // It's important to deselect components first otherwise,
+    components.filter(Boolean).forEach(component => {
-    // with undo, the component will be set with the wrong `collection`
+      if (!component.get('removable')) {
-    ed.select(null);
+        toSelect.push(component);
-
-    components.forEach(component => {
-      if (!component || !component.get('removable')) {
         return this.em.logWarning('The element is not removable', {
-          component
+          component,
         });
       }
       component.remove();
-      component.collection && toSelect.push(component);
     });
 
-    toSelect.length && ed.select(toSelect);
+    ed.select(toSelect);
 
     return components;
-  }
+  },
 };

src/dom_components/model/Component.js

@@ -1064,36 +1064,29 @@ export default class Component extends Model.extend(Styleable) {
     const model = this;
     const ppfx = (em && em.getConfig('stylePrefix')) || '';
 
-    if (!model.get('toolbar')) {
+    if (!model.get('toolbar') && em) {
-      var tb = [];
+      const tb = [];
-      if (model.collection) {
+      model.collection &&
         tb.push({
-          attributes: { class: 'fa fa-arrow-up' },
+          label: em.getIcon('arrowUp'),
           command: ed => ed.runCommand('core:component-exit', { force: 1 }),
         });
-      }
+      model.get('draggable') &&
-      if (model.get('draggable')) {
         tb.push({
-          attributes: {
+          attributes: { class: `${ppfx}no-touch-actions`, draggable: true },
-            class: `fa fa-arrows ${ppfx}no-touch-actions`,
+          label: em.getIcon('move'),
-            draggable: true,
-          },
-          //events: hasDnd(this.em) ? { dragstart: 'execCommand' } : '',
           command: 'tlb-move',
         });
-      }
+      model.get('copyable') &&
-      if (model.get('copyable')) {
         tb.push({
-          attributes: { class: 'fa fa-clone' },
+          label: em.getIcon('copy'),
           command: 'tlb-clone',
         });
-      }
+      model.get('removable') &&
-      if (model.get('removable')) {
         tb.push({
-          attributes: { class: 'fa fa-trash-o' },
+          label: em.getIcon('delete'),
           command: 'tlb-delete',
         });
-      }
       model.set('toolbar', tb);
     }
   }

src/editor/config/config.js

@@ -167,6 +167,11 @@ export default {
     move: '<svg viewBox="0 0 24 24"><path fill="currentColor" d="M13,6V11H18V7.75L22.25,12L18,16.25V13H13V18H16.25L12,22.25L7.75,18H11V13H6V16.25L1.75,12L6,7.75V11H11V6H7.75L12,1.75L16.25,6H13Z"/></svg>',
     plus: '<svg viewBox="0 0 24 24"><path fill="currentColor" d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z" /></svg>',
     caret: '<svg viewBox="0 0 24 24"><path fill="currentColor" d="M7,10L12,15L17,10H7Z" /></svg>',
+    delete:
+      '<svg viewBox="0 0 24 24"><path fill="currentColor" d="M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z" /></svg>',
+    copy: '<svg viewBox="0 0 24 24"><path fill="currentColor" d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z" /></svg>',
+    arrowUp:
+      '<svg viewBox="0 0 24 24"><path fill="currentColor" d="M13,20H11V8L5.5,13.5L4.08,12.08L12,4.16L19.92,12.08L18.5,13.5L13,8V20Z" /></svg>',
   },
 
   // Dom element

src/editor/model/Editor.js

@@ -756,6 +756,11 @@ export default class EditorModel extends Model {
     return (this.getCurrentFrame() || {}).model;
   }
 
+  getIcon(icon) {
+    const icons = this.getConfig('icons') || {};
+    return icons[icon] || '';
+  }
+
   /**
    * Return the count of changes made to the content and not yet stored.
    * This count resets at any `store()`

src/selector_manager/view/ClassTagsView.js

@@ -154,8 +154,12 @@ export default Backbone.View.extend({
    * @private
    */
   onInputKeyUp(e) {
-    if (e.keyCode === 13) this.addNewTag(this.$input.val());
+    if (e.keyCode === 13) {
-    else if (e.keyCode === 27) this.endNewTag();
+      e.preventDefault();
+      this.addNewTag(this.$input.val());
+    } else if (e.keyCode === 27) {
+      this.endNewTag();
+    }
   },
 
   checkStates() {

src/styles/scss/_gjs_canvas.scss

@@ -304,11 +304,9 @@ $guide_pad: 5px !default;
 }
 
 .#{$app-prefix}toolbar-item {
-  padding: 5px 7px;
-  font-size: 0.8rem;
-  cursor: pointer;
   width: 26px;
-  vertical-align: middle;
+  padding: 5px;
+  cursor: pointer;
   display: inline-block;
 
   svg {

src/styles/scss/_gjs_rte.scss

@@ -17,7 +17,7 @@
     align-items: center;
     justify-content: center;
     padding: 5px;
-    min-width: 25px;
+    width: 25px;
     border-right: 1px solid $mainDkColor;
     text-align: center;
     cursor: pointer;

yarn.lock

@@ -9871,8 +9871,8 @@ pretty-time@^1.1.0:
   resolved "https://registry.yarnpkg.com/pretty-time/-/pretty-time-1.1.0.tgz#ffb7429afabb8535c346a34e41873adf3d74dd0e"
 
 prismjs@^1.13.0:
-  version "1.25.0"
+  version "1.27.0"
-  resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.25.0.tgz#6f822df1bdad965734b310b315a23315cf999756"
+  resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.27.0.tgz#bb6ee3138a0b438a3653dd4d6ce0cc6510a45057"
 
 process-nextick-args@^2.0.0, process-nextick-args@~2.0.0:
   version "2.0.1"
@@ -12168,8 +12168,8 @@ url-parse-lax@^3.0.0:
     prepend-http "^2.0.0"
 
 url-parse@^1.4.3, url-parse@^1.5.1:
-  version "1.5.7"
+  version "1.5.10"
-  resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.5.7.tgz#00780f60dbdae90181f51ed85fb24109422c932a"
+  resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.5.10.tgz#9d3c2f736c1d75dd3bd2be507dcc111f1e2ea9c1"
   dependencies:
     querystringify "^2.1.1"
     requires-port "^1.0.0"