@syncfusion/ej2-vue-base 25.2.4 → 26.1.35-7502
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
package/src/component-base.js
CHANGED
|
@@ -1,8 +1,15 @@
|
|
|
1
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
1
2
|
/**
|
|
2
3
|
* Vue Component Base
|
|
3
4
|
*/
|
|
4
5
|
import * as Vue from 'vue';
|
|
5
6
|
import { isNullOrUndefined, extend, getValue, setProxyToRaw } from '@syncfusion/ej2-base';
|
|
7
|
+
/**
|
|
8
|
+
* Clone the Vue compiler instance.
|
|
9
|
+
*
|
|
10
|
+
* @param {any} obj - representes the Vue compiler.
|
|
11
|
+
* @returns {any} cloned object of Vue compiler.
|
|
12
|
+
*/
|
|
6
13
|
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) {
|
|
7
14
|
return obj;
|
|
8
15
|
}
|
|
@@ -10,15 +17,18 @@ else {
|
|
|
10
17
|
var newObj = {};
|
|
11
18
|
if (obj != null) {
|
|
12
19
|
for (var key in obj) {
|
|
13
|
-
if (Object.prototype.hasOwnProperty.call(obj, key))
|
|
20
|
+
if (Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
14
21
|
newObj["" + key] = obj["" + key];
|
|
22
|
+
}
|
|
15
23
|
}
|
|
16
24
|
}
|
|
17
25
|
newObj.default = obj;
|
|
18
26
|
return newObj;
|
|
19
27
|
} }
|
|
20
28
|
var curVue = _interopRequireWildcard(Vue);
|
|
21
|
-
export var isExecute = (parseInt(curVue['version']) > 2) ? false : true
|
|
29
|
+
export var isExecute = (parseInt(curVue['version'], 10) > 2) ? false : true;
|
|
30
|
+
export var aVue = !isExecute ? curVue : (curVue['default']['default'] ? curVue['default']['default'] : curVue['default']);
|
|
31
|
+
export var gh = curVue['h'];
|
|
22
32
|
export var vueDefineComponent = function (options) { return !isExecute ? aVue['defineComponent'](options) : aVue['extend'](options); };
|
|
23
33
|
export var ComponentBase = vueDefineComponent({
|
|
24
34
|
name: 'ComponentBase',
|
|
@@ -77,10 +87,13 @@ export var ComponentBase = vueDefineComponent({
|
|
|
77
87
|
}
|
|
78
88
|
},
|
|
79
89
|
mounted: function () {
|
|
80
|
-
var cusEle = this.$el ? this.$el.querySelectorAll(
|
|
90
|
+
var cusEle = this.$el ? this.$el.querySelectorAll('div.e-directive') : null;
|
|
81
91
|
if (!isExecute && cusEle) {
|
|
82
92
|
for (var i = 0; i < cusEle.length; i++) {
|
|
83
|
-
|
|
93
|
+
var cusElement = cusEle[parseInt(i.toString(), 10)];
|
|
94
|
+
if (cusElement.parentElement) {
|
|
95
|
+
cusElement.parentElement.removeChild(cusElement);
|
|
96
|
+
}
|
|
84
97
|
}
|
|
85
98
|
}
|
|
86
99
|
this.ej2Instances.isVue = true;
|
|
@@ -142,12 +155,11 @@ export var ComponentBase = vueDefineComponent({
|
|
|
142
155
|
provide = getValue('$.parent.provides', this);
|
|
143
156
|
}
|
|
144
157
|
if (provide) {
|
|
145
|
-
// tslint:disable:no-any
|
|
146
158
|
var injectables = provide;
|
|
147
159
|
if (typeof provide === 'function') {
|
|
148
160
|
if (provide.managed) {
|
|
149
|
-
var
|
|
150
|
-
var
|
|
161
|
+
var pKey = provide.managed;
|
|
162
|
+
var pValue = Object.keys(pKey);
|
|
151
163
|
var key = void 0;
|
|
152
164
|
if (this.$root && this.isDecorator) {
|
|
153
165
|
key = Object.keys(this.$root);
|
|
@@ -158,24 +170,23 @@ export var ComponentBase = vueDefineComponent({
|
|
|
158
170
|
else if (this.$parent) {
|
|
159
171
|
key = Object.keys(this.$parent);
|
|
160
172
|
}
|
|
161
|
-
for (var i = 0; i <
|
|
173
|
+
for (var i = 0; i < pValue.length; i++) {
|
|
162
174
|
for (var j = 0; j < key.length; j++) {
|
|
163
|
-
if ((key[parseInt(j.toString(), 10)].indexOf(
|
|
175
|
+
if ((key[parseInt(j.toString(), 10)].indexOf(pValue[parseInt(i.toString(), 10)])) !== -1) {
|
|
164
176
|
if (this.$root && this.isDecorator) {
|
|
165
|
-
|
|
177
|
+
pKey[pValue[parseInt(j.toString(), 10)]] = this.$root[key[parseInt(i.toString(), 10)]];
|
|
166
178
|
}
|
|
167
179
|
else if (this.$vnode) {
|
|
168
|
-
|
|
180
|
+
pKey[pValue[parseInt(i.toString(), 10)]] = this.$vnode.context[key[parseInt(j.toString(), 10)]];
|
|
169
181
|
}
|
|
170
182
|
else if (this.$parent) {
|
|
171
|
-
|
|
183
|
+
pKey[pValue[parseInt(i.toString(), 10)]] = this.$parent[key[parseInt(j.toString(), 10)]];
|
|
172
184
|
}
|
|
173
|
-
injectables =
|
|
185
|
+
injectables = pKey;
|
|
174
186
|
}
|
|
175
187
|
}
|
|
176
188
|
}
|
|
177
189
|
}
|
|
178
|
-
// tslint:disable:no-any
|
|
179
190
|
else if (this.$vnode) {
|
|
180
191
|
injectables = this.$vnode.context.$options.provide();
|
|
181
192
|
}
|
|
@@ -189,11 +200,9 @@ export var ComponentBase = vueDefineComponent({
|
|
|
189
200
|
return ret;
|
|
190
201
|
},
|
|
191
202
|
destroyComponent: function () {
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
tempBeforeDestroyThis.destroyPortals();
|
|
196
|
-
tempBeforeDestroyThis = null;
|
|
203
|
+
this.ej2Instances.destroy();
|
|
204
|
+
this.$el.style.visibility = 'hidden';
|
|
205
|
+
this.destroyPortals();
|
|
197
206
|
},
|
|
198
207
|
destroyPortals: function () {
|
|
199
208
|
if (this.portals) {
|
|
@@ -258,21 +267,21 @@ export var ComponentBase = vueDefineComponent({
|
|
|
258
267
|
for (var i = 0; i < propRef.length; i++) {
|
|
259
268
|
if (propRef[parseInt(i.toString(), 10)].type.methods || propRef[parseInt(i.toString(), 10)].type === 'e-seriescollection') {
|
|
260
269
|
var key = propRef[parseInt(i.toString(), 10)].type === 'e-seriescollection' ? 'series-collection' :
|
|
261
|
-
propRef[parseInt(i.toString(), 10)].type.methods.getTag().replace(
|
|
270
|
+
propRef[parseInt(i.toString(), 10)].type.methods.getTag().replace('e-', '');
|
|
262
271
|
var ref = this.resolveArrayDirectives(propRef[parseInt(i.toString(), 10)].children, key);
|
|
263
|
-
var
|
|
272
|
+
var spKeys = key.split('-');
|
|
264
273
|
var controlName = this.ej2Instances.getModuleName().toLowerCase();
|
|
265
|
-
var keyRef = (
|
|
274
|
+
var keyRef = (spKeys.length > 1 && controlName.indexOf(spKeys[0]) > -1) ? spKeys[1] : spKeys[0];
|
|
266
275
|
keyRef = keyRef.replace(controlName, '');
|
|
267
276
|
keyRef = this.tagNameMapper['e-' + key] ? this.tagNameMapper['e-' + key].replace('e-', '') : keyRef;
|
|
268
|
-
if (controlName
|
|
269
|
-
keyRef =
|
|
277
|
+
if (controlName === 'splitter' && keyRef === 'panes') {
|
|
278
|
+
keyRef = 'paneSettings';
|
|
270
279
|
}
|
|
271
|
-
else if (controlName
|
|
272
|
-
keyRef =
|
|
280
|
+
else if (controlName === 'bulletchart' && keyRef === 'range') {
|
|
281
|
+
keyRef = 'ranges';
|
|
273
282
|
}
|
|
274
|
-
else if (controlName
|
|
275
|
-
keyRef =
|
|
283
|
+
else if (controlName === 'schedule' && keyRef === 'header') {
|
|
284
|
+
keyRef = 'headerRows';
|
|
276
285
|
}
|
|
277
286
|
dirProps["" + keyRef] = ref["" + key];
|
|
278
287
|
}
|
|
@@ -302,7 +311,7 @@ export var ComponentBase = vueDefineComponent({
|
|
|
302
311
|
var tagRef = childSlot.type.methods ? childSlot.type.methods.getTag() : tagName;
|
|
303
312
|
if (childSlot.children) {
|
|
304
313
|
var key = void 0;
|
|
305
|
-
innerDirValues = this_2.resolveComplexDirs(childSlot.children, this_2.tagMapper[
|
|
314
|
+
innerDirValues = this_2.resolveComplexDirs(childSlot.children, this_2.tagMapper['e-' + tagName], tagRef);
|
|
306
315
|
if (innerDirValues.length) {
|
|
307
316
|
tempObj = innerDirValues;
|
|
308
317
|
}
|
|
@@ -322,7 +331,12 @@ export var ComponentBase = vueDefineComponent({
|
|
|
322
331
|
});
|
|
323
332
|
}
|
|
324
333
|
if (((/[s]\b/).test(tagRef) && innerDirValues) && (!(/[s]\b/).test(tagName) || innerDirValues.length)) {
|
|
325
|
-
Array.isArray(tempObj)
|
|
334
|
+
if (Array.isArray(tempObj)) {
|
|
335
|
+
tempObj.forEach(function (item) { items["" + tagName].push(item); });
|
|
336
|
+
}
|
|
337
|
+
else {
|
|
338
|
+
items["" + tagName].push(tempObj);
|
|
339
|
+
}
|
|
326
340
|
}
|
|
327
341
|
else if (tempObj && Object.keys(tempObj).length !== 0) {
|
|
328
342
|
items["" + tagName].push(tempObj);
|
|
@@ -347,12 +361,11 @@ export var ComponentBase = vueDefineComponent({
|
|
|
347
361
|
tagRef = Object.keys(tagObject["" + tagName]);
|
|
348
362
|
tag = tagRef.find(function (key) {
|
|
349
363
|
return tagObject["" + tagName]["" + key] ===
|
|
350
|
-
childSlot.type.methods.getTag().replace(/[s]\b/,
|
|
364
|
+
childSlot.type.methods.getTag().replace(/[s]\b/, '');
|
|
351
365
|
});
|
|
352
|
-
var moduleName = this_3.ej2Instances.getModuleName().toLowerCase();
|
|
353
366
|
tag = tag ? tag : childSlot.type.methods.getTag();
|
|
354
|
-
tag = (this_3.tagNameMapper["" + tag] ? this_3.tagNameMapper["" + tag] : tag).replace(
|
|
355
|
-
if (this_3.ej2Instances.getModuleName().toLowerCase()
|
|
367
|
+
tag = (this_3.tagNameMapper["" + tag] ? this_3.tagNameMapper["" + tag] : tag).replace('e-', '');
|
|
368
|
+
if (this_3.ej2Instances.getModuleName().toLowerCase() === 'diagram' && tag.indexOf('annotations') !== -1) {
|
|
356
369
|
tag = 'annotations';
|
|
357
370
|
}
|
|
358
371
|
}
|
|
@@ -372,7 +385,7 @@ export var ComponentBase = vueDefineComponent({
|
|
|
372
385
|
childSlot.props = this_3.getCamelCaseProps(childSlot.props);
|
|
373
386
|
}
|
|
374
387
|
if (slot.length > 1) {
|
|
375
|
-
items = Object.keys(items).length
|
|
388
|
+
items = Object.keys(items).length === 0 && !items.length ? [] : items;
|
|
376
389
|
if (childSlot.props) {
|
|
377
390
|
items.push(childSlot.props);
|
|
378
391
|
}
|
|
@@ -396,7 +409,7 @@ export var ComponentBase = vueDefineComponent({
|
|
|
396
409
|
var childSlot = slot_3[_i];
|
|
397
410
|
var innerDirValues = null;
|
|
398
411
|
var tag = childSlot.type.methods.getTag();
|
|
399
|
-
tag = (this.tagNameMapper[tag] ? this.tagNameMapper[tag] : tag).replace(
|
|
412
|
+
tag = (this.tagNameMapper["" + tag] ? this.tagNameMapper["" + tag] : tag).replace('e-', '');
|
|
400
413
|
if (childSlot.children) {
|
|
401
414
|
innerDirValues = this.resolveMultilevelComplexInnerDirs(childSlot.children, tagObject["" + tagName], childSlot.type.methods.getTag());
|
|
402
415
|
if ((/[s]\b/).test(tag) || slot.length > 1) {
|
|
@@ -445,9 +458,8 @@ export var ComponentBase = vueDefineComponent({
|
|
|
445
458
|
for (var _i = 0, slot_4 = slot; _i < slot_4.length; _i++) {
|
|
446
459
|
var childSlot = slot_4[_i];
|
|
447
460
|
var innerDirValues = null;
|
|
448
|
-
var moduleName = this.ej2Instances.getModuleName().toLowerCase();
|
|
449
461
|
var tag = childSlot.type.methods.getTag();
|
|
450
|
-
tag = (this.tagNameMapper[tag] ? this.tagNameMapper[tag] : tag).replace(
|
|
462
|
+
tag = (this.tagNameMapper["" + tag] ? this.tagNameMapper["" + tag] : tag).replace('e-', '');
|
|
451
463
|
if (childSlot.children) {
|
|
452
464
|
innerDirValues = this.resolveComplexInnerDirs(childSlot.children, tagObject["" + tagName], childSlot.type.methods.getTag());
|
|
453
465
|
}
|
|
@@ -479,14 +491,15 @@ export var ComponentBase = vueDefineComponent({
|
|
|
479
491
|
if (tagDirectives) {
|
|
480
492
|
for (var _i = 0, tagDirectives_1 = tagDirectives; _i < tagDirectives_1.length; _i++) {
|
|
481
493
|
var tagDirective = tagDirectives_1[_i];
|
|
482
|
-
|
|
494
|
+
var tagCompOption = tagDirective.componentOptions;
|
|
495
|
+
if (tagCompOption && tagCompOption.children && this.getTagName(tagCompOption) ||
|
|
483
496
|
(tagDirective.tag === 'e-seriescollection' && tagDirective.children)) {
|
|
484
|
-
var dirTag =
|
|
497
|
+
var dirTag = tagCompOption ? this.getTagName(tagCompOption) : tagDirective.tag;
|
|
485
498
|
dirTag = (dirTag === 'e-seriescollection') ? 'e-seriesCollection' : dirTag;
|
|
486
499
|
if (keyTags.indexOf(dirTag) !== -1) {
|
|
487
500
|
var tagName = tagNameMapper["" + dirTag] ? tagNameMapper["" + dirTag] : dirTag;
|
|
488
501
|
dir[tagName.replace('e-', '')] = [];
|
|
489
|
-
var children =
|
|
502
|
+
var children = tagCompOption ? tagCompOption.children : tagDirective.children;
|
|
490
503
|
for (var _a = 0, children_1 = children; _a < children_1.length; _a++) {
|
|
491
504
|
var tagDirChild = children_1[_a];
|
|
492
505
|
var retObj = this.getVNodeValue(tagDirChild, tagMapper["" + dirTag], tagNameMapper);
|
|
@@ -542,8 +555,9 @@ export var ComponentBase = vueDefineComponent({
|
|
|
542
555
|
else {
|
|
543
556
|
dirTag = (tagDirective.tag === 'e-markersettings') ? 'e-markerSettings' : 'e-markerSetting';
|
|
544
557
|
}
|
|
545
|
-
|
|
546
|
-
|
|
558
|
+
var tagData = tagDirective.data;
|
|
559
|
+
if (typeof tagKey === 'string' && dirTag === tagKey && tagData) {
|
|
560
|
+
ret = tagData.attrs ? this.getCamelCaseProps(tagData.attrs) : this.getCamelCaseProps(tagData);
|
|
547
561
|
}
|
|
548
562
|
else if (typeof tagKey === 'object') {
|
|
549
563
|
if (tagDirective.componentOptions.children && (Object.keys(tagKey).indexOf(dirTag) !== -1)) {
|
|
@@ -552,15 +566,18 @@ export var ComponentBase = vueDefineComponent({
|
|
|
552
566
|
else if (tagDirective.children && (Object.keys(tagKey).indexOf(dirTag) !== -1) && (dirTag === 'e-markersettings' || dirTag === 'e-markersetting')) {
|
|
553
567
|
ret = this.getMultiLevelDirValue(tagDirective.children, tagKey["" + dirTag], tagNameMapper);
|
|
554
568
|
}
|
|
555
|
-
if (
|
|
556
|
-
ret = extend(ret, this.getCamelCaseProps(
|
|
569
|
+
if (tagData && tagData.attrs) {
|
|
570
|
+
ret = extend(ret, this.getCamelCaseProps(tagData.attrs));
|
|
557
571
|
}
|
|
558
572
|
}
|
|
559
573
|
}
|
|
560
574
|
return ret;
|
|
561
575
|
},
|
|
562
576
|
/**
|
|
563
|
-
* convert kebab case directive props to camel case
|
|
577
|
+
* convert kebab case directive props to camel case.
|
|
578
|
+
*
|
|
579
|
+
* @param {Object} props - Objects in kebab case directive props.
|
|
580
|
+
* @returns {Object} Object converted into camel case directive props.
|
|
564
581
|
*/
|
|
565
582
|
getCamelCaseProps: function (props) {
|
|
566
583
|
var retProps = {};
|
|
@@ -578,13 +595,20 @@ export var ComponentBase = vueDefineComponent({
|
|
|
578
595
|
},
|
|
579
596
|
getTagName: function (options) {
|
|
580
597
|
var tag = options.tag;
|
|
581
|
-
|
|
598
|
+
var optCtor = options.Ctor;
|
|
599
|
+
if (!tag && optCtor && optCtor.extendOptions && optCtor.extendOptions.methods && optCtor.extendOptions.methods.getTag) {
|
|
582
600
|
tag = options.Ctor.extendOptions.methods.getTag();
|
|
583
601
|
}
|
|
584
602
|
return tag;
|
|
585
603
|
}
|
|
586
604
|
}
|
|
587
605
|
});
|
|
606
|
+
/**
|
|
607
|
+
* Collect public property values for the Vue component.
|
|
608
|
+
*
|
|
609
|
+
* @param {any} options - represents props object.
|
|
610
|
+
* @returns {any} array of props object and `watchobject` respectively.
|
|
611
|
+
*/
|
|
588
612
|
export function getProps(options) {
|
|
589
613
|
if (options === void 0) { options = {}; }
|
|
590
614
|
if (options.props) {
|
|
@@ -604,5 +628,6 @@ export function getProps(options) {
|
|
|
604
628
|
}
|
|
605
629
|
return [options.newprops, options.watch];
|
|
606
630
|
}
|
|
607
|
-
if (!isExecute)
|
|
631
|
+
if (!isExecute) {
|
|
608
632
|
setProxyToRaw(aVue.toRaw);
|
|
633
|
+
}
|
package/src/template.d.ts
CHANGED
|
@@ -1 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Compiler function that convert the template property to DOM element.
|
|
3
|
+
*
|
|
4
|
+
* @param {any} templateElement - represents value of the template property from the component.
|
|
5
|
+
* @param {Object} helper - represents helper object to utilize on template compilation.
|
|
6
|
+
* @returns {NodeList} template element that append to the component.
|
|
7
|
+
*/
|
|
1
8
|
export declare function compile(templateElement: any, helper?: Object): (data: Object | JSON, component?: any, propName?: any, element?: any, root?: any) => Object;
|
package/src/template.js
CHANGED
|
@@ -9,12 +9,19 @@ var __assign = (this && this.__assign) || function () {
|
|
|
9
9
|
};
|
|
10
10
|
return __assign.apply(this, arguments);
|
|
11
11
|
};
|
|
12
|
-
|
|
13
|
-
import {
|
|
14
|
-
|
|
12
|
+
/* eslint-disable @typescript-eslint/no-explicit-any, @typescript-eslint/explicit-module-boundary-types */
|
|
13
|
+
import { setTemplateEngine, getTemplateEngine, getUniqueID, createElement, detach, extend, getValue } from '@syncfusion/ej2-base';
|
|
14
|
+
import { aVue as Vue, isExecute } from './component-base';
|
|
15
15
|
var stringCompiler = getTemplateEngine();
|
|
16
|
+
/**
|
|
17
|
+
* Compiler function that convert the template property to DOM element.
|
|
18
|
+
*
|
|
19
|
+
* @param {any} templateElement - represents value of the template property from the component.
|
|
20
|
+
* @param {Object} helper - represents helper object to utilize on template compilation.
|
|
21
|
+
* @returns {NodeList} template element that append to the component.
|
|
22
|
+
*/
|
|
16
23
|
export function compile(templateElement, helper) {
|
|
17
|
-
var
|
|
24
|
+
var _this = this;
|
|
18
25
|
return function (data, context, propName, element, root) {
|
|
19
26
|
var _a, _b, _c, _d;
|
|
20
27
|
var returnEle;
|
|
@@ -22,14 +29,14 @@ export function compile(templateElement, helper) {
|
|
|
22
29
|
var plugins = context.vueInstance && context.vueInstance.plugins ? { plugins: context.vueInstance.plugins } : {};
|
|
23
30
|
var vueInstance = context.vueInstance ? context.vueInstance :
|
|
24
31
|
((root && root.vueInstance) ? root.vueInstance : null);
|
|
25
|
-
var pid = getUniqueID(
|
|
26
|
-
var id = getUniqueID(
|
|
27
|
-
var ele = createElement(
|
|
32
|
+
var pid = getUniqueID('templateParentDiv');
|
|
33
|
+
var id = getUniqueID('templateDiv');
|
|
34
|
+
var ele = createElement('div', {
|
|
28
35
|
id: pid,
|
|
29
|
-
innerHTML: '<div id="' + id + '"></div>'
|
|
36
|
+
innerHTML: '<div id="' + id + '"></div>'
|
|
30
37
|
});
|
|
31
38
|
document.body.appendChild(ele);
|
|
32
|
-
if (!isExecute && (typeof templateElement ===
|
|
39
|
+
if (!isExecute && (typeof templateElement === 'string' || (templateElement.prototype && templateElement.prototype.CSPTemplate && typeof templateElement === 'function'))) {
|
|
33
40
|
var vueSlot_1 = getCurrentVueSlot(context.vueInstance, templateElement, root);
|
|
34
41
|
if (vueSlot_1) {
|
|
35
42
|
// Compilation for Vue 3 slot template
|
|
@@ -59,12 +66,12 @@ export function compile(templateElement, helper) {
|
|
|
59
66
|
}
|
|
60
67
|
else if (!isExecute) {
|
|
61
68
|
// Compilation for Vue 3 functional template
|
|
62
|
-
var tempObj = templateElement.call(
|
|
69
|
+
var tempObj = templateElement.call(_this, {});
|
|
63
70
|
var object = tempObj;
|
|
64
|
-
var propsData = getValue(
|
|
71
|
+
var propsData = getValue('template.propsData', tempObj);
|
|
65
72
|
var dataObj_1 = {
|
|
66
73
|
data: { data: extend(tempObj.data || {}, data) },
|
|
67
|
-
parent: context.vueInstance
|
|
74
|
+
parent: context.vueInstance
|
|
68
75
|
};
|
|
69
76
|
if (!object.template) {
|
|
70
77
|
object.template = object[Object.keys(object)[0]];
|
|
@@ -101,9 +108,12 @@ export function compile(templateElement, helper) {
|
|
|
101
108
|
var _loop_1 = function (objstring) {
|
|
102
109
|
var intComponent = templateCompRef.components["" + objstring];
|
|
103
110
|
if (intComponent && intComponent.data) {
|
|
104
|
-
if (!intComponent.__data)
|
|
111
|
+
if (!intComponent.__data) {
|
|
105
112
|
intComponent.__data = intComponent.data;
|
|
106
|
-
|
|
113
|
+
}
|
|
114
|
+
intComponent.data = function (proxy) {
|
|
115
|
+
return Object.assign(intComponent.__data.call(proxy), dataObj_1.data);
|
|
116
|
+
};
|
|
107
117
|
}
|
|
108
118
|
};
|
|
109
119
|
for (var _i = 0, objkeys_1 = objkeys; _i < objkeys_1.length; _i++) {
|
|
@@ -143,19 +153,21 @@ export function compile(templateElement, helper) {
|
|
|
143
153
|
}
|
|
144
154
|
detach(ele);
|
|
145
155
|
}
|
|
146
|
-
else if (typeof templateElement ===
|
|
156
|
+
else if (typeof templateElement === 'string' || (templateElement.prototype && templateElement.prototype.CSPTemplate && typeof templateElement === 'function')) {
|
|
147
157
|
var vueSlot_2 = getVueSlot(context.vueInstance, templateElement, root);
|
|
148
158
|
if (vueSlot_2) {
|
|
149
159
|
// Get provide values for Vue 2 slot template
|
|
150
160
|
var provided_1 = {};
|
|
151
161
|
var getProvideValues_1 = function (vueinstance) {
|
|
152
|
-
if (vueinstance['$parent'])
|
|
162
|
+
if (vueinstance['$parent']) {
|
|
153
163
|
getProvideValues_1(vueinstance.$parent);
|
|
164
|
+
}
|
|
154
165
|
if (vueinstance['_provided'] && Object.keys(vueinstance['_provided']).length > 0) {
|
|
155
166
|
provided_1 = __assign({}, provided_1, vueinstance._provided);
|
|
156
167
|
}
|
|
157
168
|
};
|
|
158
|
-
var vueInstance_1 = context.vueInstance ? context.vueInstance :
|
|
169
|
+
var vueInstance_1 = context.vueInstance ? context.vueInstance :
|
|
170
|
+
((root && root.vueInstance) ? root.vueInstance : null);
|
|
159
171
|
if (vueInstance_1) {
|
|
160
172
|
getProvideValues_1(vueInstance_1);
|
|
161
173
|
}
|
|
@@ -166,7 +178,7 @@ export function compile(templateElement, helper) {
|
|
|
166
178
|
return vueSlot_2["" + templateElement]({ data: data });
|
|
167
179
|
}
|
|
168
180
|
});
|
|
169
|
-
vueTemplate.$mount(
|
|
181
|
+
vueTemplate.$mount('#' + id);
|
|
170
182
|
if (vueInstance_1) {
|
|
171
183
|
if (!vueInstance_1['portals']) {
|
|
172
184
|
vueInstance_1['portals'] = [];
|
|
@@ -184,18 +196,18 @@ export function compile(templateElement, helper) {
|
|
|
184
196
|
}
|
|
185
197
|
else {
|
|
186
198
|
// Compilation for Vue 2 functional template
|
|
187
|
-
var tempObj = templateElement.call(
|
|
199
|
+
var tempObj = templateElement.call(_this, {});
|
|
188
200
|
var templateFunction = tempObj.template;
|
|
189
|
-
var propsData = getValue(
|
|
201
|
+
var propsData = getValue('template.propsData', tempObj);
|
|
190
202
|
var dataObj = {
|
|
191
203
|
data: { data: extend(tempObj.data || {}, data) },
|
|
192
|
-
parent: context.vueInstance
|
|
204
|
+
parent: context.vueInstance
|
|
193
205
|
};
|
|
194
206
|
if (propsData) {
|
|
195
207
|
templateFunction = tempObj.template.extends;
|
|
196
208
|
dataObj.propsData = propsData;
|
|
197
209
|
}
|
|
198
|
-
if (typeof templateFunction !==
|
|
210
|
+
if (typeof templateFunction !== 'function') {
|
|
199
211
|
templateFunction = Vue.extend(templateFunction);
|
|
200
212
|
}
|
|
201
213
|
if (templateFunction.options.setup) {
|
|
@@ -204,7 +216,7 @@ export function compile(templateElement, helper) {
|
|
|
204
216
|
var templateVue = new templateFunction(dataObj);
|
|
205
217
|
// let templateVue = new Vue(tempObj.template);
|
|
206
218
|
// templateVue.$data.data = extend(tempObj.data, data);
|
|
207
|
-
templateVue.$mount(
|
|
219
|
+
templateVue.$mount('#' + id);
|
|
208
220
|
if (vueInstance) {
|
|
209
221
|
if (!vueInstance['portals']) {
|
|
210
222
|
vueInstance['portals'] = [];
|
|
@@ -232,6 +244,14 @@ export function compile(templateElement, helper) {
|
|
|
232
244
|
};
|
|
233
245
|
}
|
|
234
246
|
setTemplateEngine({ compile: compile });
|
|
247
|
+
/**
|
|
248
|
+
* Collect values from the app instance.
|
|
249
|
+
*
|
|
250
|
+
* @param {any} app - represents global application instance
|
|
251
|
+
* @param {any} cInstance - represents Vue component instance
|
|
252
|
+
* @param {any} root - represents parent component instance
|
|
253
|
+
* @returns {void}
|
|
254
|
+
*/
|
|
235
255
|
function getValues(app, cInstance, root) {
|
|
236
256
|
var vueInstance = cInstance ? cInstance : ((root && root.vueInstance) ? root.vueInstance : null);
|
|
237
257
|
if (!vueInstance) {
|
|
@@ -242,8 +262,9 @@ function getValues(app, cInstance, root) {
|
|
|
242
262
|
// Get provide value from child component.
|
|
243
263
|
var provided = {};
|
|
244
264
|
var getProvideValue = function (vueinstance) {
|
|
245
|
-
if (vueinstance['$'] && vueinstance['$']['parent'])
|
|
265
|
+
if (vueinstance['$'] && vueinstance['$']['parent']) {
|
|
246
266
|
getProvideValue(vueinstance.$.parent);
|
|
267
|
+
}
|
|
247
268
|
if (vueinstance['provides'] && Object.keys(vueinstance['provides']).length > 0) {
|
|
248
269
|
provided = __assign({}, provided, vueinstance.provides);
|
|
249
270
|
}
|
|
@@ -253,7 +274,14 @@ function getValues(app, cInstance, root) {
|
|
|
253
274
|
app.appContext.provides = __assign({}, app.appContext.provides, provided);
|
|
254
275
|
}
|
|
255
276
|
}
|
|
256
|
-
|
|
277
|
+
/**
|
|
278
|
+
* Get the Vue2 slot template from the root or current Vue component.
|
|
279
|
+
*
|
|
280
|
+
* @param {any} vueInstance - represents parent Vue instance.
|
|
281
|
+
* @param {any} templateElement - represents component property value
|
|
282
|
+
* @param {any} root - represents root Vue instance
|
|
283
|
+
* @returns {any} template Vue instance
|
|
284
|
+
*/
|
|
257
285
|
function getVueSlot(vueInstance, templateElement, root) {
|
|
258
286
|
if (!vueInstance && !(root && root.vueInstance)) {
|
|
259
287
|
return undefined;
|
|
@@ -261,6 +289,13 @@ function getVueSlot(vueInstance, templateElement, root) {
|
|
|
261
289
|
var instance = (root && root.vueInstance) ? root.vueInstance : vueInstance;
|
|
262
290
|
return getVueChildSlot(instance, templateElement);
|
|
263
291
|
}
|
|
292
|
+
/**
|
|
293
|
+
* Get the Vue2 nested slot template from the root or current Vue component.
|
|
294
|
+
*
|
|
295
|
+
* @param {any} vueInstance - represents parent Vue instance.
|
|
296
|
+
* @param {any} templateElement - represents component property value
|
|
297
|
+
* @returns {any} nested template Vue instance
|
|
298
|
+
*/
|
|
264
299
|
function getVueChildSlot(vueInstance, templateElement) {
|
|
265
300
|
if (!vueInstance) {
|
|
266
301
|
return undefined;
|
|
@@ -294,12 +329,25 @@ function getVueChildSlot(vueInstance, templateElement) {
|
|
|
294
329
|
}
|
|
295
330
|
return undefined;
|
|
296
331
|
}
|
|
332
|
+
/**
|
|
333
|
+
* Collect the component slot directive instance.
|
|
334
|
+
*
|
|
335
|
+
* @param {any} vnode - represents Vue components slot instance.
|
|
336
|
+
* @returns {any} the slot instance of the directive.
|
|
337
|
+
*/
|
|
297
338
|
function getSlot(vnode) {
|
|
298
339
|
var slot = (vnode.componentOptions && vnode.componentOptions.children) ? vnode.componentOptions :
|
|
299
340
|
(!vnode.data && (vnode.tag === 'e-markersettings' || vnode.tag === 'e-markersetting')) ? vnode : vnode.data;
|
|
300
341
|
return vnode.componentInstance ? vnode.componentInstance : slot;
|
|
301
342
|
}
|
|
302
|
-
|
|
343
|
+
/**
|
|
344
|
+
* Get the Vue3 slot template from the root or current Vue component.
|
|
345
|
+
*
|
|
346
|
+
* @param {any} vueInstance - represents parent Vue instance.
|
|
347
|
+
* @param {any} templateElement - represents component property value
|
|
348
|
+
* @param {any} root - represents root Vue instance
|
|
349
|
+
* @returns {any} slot template instance
|
|
350
|
+
*/
|
|
303
351
|
function getCurrentVueSlot(vueInstance, templateElement, root) {
|
|
304
352
|
if (!vueInstance && !(root && root.vueInstance)) {
|
|
305
353
|
return undefined;
|
|
@@ -307,6 +355,13 @@ function getCurrentVueSlot(vueInstance, templateElement, root) {
|
|
|
307
355
|
var slots = (root && root.vueInstance) ? root.vueInstance.$slots : vueInstance.$slots;
|
|
308
356
|
return getChildVueSlot(slots, templateElement);
|
|
309
357
|
}
|
|
358
|
+
/**
|
|
359
|
+
* Get the Vue3 nested slot template from the root or current Vue component.
|
|
360
|
+
*
|
|
361
|
+
* @param {any} slots - represents slot instance.
|
|
362
|
+
* @param {any} templateElement - represents component property value
|
|
363
|
+
* @returns {any} nested template Vue instance
|
|
364
|
+
*/
|
|
310
365
|
function getChildVueSlot(slots, templateElement) {
|
|
311
366
|
if (slots && slots["" + templateElement]) {
|
|
312
367
|
return slots;
|
package/tslint.json
ADDED
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
{
|
|
2
|
+
"rules": {
|
|
3
|
+
"chai-vague-errors": true,
|
|
4
|
+
"use-isnan": true,
|
|
5
|
+
"missing-jsdoc": true,
|
|
6
|
+
"missing-optional-annotation": true,
|
|
7
|
+
"no-backbone-get-set-outside-model": true,
|
|
8
|
+
"no-banned-terms": true,
|
|
9
|
+
"no-constant-condition": true,
|
|
10
|
+
"no-control-regex": true,
|
|
11
|
+
"no-cookies": true,
|
|
12
|
+
"no-delete-expression": true,
|
|
13
|
+
"no-document-write": true,
|
|
14
|
+
"no-document-domain": true,
|
|
15
|
+
"no-disable-auto-sanitization": true,
|
|
16
|
+
"no-duplicate-case": true,
|
|
17
|
+
"no-duplicate-parameter-names": true,
|
|
18
|
+
"no-empty-interfaces": true,
|
|
19
|
+
"no-exec-script": true,
|
|
20
|
+
"no-function-constructor-with-string-args": true,
|
|
21
|
+
"no-function-expression": true,
|
|
22
|
+
"no-invalid-regexp": true,
|
|
23
|
+
"no-for-in": true,
|
|
24
|
+
"member-access": true,
|
|
25
|
+
"no-multiline-string": true,
|
|
26
|
+
"no-multiple-var-decl": true,
|
|
27
|
+
"no-unnecessary-bind": true,
|
|
28
|
+
"no-unnecessary-semicolons": true,
|
|
29
|
+
"no-octal-literal": true,
|
|
30
|
+
"no-regex-spaces": true,
|
|
31
|
+
"no-sparse-arrays": true,
|
|
32
|
+
"no-string-based-set-immediate": true,
|
|
33
|
+
"no-string-based-set-interval": true,
|
|
34
|
+
"no-unused-imports": true,
|
|
35
|
+
"no-with-statement": true,
|
|
36
|
+
"prefer-array-literal": true,
|
|
37
|
+
"promise-must-complete": false,
|
|
38
|
+
"react-no-dangerous-html": true,
|
|
39
|
+
"use-named-parameter": true,
|
|
40
|
+
"valid-typeof": true,
|
|
41
|
+
"max-func-body-length": [true, 100, {
|
|
42
|
+
"ignore-parameters-to-function-regex": "describe"
|
|
43
|
+
}],
|
|
44
|
+
"class-name": true,
|
|
45
|
+
"curly": true,
|
|
46
|
+
"eofline": false,
|
|
47
|
+
"forin": true,
|
|
48
|
+
"indent": [
|
|
49
|
+
true,
|
|
50
|
+
"spaces"
|
|
51
|
+
],
|
|
52
|
+
"label-position": true,
|
|
53
|
+
"max-line-length": [true, 140],
|
|
54
|
+
"no-arg": true,
|
|
55
|
+
"no-console": [true,
|
|
56
|
+
"debug",
|
|
57
|
+
"info",
|
|
58
|
+
"log",
|
|
59
|
+
"time",
|
|
60
|
+
"timeEnd",
|
|
61
|
+
"trace"
|
|
62
|
+
],
|
|
63
|
+
"no-construct": true,
|
|
64
|
+
"no-parameter-properties": true,
|
|
65
|
+
"no-debugger": true,
|
|
66
|
+
"no-duplicate-variable": true,
|
|
67
|
+
"no-empty": true,
|
|
68
|
+
"no-eval": true,
|
|
69
|
+
"no-string-literal": true,
|
|
70
|
+
"no-switch-case-fall-through": true,
|
|
71
|
+
"trailing-comma": true,
|
|
72
|
+
"no-trailing-whitespace": true,
|
|
73
|
+
"no-unused-expression": true,
|
|
74
|
+
"no-use-before-declare": false,
|
|
75
|
+
"no-var-requires": true,
|
|
76
|
+
"one-line": [true,
|
|
77
|
+
"check-open-brace",
|
|
78
|
+
"check-catch",
|
|
79
|
+
"check-else",
|
|
80
|
+
"check-whitespace"
|
|
81
|
+
],
|
|
82
|
+
"no-any": true,
|
|
83
|
+
"no-conditional-assignment": true,
|
|
84
|
+
"no-angle-bracket-type-assertion": false,
|
|
85
|
+
"align": [true, "parameters", "arguments", "statements"],
|
|
86
|
+
"no-empty-line-after-opening-brace": false,
|
|
87
|
+
"typedef-whitespace": [false],
|
|
88
|
+
"ban": true,
|
|
89
|
+
"quotemark": [true, "single"],
|
|
90
|
+
"semicolon": true,
|
|
91
|
+
"triple-equals": [true, "allow-null-check"],
|
|
92
|
+
"typedef": [true,
|
|
93
|
+
"call-signature",
|
|
94
|
+
"parameter",
|
|
95
|
+
"property-declaration",
|
|
96
|
+
"variable-declaration",
|
|
97
|
+
"arrow-parameter",
|
|
98
|
+
"member-variable-declaration"],
|
|
99
|
+
"variable-name": true,
|
|
100
|
+
"whitespace": [true,
|
|
101
|
+
"check-branch",
|
|
102
|
+
"check-decl",
|
|
103
|
+
"check-operator",
|
|
104
|
+
"check-separator",
|
|
105
|
+
"check-type"
|
|
106
|
+
],
|
|
107
|
+
"jsdoc-format": true,
|
|
108
|
+
"no-var-keyword": true,
|
|
109
|
+
"radix": true
|
|
110
|
+
}
|
|
111
|
+
}
|