@@ -31121,6 +31121,8 @@ module.exports = {
31121
31121
"use strict";
31122
31122
31123
31123
31124
+ var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
31125
+
31124
31126
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; /**
31125
31127
* With this module is possible to manage components inside the canvas. You can customize the initial state of the module from the editor initialization, by passing the following [Configuration Object](https://github.com/artf/grapesjs/blob/master/src/dom_components/config/config.js)
31126
31128
* ```js
@@ -31143,6 +31145,9 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
31143
31145
* * [clear](#clear)
31144
31146
* * [load](#load)
31145
31147
* * [store](#store)
31148
+ * * [addType](#addtype)
31149
+ * * [getType](#gettype)
31150
+ * * [getTypes](#gettypes)
31146
31151
* * [render](#render)
31147
31152
*
31148
31153
* @module DomComponents
@@ -31637,27 +31642,60 @@ module.exports = function () {
31637
31642
31638
31643
31639
31644
/**
31640
- * Add new component type
31641
- * @param {string} type
31642
- * @param {Object} methods
31643
- * @private
31645
+ * Add new component type.
31646
+ * Read more about this in [Define New Component](https://grapesjs.com/docs/modules/Components.html#define-new-component)
31647
+ * @param {string} type Component ID
31648
+ * @param {Object} methods Component methods
31649
+ * @return {this}
31644
31650
*/
31645
31651
addType: function addType(type, methods) {
31652
+ var _methods$model = methods.model,
31653
+ model = _methods$model === undefined ? {} : _methods$model,
31654
+ _methods$view = methods.view,
31655
+ view = _methods$view === undefined ? {} : _methods$view,
31656
+ isComponent = methods.isComponent,
31657
+ extend = methods.extend,
31658
+ extendView = methods.extendView;
31659
+
31646
31660
var compType = this.getType(type);
31661
+ var extendType = this.getType(extend);
31662
+ var extendViewType = this.getType(extendView);
31663
+ var typeToExtend = extendType ? extendType : compType ? compType : this.getType('default');
31664
+ var modelToExt = typeToExtend.model;
31665
+ var viewToExt = extendViewType ? extendViewType.view : typeToExtend.view;
31666
+
31667
+ // If the model/view is a simple object I need to extend it
31668
+ if ((typeof model === 'undefined' ? 'undefined' : _typeof(model)) === 'object') {
31669
+ methods.model = modelToExt.extend(_extends({}, model, {
31670
+ defaults: _extends({}, modelToExt.prototype.defaults, model.defaults || {})
31671
+ }), {
31672
+ isComponent: compType && !extendType && !isComponent ? modelToExt.isComponent : isComponent || function () {
31673
+ return 0;
31674
+ }
31675
+ });
31676
+ }
31677
+
31678
+ if ((typeof view === 'undefined' ? 'undefined' : _typeof(view)) === 'object') {
31679
+ methods.view = viewToExt.extend(_extends({}, view));
31680
+ }
31681
+
31647
31682
if (compType) {
31648
31683
compType.model = methods.model;
31649
31684
compType.view = methods.view;
31650
31685
} else {
31651
31686
methods.id = type;
31652
31687
componentTypes.unshift(methods);
31653
31688
}
31689
+
31690
+ return this;
31654
31691
},
31655
31692
31656
31693
31657
31694
/**
31658
- * Get component type
31659
- * @param {string} type
31660
- * @private
31695
+ * Get component type.
31696
+ * Read more about this in [Define New Component](https://grapesjs.com/docs/modules/Components.html#define-new-component)
31697
+ * @param {string} type Component ID
31698
+ * @return {Object} Component type defintion, eg. `{ model: ..., view: ... }`
31661
31699
*/
31662
31700
getType: function getType(type) {
31663
31701
var df = componentTypes;
@@ -31670,6 +31708,15 @@ module.exports = function () {
31670
31708
}
31671
31709
return;
31672
31710
},
31711
+
31712
+
31713
+ /**
31714
+ * Return the array of all types
31715
+ * @return {Array}
31716
+ */
31717
+ getTypes: function getTypes() {
31718
+ return componentTypes;
31719
+ },
31673
31720
selectAdd: function selectAdd(component) {
31674
31721
var _this3 = this;
31675
31722
@@ -31909,7 +31956,7 @@ var Component = Backbone.Model.extend(_Styleable2.default).extend({
31909
31956
this.em = em;
31910
31957
this.config = opt.config || {};
31911
31958
this.ccid = Component.createId(this);
31912
- this.set('attributes', this.get('attributes') || {});
31959
+ this.set('attributes', _extends({}, this.defaults.attributes || {}, this. get('attributes') || {}) );
31913
31960
this.initClasses();
31914
31961
this.initTraits();
31915
31962
this.initComponents();
@@ -31930,8 +31977,11 @@ var Component = Backbone.Model.extend(_Styleable2.default).extend({
31930
31977
return _this.emitUpdate.apply(_this, [name].concat(args));
31931
31978
});
31932
31979
});
31933
- this.init();
31934
- em && em.trigger('component:create', this);
31980
+
31981
+ if (!opt.temporary) {
31982
+ this.init();
31983
+ em && em.trigger('component:create', this);
31984
+ }
31935
31985
},
31936
31986
31937
31987
@@ -32514,7 +32564,9 @@ var Component = Backbone.Model.extend(_Styleable2.default).extend({
32514
32564
}
32515
32565
32516
32566
var cloned = new this.constructor(attr, opts);
32517
- em && em.trigger('component:clone', cloned);
32567
+ var event = 'component:clone';
32568
+ em && em.trigger(event, cloned);
32569
+ this.trigger(event, cloned);
32518
32570
32519
32571
return cloned;
32520
32572
},
@@ -32761,7 +32813,7 @@ var Component = Backbone.Model.extend(_Styleable2.default).extend({
32761
32813
args[_key3 - 1] = arguments[_key3];
32762
32814
}
32763
32815
32764
- this.updated.apply(this, [property, property && this.get(property), property && this.previous(property)].concat(_toConsumableArray(args)));
32816
+ property && this.updated.apply(this, [property, property && this.get(property), property && this.previous(property)].concat(_toConsumableArray(args)));
32765
32817
this.trigger.apply(this, [event].concat(_toConsumableArray(args)));
32766
32818
em && em.trigger.apply(em, [event, this].concat(_toConsumableArray(args)));
32767
32819
},
@@ -34253,7 +34305,6 @@ module.exports = __webpack_require__(/*! ./ComponentLinkView */ "./src/dom_compo
34253
34305
"use strict";
34254
34306
34255
34307
34256
- var Backbone = __webpack_require__(/*! backbone */ "./node_modules/backbone/backbone.js");
34257
34308
var ComponentView = __webpack_require__(/*! ./ComponentTextView */ "./src/dom_components/view/ComponentTextView.js");
34258
34309
34259
34310
module.exports = ComponentView.extend({
@@ -34852,7 +34903,9 @@ module.exports = _backbone2.default.View.extend({
34852
34903
var model = this.model;
34853
34904
var config = opt.config || {};
34854
34905
var em = config.em;
34906
+ var modelOpt = model.opt || {};
34855
34907
this.opts = opt;
34908
+ this.modelOpt = modelOpt;
34856
34909
this.config = config;
34857
34910
this.em = em || '';
34858
34911
this.pfx = config.stylePrefix || '';
@@ -34873,7 +34926,7 @@ module.exports = _backbone2.default.View.extend({
34873
34926
model.view = this;
34874
34927
this.initClasses();
34875
34928
this.initComponents({ avoidRender: 1 });
34876
- this.init();
34929
+ !modelOpt.temporary && this.init();
34877
34930
},
34878
34931
34879
34932
@@ -35080,14 +35133,32 @@ module.exports = _backbone2.default.View.extend({
35080
35133
* @private
35081
35134
* */
35082
35135
updateAttributes: function updateAttributes() {
35083
- var model = this.model;
35136
+ var attrs = [];
35137
+ var model = this.model,
35138
+ $el = this.$el,
35139
+ el = this.el;
35140
+
35084
35141
var defaultAttr = { 'data-gjs-type': model.get('type') || 'default' };
35085
35142
35086
35143
if (model.get('highlightable')) {
35087
35144
defaultAttr['data-highlightable'] = 1;
35088
35145
}
35089
35146
35090
- this.$el.attr(_extends({}, defaultAttr, model.getAttributes()));
35147
+ // Remove all current attributes
35148
+ (0, _underscore.each)(el.attributes, function (attr) {
35149
+ return attrs.push(attr.nodeName);
35150
+ });
35151
+ attrs.forEach(function (attr) {
35152
+ return $el.removeAttr(attr);
35153
+ });
35154
+ var attr = _extends({}, defaultAttr, model.getAttributes());
35155
+
35156
+ // Remove all `false` attributes
35157
+ (0, _underscore.keys)(attr).forEach(function (key) {
35158
+ return attr[key] === false && delete attr[key];
35159
+ });
35160
+
35161
+ $el.attr(attr);
35091
35162
this.updateStyle();
35092
35163
},
35093
35164
@@ -35200,10 +35271,14 @@ module.exports = _backbone2.default.View.extend({
35200
35271
},
35201
35272
postRender: function postRender() {
35202
35273
var em = this.em,
35203
- model = this.model;
35274
+ model = this.model,
35275
+ modelOpt = this.modelOpt;
35204
35276
35205
- this.onRender();
35206
- em && em.trigger('component:mount', model);
35277
+
35278
+ if (!modelOpt.temporary) {
35279
+ this.onRender();
35280
+ em && em.trigger('component:mount', model);
35281
+ }
35207
35282
},
35208
35283
onRender: function onRender() {}
35209
35284
});
@@ -35240,15 +35315,16 @@ module.exports = _backbone2.default.View.extend({
35240
35315
removeChildren: function removeChildren(removed) {
35241
35316
var em = this.config.em;
35242
35317
var view = removed.view;
35318
+ var temp = removed.opt.temporary;
35243
35319
if (!view) return;
35244
35320
view.remove.apply(view);
35245
35321
var children = view.childrenView;
35246
35322
children && children.stopListening();
35247
35323
removed.components().forEach(this.removeChildren.bind(this));
35248
- removed.removed();
35324
+ !temp && removed.removed();
35249
35325
if (em) {
35250
35326
removed.get('style-signature') && em.get('Commands').run('core:component-style-clear', { target: removed });
35251
- em.trigger('component:remove', removed);
35327
+ !temp && em.trigger('component:remove', removed);
35252
35328
}
35253
35329
},
35254
35330
@@ -38247,7 +38323,7 @@ module.exports = function () {
38247
38323
plugins: plugins,
38248
38324
38249
38325
// Will be replaced on build
38250
- version: '0.14.49 ',
38326
+ version: '0.14.50 ',
38251
38327
38252
38328
/**
38253
38329
* Initialize the editor with passed options
@@ -40799,6 +40875,7 @@ module.exports = function () {
40799
40875
conf.Parser = this;
40800
40876
pHtml = new parserHtml(conf);
40801
40877
pCss = new parserCss(conf);
40878
+ this.em = conf.em;
40802
40879
return this;
40803
40880
},
40804
40881
@@ -40809,7 +40886,10 @@ module.exports = function () {
40809
40886
* @return {Object}
40810
40887
*/
40811
40888
parseHtml: function parseHtml(str) {
40812
- pHtml.compTypes = this.compTypes;
40889
+ var em = this.em,
40890
+ compTypes = this.compTypes;
40891
+
40892
+ pHtml.compTypes = em ? em.get('DomComponents').getTypes() : compTypes;
40813
40893
return pHtml.parse(str, pCss);
40814
40894
},
40815
40895
@@ -41164,6 +41244,8 @@ module.exports = function () {
41164
41244
"use strict";
41165
41245
41166
41246
41247
+ var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
41248
+
41167
41249
module.exports = function (config) {
41168
41250
var TEXT_NODE = 'span';
41169
41251
var c = config;
@@ -41245,8 +41327,15 @@ module.exports = function (config) {
41245
41327
// Iterate over all available Component Types and
41246
41328
// the first with a valid result will be that component
41247
41329
for (var it = 0; it < ct.length; it++) {
41248
- obj = ct[it].model.isComponent(node);
41249
- if (obj) break;
41330
+ var compType = ct[it];
41331
+ obj = compType.model.isComponent(node);
41332
+
41333
+ if (obj) {
41334
+ if ((typeof obj === 'undefined' ? 'undefined' : _typeof(obj)) !== 'object') {
41335
+ obj = { type: compType.id };
41336
+ }
41337
+ break;
41338
+ }
41250
41339
}
41251
41340
41252
41341
model = obj;
0 commit comments