@syncfusion/ej2-vue-base 25.2.4 → 26.1.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.eslintrc.json +261 -0
- package/dist/ej2-vue-base.umd.min.js +2 -2
- package/dist/ej2-vue-base.umd.min.js.map +1 -1
- package/dist/es6/ej2-vue-base.es2015.js +214 -144
- package/dist/es6/ej2-vue-base.es2015.js.map +1 -1
- package/dist/es6/ej2-vue-base.es5.js +149 -79
- package/dist/es6/ej2-vue-base.es5.js.map +1 -1
- package/dist/global/ej2-vue-base.min.js +2 -2
- package/dist/global/ej2-vue-base.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +26 -9
- package/src/component-base.d.ts +12 -4
- package/src/component-base.js +73 -48
- package/src/template.d.ts +7 -0
- package/src/template.js +81 -26
- package/tslint.json +111 -0
- package/CHANGELOG.md +0 -354
|
@@ -1,8 +1,12 @@
|
|
|
1
1
|
import * as Vue from 'vue';
|
|
2
|
-
import {
|
|
2
|
+
import { getValue, isNullOrUndefined, extend, setProxyToRaw, getTemplateEngine, getUniqueID, createElement, detach, setTemplateEngine } from '@syncfusion/ej2-base';
|
|
3
3
|
|
|
4
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
4
5
|
/**
|
|
5
|
-
* Vue
|
|
6
|
+
* Clone the Vue compiler instance.
|
|
7
|
+
*
|
|
8
|
+
* @param {any} obj - representes the Vue compiler.
|
|
9
|
+
* @returns {any} cloned object of Vue compiler.
|
|
6
10
|
*/
|
|
7
11
|
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) {
|
|
8
12
|
return obj;
|
|
@@ -11,15 +15,16 @@ else {
|
|
|
11
15
|
var newObj = {};
|
|
12
16
|
if (obj != null) {
|
|
13
17
|
for (var key in obj) {
|
|
14
|
-
if (Object.prototype.hasOwnProperty.call(obj, key))
|
|
18
|
+
if (Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
15
19
|
newObj["" + key] = obj["" + key];
|
|
20
|
+
}
|
|
16
21
|
}
|
|
17
22
|
}
|
|
18
23
|
newObj.default = obj;
|
|
19
24
|
return newObj;
|
|
20
25
|
} }
|
|
21
26
|
var curVue = _interopRequireWildcard(Vue);
|
|
22
|
-
var isExecute = (parseInt(curVue['version']) > 2) ? false : true;
|
|
27
|
+
var isExecute = (parseInt(curVue['version'], 10) > 2) ? false : true;
|
|
23
28
|
var aVue = !isExecute ? curVue : (curVue['default']['default'] ? curVue['default']['default'] : curVue['default']);
|
|
24
29
|
var gh = curVue['h'];
|
|
25
30
|
var vueDefineComponent = function (options) { return !isExecute ? aVue['defineComponent'](options) : aVue['extend'](options); };
|
|
@@ -80,10 +85,13 @@ var ComponentBase = vueDefineComponent({
|
|
|
80
85
|
}
|
|
81
86
|
},
|
|
82
87
|
mounted: function () {
|
|
83
|
-
var cusEle = this.$el ? this.$el.querySelectorAll(
|
|
88
|
+
var cusEle = this.$el ? this.$el.querySelectorAll('div.e-directive') : null;
|
|
84
89
|
if (!isExecute && cusEle) {
|
|
85
90
|
for (var i = 0; i < cusEle.length; i++) {
|
|
86
|
-
|
|
91
|
+
var cusElement = cusEle[parseInt(i.toString(), 10)];
|
|
92
|
+
if (cusElement.parentElement) {
|
|
93
|
+
cusElement.parentElement.removeChild(cusElement);
|
|
94
|
+
}
|
|
87
95
|
}
|
|
88
96
|
}
|
|
89
97
|
this.ej2Instances.isVue = true;
|
|
@@ -145,12 +153,11 @@ var ComponentBase = vueDefineComponent({
|
|
|
145
153
|
provide = getValue('$.parent.provides', this);
|
|
146
154
|
}
|
|
147
155
|
if (provide) {
|
|
148
|
-
// tslint:disable:no-any
|
|
149
156
|
var injectables = provide;
|
|
150
157
|
if (typeof provide === 'function') {
|
|
151
158
|
if (provide.managed) {
|
|
152
|
-
var
|
|
153
|
-
var
|
|
159
|
+
var pKey = provide.managed;
|
|
160
|
+
var pValue = Object.keys(pKey);
|
|
154
161
|
var key = void 0;
|
|
155
162
|
if (this.$root && this.isDecorator) {
|
|
156
163
|
key = Object.keys(this.$root);
|
|
@@ -161,24 +168,23 @@ var ComponentBase = vueDefineComponent({
|
|
|
161
168
|
else if (this.$parent) {
|
|
162
169
|
key = Object.keys(this.$parent);
|
|
163
170
|
}
|
|
164
|
-
for (var i = 0; i <
|
|
171
|
+
for (var i = 0; i < pValue.length; i++) {
|
|
165
172
|
for (var j = 0; j < key.length; j++) {
|
|
166
|
-
if ((key[parseInt(j.toString(), 10)].indexOf(
|
|
173
|
+
if ((key[parseInt(j.toString(), 10)].indexOf(pValue[parseInt(i.toString(), 10)])) !== -1) {
|
|
167
174
|
if (this.$root && this.isDecorator) {
|
|
168
|
-
|
|
175
|
+
pKey[pValue[parseInt(j.toString(), 10)]] = this.$root[key[parseInt(i.toString(), 10)]];
|
|
169
176
|
}
|
|
170
177
|
else if (this.$vnode) {
|
|
171
|
-
|
|
178
|
+
pKey[pValue[parseInt(i.toString(), 10)]] = this.$vnode.context[key[parseInt(j.toString(), 10)]];
|
|
172
179
|
}
|
|
173
180
|
else if (this.$parent) {
|
|
174
|
-
|
|
181
|
+
pKey[pValue[parseInt(i.toString(), 10)]] = this.$parent[key[parseInt(j.toString(), 10)]];
|
|
175
182
|
}
|
|
176
|
-
injectables =
|
|
183
|
+
injectables = pKey;
|
|
177
184
|
}
|
|
178
185
|
}
|
|
179
186
|
}
|
|
180
187
|
}
|
|
181
|
-
// tslint:disable:no-any
|
|
182
188
|
else if (this.$vnode) {
|
|
183
189
|
injectables = this.$vnode.context.$options.provide();
|
|
184
190
|
}
|
|
@@ -192,11 +198,9 @@ var ComponentBase = vueDefineComponent({
|
|
|
192
198
|
return ret;
|
|
193
199
|
},
|
|
194
200
|
destroyComponent: function () {
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
tempBeforeDestroyThis.destroyPortals();
|
|
199
|
-
tempBeforeDestroyThis = null;
|
|
201
|
+
this.ej2Instances.destroy();
|
|
202
|
+
this.$el.style.visibility = 'hidden';
|
|
203
|
+
this.destroyPortals();
|
|
200
204
|
},
|
|
201
205
|
destroyPortals: function () {
|
|
202
206
|
if (this.portals) {
|
|
@@ -261,21 +265,21 @@ var ComponentBase = vueDefineComponent({
|
|
|
261
265
|
for (var i = 0; i < propRef.length; i++) {
|
|
262
266
|
if (propRef[parseInt(i.toString(), 10)].type.methods || propRef[parseInt(i.toString(), 10)].type === 'e-seriescollection') {
|
|
263
267
|
var key = propRef[parseInt(i.toString(), 10)].type === 'e-seriescollection' ? 'series-collection' :
|
|
264
|
-
propRef[parseInt(i.toString(), 10)].type.methods.getTag().replace(
|
|
268
|
+
propRef[parseInt(i.toString(), 10)].type.methods.getTag().replace('e-', '');
|
|
265
269
|
var ref = this.resolveArrayDirectives(propRef[parseInt(i.toString(), 10)].children, key);
|
|
266
|
-
var
|
|
270
|
+
var spKeys = key.split('-');
|
|
267
271
|
var controlName = this.ej2Instances.getModuleName().toLowerCase();
|
|
268
|
-
var keyRef = (
|
|
272
|
+
var keyRef = (spKeys.length > 1 && controlName.indexOf(spKeys[0]) > -1) ? spKeys[1] : spKeys[0];
|
|
269
273
|
keyRef = keyRef.replace(controlName, '');
|
|
270
274
|
keyRef = this.tagNameMapper['e-' + key] ? this.tagNameMapper['e-' + key].replace('e-', '') : keyRef;
|
|
271
|
-
if (controlName
|
|
272
|
-
keyRef =
|
|
275
|
+
if (controlName === 'splitter' && keyRef === 'panes') {
|
|
276
|
+
keyRef = 'paneSettings';
|
|
273
277
|
}
|
|
274
|
-
else if (controlName
|
|
275
|
-
keyRef =
|
|
278
|
+
else if (controlName === 'bulletchart' && keyRef === 'range') {
|
|
279
|
+
keyRef = 'ranges';
|
|
276
280
|
}
|
|
277
|
-
else if (controlName
|
|
278
|
-
keyRef =
|
|
281
|
+
else if (controlName === 'schedule' && keyRef === 'header') {
|
|
282
|
+
keyRef = 'headerRows';
|
|
279
283
|
}
|
|
280
284
|
dirProps["" + keyRef] = ref["" + key];
|
|
281
285
|
}
|
|
@@ -305,7 +309,7 @@ var ComponentBase = vueDefineComponent({
|
|
|
305
309
|
var tagRef = childSlot.type.methods ? childSlot.type.methods.getTag() : tagName;
|
|
306
310
|
if (childSlot.children) {
|
|
307
311
|
var key = void 0;
|
|
308
|
-
innerDirValues = this_2.resolveComplexDirs(childSlot.children, this_2.tagMapper[
|
|
312
|
+
innerDirValues = this_2.resolveComplexDirs(childSlot.children, this_2.tagMapper['e-' + tagName], tagRef);
|
|
309
313
|
if (innerDirValues.length) {
|
|
310
314
|
tempObj = innerDirValues;
|
|
311
315
|
}
|
|
@@ -325,7 +329,12 @@ var ComponentBase = vueDefineComponent({
|
|
|
325
329
|
});
|
|
326
330
|
}
|
|
327
331
|
if (((/[s]\b/).test(tagRef) && innerDirValues) && (!(/[s]\b/).test(tagName) || innerDirValues.length)) {
|
|
328
|
-
Array.isArray(tempObj)
|
|
332
|
+
if (Array.isArray(tempObj)) {
|
|
333
|
+
tempObj.forEach(function (item) { items["" + tagName].push(item); });
|
|
334
|
+
}
|
|
335
|
+
else {
|
|
336
|
+
items["" + tagName].push(tempObj);
|
|
337
|
+
}
|
|
329
338
|
}
|
|
330
339
|
else if (tempObj && Object.keys(tempObj).length !== 0) {
|
|
331
340
|
items["" + tagName].push(tempObj);
|
|
@@ -350,12 +359,11 @@ var ComponentBase = vueDefineComponent({
|
|
|
350
359
|
tagRef = Object.keys(tagObject["" + tagName]);
|
|
351
360
|
tag = tagRef.find(function (key) {
|
|
352
361
|
return tagObject["" + tagName]["" + key] ===
|
|
353
|
-
childSlot.type.methods.getTag().replace(/[s]\b/,
|
|
362
|
+
childSlot.type.methods.getTag().replace(/[s]\b/, '');
|
|
354
363
|
});
|
|
355
|
-
var moduleName = this_3.ej2Instances.getModuleName().toLowerCase();
|
|
356
364
|
tag = tag ? tag : childSlot.type.methods.getTag();
|
|
357
|
-
tag = (this_3.tagNameMapper["" + tag] ? this_3.tagNameMapper["" + tag] : tag).replace(
|
|
358
|
-
if (this_3.ej2Instances.getModuleName().toLowerCase()
|
|
365
|
+
tag = (this_3.tagNameMapper["" + tag] ? this_3.tagNameMapper["" + tag] : tag).replace('e-', '');
|
|
366
|
+
if (this_3.ej2Instances.getModuleName().toLowerCase() === 'diagram' && tag.indexOf('annotations') !== -1) {
|
|
359
367
|
tag = 'annotations';
|
|
360
368
|
}
|
|
361
369
|
}
|
|
@@ -375,7 +383,7 @@ var ComponentBase = vueDefineComponent({
|
|
|
375
383
|
childSlot.props = this_3.getCamelCaseProps(childSlot.props);
|
|
376
384
|
}
|
|
377
385
|
if (slot.length > 1) {
|
|
378
|
-
items = Object.keys(items).length
|
|
386
|
+
items = Object.keys(items).length === 0 && !items.length ? [] : items;
|
|
379
387
|
if (childSlot.props) {
|
|
380
388
|
items.push(childSlot.props);
|
|
381
389
|
}
|
|
@@ -399,7 +407,7 @@ var ComponentBase = vueDefineComponent({
|
|
|
399
407
|
var childSlot = slot_3[_i];
|
|
400
408
|
var innerDirValues = null;
|
|
401
409
|
var tag = childSlot.type.methods.getTag();
|
|
402
|
-
tag = (this.tagNameMapper[tag] ? this.tagNameMapper[tag] : tag).replace(
|
|
410
|
+
tag = (this.tagNameMapper["" + tag] ? this.tagNameMapper["" + tag] : tag).replace('e-', '');
|
|
403
411
|
if (childSlot.children) {
|
|
404
412
|
innerDirValues = this.resolveMultilevelComplexInnerDirs(childSlot.children, tagObject["" + tagName], childSlot.type.methods.getTag());
|
|
405
413
|
if ((/[s]\b/).test(tag) || slot.length > 1) {
|
|
@@ -448,9 +456,8 @@ var ComponentBase = vueDefineComponent({
|
|
|
448
456
|
for (var _i = 0, slot_4 = slot; _i < slot_4.length; _i++) {
|
|
449
457
|
var childSlot = slot_4[_i];
|
|
450
458
|
var innerDirValues = null;
|
|
451
|
-
var moduleName = this.ej2Instances.getModuleName().toLowerCase();
|
|
452
459
|
var tag = childSlot.type.methods.getTag();
|
|
453
|
-
tag = (this.tagNameMapper[tag] ? this.tagNameMapper[tag] : tag).replace(
|
|
460
|
+
tag = (this.tagNameMapper["" + tag] ? this.tagNameMapper["" + tag] : tag).replace('e-', '');
|
|
454
461
|
if (childSlot.children) {
|
|
455
462
|
innerDirValues = this.resolveComplexInnerDirs(childSlot.children, tagObject["" + tagName], childSlot.type.methods.getTag());
|
|
456
463
|
}
|
|
@@ -482,14 +489,15 @@ var ComponentBase = vueDefineComponent({
|
|
|
482
489
|
if (tagDirectives) {
|
|
483
490
|
for (var _i = 0, tagDirectives_1 = tagDirectives; _i < tagDirectives_1.length; _i++) {
|
|
484
491
|
var tagDirective = tagDirectives_1[_i];
|
|
485
|
-
|
|
492
|
+
var tagCompOption = tagDirective.componentOptions;
|
|
493
|
+
if (tagCompOption && tagCompOption.children && this.getTagName(tagCompOption) ||
|
|
486
494
|
(tagDirective.tag === 'e-seriescollection' && tagDirective.children)) {
|
|
487
|
-
var dirTag =
|
|
495
|
+
var dirTag = tagCompOption ? this.getTagName(tagCompOption) : tagDirective.tag;
|
|
488
496
|
dirTag = (dirTag === 'e-seriescollection') ? 'e-seriesCollection' : dirTag;
|
|
489
497
|
if (keyTags.indexOf(dirTag) !== -1) {
|
|
490
498
|
var tagName = tagNameMapper["" + dirTag] ? tagNameMapper["" + dirTag] : dirTag;
|
|
491
499
|
dir[tagName.replace('e-', '')] = [];
|
|
492
|
-
var children =
|
|
500
|
+
var children = tagCompOption ? tagCompOption.children : tagDirective.children;
|
|
493
501
|
for (var _a = 0, children_1 = children; _a < children_1.length; _a++) {
|
|
494
502
|
var tagDirChild = children_1[_a];
|
|
495
503
|
var retObj = this.getVNodeValue(tagDirChild, tagMapper["" + dirTag], tagNameMapper);
|
|
@@ -545,8 +553,9 @@ var ComponentBase = vueDefineComponent({
|
|
|
545
553
|
else {
|
|
546
554
|
dirTag = (tagDirective.tag === 'e-markersettings') ? 'e-markerSettings' : 'e-markerSetting';
|
|
547
555
|
}
|
|
548
|
-
|
|
549
|
-
|
|
556
|
+
var tagData = tagDirective.data;
|
|
557
|
+
if (typeof tagKey === 'string' && dirTag === tagKey && tagData) {
|
|
558
|
+
ret = tagData.attrs ? this.getCamelCaseProps(tagData.attrs) : this.getCamelCaseProps(tagData);
|
|
550
559
|
}
|
|
551
560
|
else if (typeof tagKey === 'object') {
|
|
552
561
|
if (tagDirective.componentOptions.children && (Object.keys(tagKey).indexOf(dirTag) !== -1)) {
|
|
@@ -555,15 +564,18 @@ var ComponentBase = vueDefineComponent({
|
|
|
555
564
|
else if (tagDirective.children && (Object.keys(tagKey).indexOf(dirTag) !== -1) && (dirTag === 'e-markersettings' || dirTag === 'e-markersetting')) {
|
|
556
565
|
ret = this.getMultiLevelDirValue(tagDirective.children, tagKey["" + dirTag], tagNameMapper);
|
|
557
566
|
}
|
|
558
|
-
if (
|
|
559
|
-
ret = extend(ret, this.getCamelCaseProps(
|
|
567
|
+
if (tagData && tagData.attrs) {
|
|
568
|
+
ret = extend(ret, this.getCamelCaseProps(tagData.attrs));
|
|
560
569
|
}
|
|
561
570
|
}
|
|
562
571
|
}
|
|
563
572
|
return ret;
|
|
564
573
|
},
|
|
565
574
|
/**
|
|
566
|
-
* convert kebab case directive props to camel case
|
|
575
|
+
* convert kebab case directive props to camel case.
|
|
576
|
+
*
|
|
577
|
+
* @param {Object} props - Objects in kebab case directive props.
|
|
578
|
+
* @returns {Object} Object converted into camel case directive props.
|
|
567
579
|
*/
|
|
568
580
|
getCamelCaseProps: function (props) {
|
|
569
581
|
var retProps = {};
|
|
@@ -581,13 +593,20 @@ var ComponentBase = vueDefineComponent({
|
|
|
581
593
|
},
|
|
582
594
|
getTagName: function (options) {
|
|
583
595
|
var tag = options.tag;
|
|
584
|
-
|
|
596
|
+
var optCtor = options.Ctor;
|
|
597
|
+
if (!tag && optCtor && optCtor.extendOptions && optCtor.extendOptions.methods && optCtor.extendOptions.methods.getTag) {
|
|
585
598
|
tag = options.Ctor.extendOptions.methods.getTag();
|
|
586
599
|
}
|
|
587
600
|
return tag;
|
|
588
601
|
}
|
|
589
602
|
}
|
|
590
603
|
});
|
|
604
|
+
/**
|
|
605
|
+
* Collect public property values for the Vue component.
|
|
606
|
+
*
|
|
607
|
+
* @param {any} options - represents props object.
|
|
608
|
+
* @returns {any} array of props object and `watchobject` respectively.
|
|
609
|
+
*/
|
|
591
610
|
function getProps(options) {
|
|
592
611
|
if (options === void 0) { options = {}; }
|
|
593
612
|
if (options.props) {
|
|
@@ -607,8 +626,9 @@ function getProps(options) {
|
|
|
607
626
|
}
|
|
608
627
|
return [options.newprops, options.watch];
|
|
609
628
|
}
|
|
610
|
-
if (!isExecute)
|
|
629
|
+
if (!isExecute) {
|
|
611
630
|
setProxyToRaw(aVue.toRaw);
|
|
631
|
+
}
|
|
612
632
|
|
|
613
633
|
var __assign = (undefined && undefined.__assign) || function () {
|
|
614
634
|
__assign = Object.assign || function(t) {
|
|
@@ -621,10 +641,16 @@ var __assign = (undefined && undefined.__assign) || function () {
|
|
|
621
641
|
};
|
|
622
642
|
return __assign.apply(this, arguments);
|
|
623
643
|
};
|
|
624
|
-
// tslint:disable:no-any
|
|
625
644
|
var stringCompiler = getTemplateEngine();
|
|
645
|
+
/**
|
|
646
|
+
* Compiler function that convert the template property to DOM element.
|
|
647
|
+
*
|
|
648
|
+
* @param {any} templateElement - represents value of the template property from the component.
|
|
649
|
+
* @param {Object} helper - represents helper object to utilize on template compilation.
|
|
650
|
+
* @returns {NodeList} template element that append to the component.
|
|
651
|
+
*/
|
|
626
652
|
function compile(templateElement, helper) {
|
|
627
|
-
var
|
|
653
|
+
var _this = this;
|
|
628
654
|
return function (data, context, propName, element, root) {
|
|
629
655
|
var _a, _b, _c, _d;
|
|
630
656
|
var returnEle;
|
|
@@ -632,14 +658,14 @@ function compile(templateElement, helper) {
|
|
|
632
658
|
var plugins = context.vueInstance && context.vueInstance.plugins ? { plugins: context.vueInstance.plugins } : {};
|
|
633
659
|
var vueInstance = context.vueInstance ? context.vueInstance :
|
|
634
660
|
((root && root.vueInstance) ? root.vueInstance : null);
|
|
635
|
-
var pid = getUniqueID(
|
|
636
|
-
var id = getUniqueID(
|
|
637
|
-
var ele = createElement(
|
|
661
|
+
var pid = getUniqueID('templateParentDiv');
|
|
662
|
+
var id = getUniqueID('templateDiv');
|
|
663
|
+
var ele = createElement('div', {
|
|
638
664
|
id: pid,
|
|
639
|
-
innerHTML: '<div id="' + id + '"></div>'
|
|
665
|
+
innerHTML: '<div id="' + id + '"></div>'
|
|
640
666
|
});
|
|
641
667
|
document.body.appendChild(ele);
|
|
642
|
-
if (!isExecute && (typeof templateElement ===
|
|
668
|
+
if (!isExecute && (typeof templateElement === 'string' || (templateElement.prototype && templateElement.prototype.CSPTemplate && typeof templateElement === 'function'))) {
|
|
643
669
|
var vueSlot_1 = getCurrentVueSlot(context.vueInstance, templateElement, root);
|
|
644
670
|
if (vueSlot_1) {
|
|
645
671
|
// Compilation for Vue 3 slot template
|
|
@@ -669,12 +695,12 @@ function compile(templateElement, helper) {
|
|
|
669
695
|
}
|
|
670
696
|
else if (!isExecute) {
|
|
671
697
|
// Compilation for Vue 3 functional template
|
|
672
|
-
var tempObj = templateElement.call(
|
|
698
|
+
var tempObj = templateElement.call(_this, {});
|
|
673
699
|
var object = tempObj;
|
|
674
|
-
var propsData = getValue(
|
|
700
|
+
var propsData = getValue('template.propsData', tempObj);
|
|
675
701
|
var dataObj_1 = {
|
|
676
702
|
data: { data: extend(tempObj.data || {}, data) },
|
|
677
|
-
parent: context.vueInstance
|
|
703
|
+
parent: context.vueInstance
|
|
678
704
|
};
|
|
679
705
|
if (!object.template) {
|
|
680
706
|
object.template = object[Object.keys(object)[0]];
|
|
@@ -711,9 +737,12 @@ function compile(templateElement, helper) {
|
|
|
711
737
|
var _loop_1 = function (objstring) {
|
|
712
738
|
var intComponent = templateCompRef.components["" + objstring];
|
|
713
739
|
if (intComponent && intComponent.data) {
|
|
714
|
-
if (!intComponent.__data)
|
|
740
|
+
if (!intComponent.__data) {
|
|
715
741
|
intComponent.__data = intComponent.data;
|
|
716
|
-
|
|
742
|
+
}
|
|
743
|
+
intComponent.data = function (proxy) {
|
|
744
|
+
return Object.assign(intComponent.__data.call(proxy), dataObj_1.data);
|
|
745
|
+
};
|
|
717
746
|
}
|
|
718
747
|
};
|
|
719
748
|
for (var _i = 0, objkeys_1 = objkeys; _i < objkeys_1.length; _i++) {
|
|
@@ -753,19 +782,21 @@ function compile(templateElement, helper) {
|
|
|
753
782
|
}
|
|
754
783
|
detach(ele);
|
|
755
784
|
}
|
|
756
|
-
else if (typeof templateElement ===
|
|
785
|
+
else if (typeof templateElement === 'string' || (templateElement.prototype && templateElement.prototype.CSPTemplate && typeof templateElement === 'function')) {
|
|
757
786
|
var vueSlot_2 = getVueSlot(context.vueInstance, templateElement, root);
|
|
758
787
|
if (vueSlot_2) {
|
|
759
788
|
// Get provide values for Vue 2 slot template
|
|
760
789
|
var provided_1 = {};
|
|
761
790
|
var getProvideValues_1 = function (vueinstance) {
|
|
762
|
-
if (vueinstance['$parent'])
|
|
791
|
+
if (vueinstance['$parent']) {
|
|
763
792
|
getProvideValues_1(vueinstance.$parent);
|
|
793
|
+
}
|
|
764
794
|
if (vueinstance['_provided'] && Object.keys(vueinstance['_provided']).length > 0) {
|
|
765
795
|
provided_1 = __assign({}, provided_1, vueinstance._provided);
|
|
766
796
|
}
|
|
767
797
|
};
|
|
768
|
-
var vueInstance_1 = context.vueInstance ? context.vueInstance :
|
|
798
|
+
var vueInstance_1 = context.vueInstance ? context.vueInstance :
|
|
799
|
+
((root && root.vueInstance) ? root.vueInstance : null);
|
|
769
800
|
if (vueInstance_1) {
|
|
770
801
|
getProvideValues_1(vueInstance_1);
|
|
771
802
|
}
|
|
@@ -776,7 +807,7 @@ function compile(templateElement, helper) {
|
|
|
776
807
|
return vueSlot_2["" + templateElement]({ data: data });
|
|
777
808
|
}
|
|
778
809
|
});
|
|
779
|
-
vueTemplate.$mount(
|
|
810
|
+
vueTemplate.$mount('#' + id);
|
|
780
811
|
if (vueInstance_1) {
|
|
781
812
|
if (!vueInstance_1['portals']) {
|
|
782
813
|
vueInstance_1['portals'] = [];
|
|
@@ -794,18 +825,18 @@ function compile(templateElement, helper) {
|
|
|
794
825
|
}
|
|
795
826
|
else {
|
|
796
827
|
// Compilation for Vue 2 functional template
|
|
797
|
-
var tempObj = templateElement.call(
|
|
828
|
+
var tempObj = templateElement.call(_this, {});
|
|
798
829
|
var templateFunction = tempObj.template;
|
|
799
|
-
var propsData = getValue(
|
|
830
|
+
var propsData = getValue('template.propsData', tempObj);
|
|
800
831
|
var dataObj = {
|
|
801
832
|
data: { data: extend(tempObj.data || {}, data) },
|
|
802
|
-
parent: context.vueInstance
|
|
833
|
+
parent: context.vueInstance
|
|
803
834
|
};
|
|
804
835
|
if (propsData) {
|
|
805
836
|
templateFunction = tempObj.template.extends;
|
|
806
837
|
dataObj.propsData = propsData;
|
|
807
838
|
}
|
|
808
|
-
if (typeof templateFunction !==
|
|
839
|
+
if (typeof templateFunction !== 'function') {
|
|
809
840
|
templateFunction = aVue.extend(templateFunction);
|
|
810
841
|
}
|
|
811
842
|
if (templateFunction.options.setup) {
|
|
@@ -814,7 +845,7 @@ function compile(templateElement, helper) {
|
|
|
814
845
|
var templateVue = new templateFunction(dataObj);
|
|
815
846
|
// let templateVue = new Vue(tempObj.template);
|
|
816
847
|
// templateVue.$data.data = extend(tempObj.data, data);
|
|
817
|
-
templateVue.$mount(
|
|
848
|
+
templateVue.$mount('#' + id);
|
|
818
849
|
if (vueInstance) {
|
|
819
850
|
if (!vueInstance['portals']) {
|
|
820
851
|
vueInstance['portals'] = [];
|
|
@@ -842,6 +873,14 @@ function compile(templateElement, helper) {
|
|
|
842
873
|
};
|
|
843
874
|
}
|
|
844
875
|
setTemplateEngine({ compile: compile });
|
|
876
|
+
/**
|
|
877
|
+
* Collect values from the app instance.
|
|
878
|
+
*
|
|
879
|
+
* @param {any} app - represents global application instance
|
|
880
|
+
* @param {any} cInstance - represents Vue component instance
|
|
881
|
+
* @param {any} root - represents parent component instance
|
|
882
|
+
* @returns {void}
|
|
883
|
+
*/
|
|
845
884
|
function getValues(app, cInstance, root) {
|
|
846
885
|
var vueInstance = cInstance ? cInstance : ((root && root.vueInstance) ? root.vueInstance : null);
|
|
847
886
|
if (!vueInstance) {
|
|
@@ -852,8 +891,9 @@ function getValues(app, cInstance, root) {
|
|
|
852
891
|
// Get provide value from child component.
|
|
853
892
|
var provided = {};
|
|
854
893
|
var getProvideValue = function (vueinstance) {
|
|
855
|
-
if (vueinstance['$'] && vueinstance['$']['parent'])
|
|
894
|
+
if (vueinstance['$'] && vueinstance['$']['parent']) {
|
|
856
895
|
getProvideValue(vueinstance.$.parent);
|
|
896
|
+
}
|
|
857
897
|
if (vueinstance['provides'] && Object.keys(vueinstance['provides']).length > 0) {
|
|
858
898
|
provided = __assign({}, provided, vueinstance.provides);
|
|
859
899
|
}
|
|
@@ -863,7 +903,14 @@ function getValues(app, cInstance, root) {
|
|
|
863
903
|
app.appContext.provides = __assign({}, app.appContext.provides, provided);
|
|
864
904
|
}
|
|
865
905
|
}
|
|
866
|
-
|
|
906
|
+
/**
|
|
907
|
+
* Get the Vue2 slot template from the root or current Vue component.
|
|
908
|
+
*
|
|
909
|
+
* @param {any} vueInstance - represents parent Vue instance.
|
|
910
|
+
* @param {any} templateElement - represents component property value
|
|
911
|
+
* @param {any} root - represents root Vue instance
|
|
912
|
+
* @returns {any} template Vue instance
|
|
913
|
+
*/
|
|
867
914
|
function getVueSlot(vueInstance, templateElement, root) {
|
|
868
915
|
if (!vueInstance && !(root && root.vueInstance)) {
|
|
869
916
|
return undefined;
|
|
@@ -871,6 +918,13 @@ function getVueSlot(vueInstance, templateElement, root) {
|
|
|
871
918
|
var instance = (root && root.vueInstance) ? root.vueInstance : vueInstance;
|
|
872
919
|
return getVueChildSlot(instance, templateElement);
|
|
873
920
|
}
|
|
921
|
+
/**
|
|
922
|
+
* Get the Vue2 nested slot template from the root or current Vue component.
|
|
923
|
+
*
|
|
924
|
+
* @param {any} vueInstance - represents parent Vue instance.
|
|
925
|
+
* @param {any} templateElement - represents component property value
|
|
926
|
+
* @returns {any} nested template Vue instance
|
|
927
|
+
*/
|
|
874
928
|
function getVueChildSlot(vueInstance, templateElement) {
|
|
875
929
|
if (!vueInstance) {
|
|
876
930
|
return undefined;
|
|
@@ -904,12 +958,25 @@ function getVueChildSlot(vueInstance, templateElement) {
|
|
|
904
958
|
}
|
|
905
959
|
return undefined;
|
|
906
960
|
}
|
|
961
|
+
/**
|
|
962
|
+
* Collect the component slot directive instance.
|
|
963
|
+
*
|
|
964
|
+
* @param {any} vnode - represents Vue components slot instance.
|
|
965
|
+
* @returns {any} the slot instance of the directive.
|
|
966
|
+
*/
|
|
907
967
|
function getSlot(vnode) {
|
|
908
968
|
var slot = (vnode.componentOptions && vnode.componentOptions.children) ? vnode.componentOptions :
|
|
909
969
|
(!vnode.data && (vnode.tag === 'e-markersettings' || vnode.tag === 'e-markersetting')) ? vnode : vnode.data;
|
|
910
970
|
return vnode.componentInstance ? vnode.componentInstance : slot;
|
|
911
971
|
}
|
|
912
|
-
|
|
972
|
+
/**
|
|
973
|
+
* Get the Vue3 slot template from the root or current Vue component.
|
|
974
|
+
*
|
|
975
|
+
* @param {any} vueInstance - represents parent Vue instance.
|
|
976
|
+
* @param {any} templateElement - represents component property value
|
|
977
|
+
* @param {any} root - represents root Vue instance
|
|
978
|
+
* @returns {any} slot template instance
|
|
979
|
+
*/
|
|
913
980
|
function getCurrentVueSlot(vueInstance, templateElement, root) {
|
|
914
981
|
if (!vueInstance && !(root && root.vueInstance)) {
|
|
915
982
|
return undefined;
|
|
@@ -917,6 +984,13 @@ function getCurrentVueSlot(vueInstance, templateElement, root) {
|
|
|
917
984
|
var slots = (root && root.vueInstance) ? root.vueInstance.$slots : vueInstance.$slots;
|
|
918
985
|
return getChildVueSlot(slots, templateElement);
|
|
919
986
|
}
|
|
987
|
+
/**
|
|
988
|
+
* Get the Vue3 nested slot template from the root or current Vue component.
|
|
989
|
+
*
|
|
990
|
+
* @param {any} slots - represents slot instance.
|
|
991
|
+
* @param {any} templateElement - represents component property value
|
|
992
|
+
* @returns {any} nested template Vue instance
|
|
993
|
+
*/
|
|
920
994
|
function getChildVueSlot(slots, templateElement) {
|
|
921
995
|
if (slots && slots["" + templateElement]) {
|
|
922
996
|
return slots;
|
|
@@ -934,9 +1008,5 @@ function getChildVueSlot(slots, templateElement) {
|
|
|
934
1008
|
return undefined;
|
|
935
1009
|
}
|
|
936
1010
|
|
|
937
|
-
|
|
938
|
-
* index for component base
|
|
939
|
-
*/
|
|
940
|
-
|
|
941
|
-
export { isExecute, aVue, gh, vueDefineComponent, ComponentBase, getProps, compile };
|
|
1011
|
+
export { ComponentBase, aVue, compile, getProps, gh, isExecute, vueDefineComponent };
|
|
942
1012
|
//# sourceMappingURL=ej2-vue-base.es5.js.map
|