@syncfusion/ej2-angular-base 19.3.55 → 19.3.60-13828

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.
Files changed (52) hide show
  1. package/.github/PULL_REQUEST_TEMPLATE/bug.md +60 -0
  2. package/.github/PULL_REQUEST_TEMPLATE/feature.md +37 -0
  3. package/CHANGELOG.md +80 -11
  4. package/dist/ej2-angular-base.umd.min.js +1 -10
  5. package/dist/ej2-angular-base.umd.min.js.map +1 -1
  6. package/dist/es6/ej2-angular-base.es2015.js +122 -33
  7. package/dist/es6/ej2-angular-base.es2015.js.map +1 -1
  8. package/dist/es6/ej2-angular-base.es5.js +130 -36
  9. package/dist/es6/ej2-angular-base.es5.js.map +1 -1
  10. package/dist/global/ej2-angular-base.min.js +1 -10
  11. package/dist/global/ej2-angular-base.min.js.map +1 -1
  12. package/dist/global/index.d.ts +0 -9
  13. package/package.json +20 -26
  14. package/schematics/generators/component-builder.js +14 -14
  15. package/schematics/generators/template/schema.json +1 -1
  16. package/schematics/ng-add/index.js +2 -2
  17. package/schematics/ng-add/schema.json +1 -1
  18. package/schematics/ng-add/theme.js +5 -4
  19. package/schematics/utils/get-project.js +3 -0
  20. package/schematics/utils/helpers/helpers.d.ts +1 -1
  21. package/schematics/utils/project-style-file.js +2 -2
  22. package/src/complex-array-base.js +14 -5
  23. package/src/component-base.js +76 -19
  24. package/src/form-base.d.ts +2 -1
  25. package/src/form-base.js +12 -3
  26. package/src/template.js +7 -2
  27. package/src/util.js +21 -7
  28. package/styles/bootstrap-dark.scss +1 -1
  29. package/styles/bootstrap.scss +1 -1
  30. package/styles/bootstrap4.scss +1 -1
  31. package/styles/bootstrap5-dark.scss +1 -1
  32. package/styles/bootstrap5.scss +1 -1
  33. package/styles/fabric-dark.scss +1 -1
  34. package/styles/fabric.scss +1 -1
  35. package/styles/fluent-dark.css +0 -0
  36. package/styles/fluent-dark.scss +1 -0
  37. package/styles/fluent.css +0 -0
  38. package/styles/fluent.scss +1 -0
  39. package/styles/highcontrast-light.scss +1 -1
  40. package/styles/highcontrast.scss +1 -1
  41. package/styles/material-dark.css +0 -1
  42. package/styles/material-dark.scss +1 -1
  43. package/styles/material.css +0 -1
  44. package/styles/material.scss +1 -1
  45. package/styles/material3-dark.css +54 -0
  46. package/styles/material3-dark.scss +1 -0
  47. package/styles/material3.css +110 -0
  48. package/styles/material3.scss +1 -0
  49. package/styles/tailwind-dark.css +0 -1
  50. package/styles/tailwind-dark.scss +1 -1
  51. package/styles/tailwind.css +0 -1
  52. package/styles/tailwind.scss +1 -1
@@ -8,7 +8,7 @@ import { EventEmitter } from '@angular/core';
8
8
  function applyMixins(derivedClass, baseClass) {
9
9
  baseClass.forEach(baseClass => {
10
10
  Object.getOwnPropertyNames(baseClass.prototype).forEach(name => {
11
- if (!derivedClass.prototype.hasOwnProperty(name) || baseClass.isFormBase) {
11
+ if (!derivedClass.prototype.hasOwnProperty(name) || (baseClass.isFormBase && name !== 'constructor')) {
12
12
  derivedClass.prototype[name] = baseClass.prototype[name];
13
13
  }
14
14
  });
@@ -50,15 +50,27 @@ function clearTemplate(_this, templateNames, index) {
50
50
  let regProperties = templateNames && templateNames.filter((val) => {
51
51
  return (/\./g.test(val) ? false : true);
52
52
  });
53
+ let tabaccordionTemp = /tab|accordion|toolbar/.test(_this.getModuleName());
53
54
  for (let registeredTemplate of (regProperties && regProperties || regTemplates)) {
54
55
  /* istanbul ignore next */
55
56
  if (index && index.length) {
56
57
  for (let e = 0; e < index.length; e++) {
57
- for (let m = 0; m < _this.registeredTemplate.template.length; m++) {
58
- let value = _this.registeredTemplate.template[m].rootNodes[0];
59
- if (value === index[e]) {
60
- let rt = _this.registeredTemplate[registeredTemplate];
61
- rt[m].destroy();
58
+ if (tabaccordionTemp) {
59
+ for (let m = 0; m < _this.registeredTemplate[registeredTemplate].length; m++) {
60
+ let value = _this.registeredTemplate[registeredTemplate][m];
61
+ if (value && value === index[e]) {
62
+ value.destroy();
63
+ _this.registeredTemplate[registeredTemplate].splice(m, 1);
64
+ }
65
+ }
66
+ }
67
+ else {
68
+ for (let m = 0; m < _this.registeredTemplate.template.length; m++) {
69
+ let value = _this.registeredTemplate.template[m].rootNodes[0];
70
+ if (value === index[e]) {
71
+ let rt = _this.registeredTemplate[registeredTemplate];
72
+ rt[m].destroy();
73
+ }
62
74
  }
63
75
  }
64
76
  }
@@ -80,7 +92,9 @@ function clearTemplate(_this, templateNames, index) {
80
92
  }
81
93
  }
82
94
  }
83
- delete _this.registeredTemplate[registeredTemplate];
95
+ if (!tabaccordionTemp || !index) {
96
+ delete _this.registeredTemplate[registeredTemplate];
97
+ }
84
98
  }
85
99
  }
86
100
  for (let tagObject of _this.tagObjects) {
@@ -137,8 +151,14 @@ class ComplexBase {
137
151
  let templateProperties = Object.keys(this);
138
152
  for (let i = 0; i < templateProperties.length; i++) {
139
153
  var tempProp = getValue(templateProperties[i], this);
140
- if (typeof tempProp === 'object' && tempProp.elementRef && !getValue(templateProperties[i].indexOf('Ref') !== -1 ? templateProperties[i] : templateProperties[i] + 'Ref', this)) {
141
- setValue(templateProperties[i].indexOf('Ref') !== -1 ? templateProperties[i] : templateProperties[i] + 'Ref', tempProp, this);
154
+ if (typeof tempProp === 'object' && tempProp && tempProp.elementRef) {
155
+ if (!getValue(templateProperties[i].indexOf('Ref') !== -1 ? templateProperties[i] : templateProperties[i] + 'Ref', this)) {
156
+ setValue(templateProperties[i].indexOf('Ref') !== -1 ? templateProperties[i] : templateProperties[i] + 'Ref', tempProp, this);
157
+ }
158
+ if (getValue("viewContainerRef", this) && !getValue("_viewContainerRef", tempProp.elementRef.nativeElement) && !getValue("propName", tempProp.elementRef.nativeElement)) {
159
+ setValue("_viewContainerRef", getValue("viewContainerRef", this), tempProp.elementRef.nativeElement);
160
+ setValue("propName", templateProperties[i].replace("Ref", ''), tempProp.elementRef.nativeElement);
161
+ }
142
162
  }
143
163
  }
144
164
  templateProperties = Object.keys(this);
@@ -156,7 +176,7 @@ class ComplexBase {
156
176
  if (this.directivePropList) {
157
177
  for (let k = 0; k < this.directivePropList.length; k++) {
158
178
  let dirPropName = this.directivePropList[k];
159
- if (propList.indexOf(dirPropName) !== -1 && getValue(dirPropName, this)) {
179
+ if (propList.indexOf(dirPropName) !== -1 && (getValue(dirPropName, this) === false || getValue(dirPropName, this))) {
160
180
  setValue(dirPropName, getValue(dirPropName, this), this.propCollection);
161
181
  }
162
182
  }
@@ -281,9 +301,12 @@ class ArrayBase {
281
301
  this.list[i].propCollection.dataSource = this.list[i].dataSource;
282
302
  this.list[i].hasChanges = true;
283
303
  }
284
- isSourceChanged = (JSON.stringify(this.list[i].propCollection.dataSource) !==
285
- JSON.stringify(childrenDataSource[i].propCollection.dataSource));
304
+ if (this.list[i].property !== "series") {
305
+ isSourceChanged = (JSON.stringify(this.list[i].propCollection.dataSource) !==
306
+ JSON.stringify(childrenDataSource[i].propCollection.dataSource));
307
+ }
286
308
  }
309
+ isSourceChanged = this.list[i].hasChanges !== childrenDataSource[i].hasChanges;
287
310
  }
288
311
  }
289
312
  this.hasNewChildren = (this.list.length !== this.children.length || isSourceChanged) ? true : null;
@@ -397,6 +420,19 @@ class ComponentBase {
397
420
  tempOnThis.tagObjects.push(tagObject);
398
421
  }
399
422
  let complexTemplates = Object.keys(tempOnThis);
423
+ for (let i = 0; i < complexTemplates.length; i++) {
424
+ var compProp = getValue(complexTemplates[i], tempOnThis);
425
+ if (typeof compProp === 'object' && compProp && compProp.elementRef) {
426
+ if (typeof compProp === 'object' && compProp && compProp.elementRef && complexTemplates[i].indexOf('_') !== -1 && complexTemplates[i].indexOf('Ref') === -1) {
427
+ setValue(complexTemplates[i] + 'Ref', compProp, tempOnThis);
428
+ }
429
+ if (tempOnThis.viewContainerRef && !getValue("_viewContainerRef", compProp.elementRef.nativeElement) && !getValue("propName", compProp.elementRef.nativeElement)) {
430
+ setValue("_viewContainerRef", tempOnThis.viewContainerRef, compProp.elementRef.nativeElement);
431
+ setValue("propName", complexTemplates[i].replace("Ref", ''), compProp.elementRef.nativeElement);
432
+ }
433
+ }
434
+ }
435
+ complexTemplates = Object.keys(tempOnThis);
400
436
  complexTemplates = complexTemplates.filter((val) => {
401
437
  return /Ref$/i.test(val) && /\_/i.test(val);
402
438
  });
@@ -445,19 +481,28 @@ class ComponentBase {
445
481
  templateProperties = templateProperties.filter((val) => {
446
482
  return /Ref$/i.test(val);
447
483
  });
484
+ let ngtempRef = tempAfterViewThis.getModuleName() === 'DocumentEditor';
448
485
  for (let tempName of templateProperties) {
449
486
  let propName = tempName.replace('Ref', '');
450
487
  setValue(propName.replace('_', '.'), getValue(propName + 'Ref', tempAfterViewThis), tempAfterViewThis);
451
488
  }
452
489
  // Used setTimeout for template binding
453
490
  // Refer Link: https://github.com/angular/angular/issues/6005
454
- setTimeout(() => {
491
+ const appendToComponent = (tempAfterViewThis) => {
455
492
  /* istanbul ignore else */
456
- if (typeof window !== 'undefined' && document.body.contains(tempAfterViewThis.element)) {
493
+ if (typeof window !== 'undefined' && tempAfterViewThis.element || tempAfterViewThis.getModuleName().includes('btn')) {
457
494
  tempAfterViewThis.appendTo(tempAfterViewThis.element);
458
495
  tempAfterViewThis.ngEle.nativeElement.style.visibility = '';
459
496
  }
460
- });
497
+ };
498
+ if (!ngtempRef) {
499
+ setTimeout(() => {
500
+ appendToComponent(tempAfterViewThis);
501
+ });
502
+ }
503
+ else {
504
+ appendToComponent(tempAfterViewThis);
505
+ }
461
506
  }
462
507
  // tslint:disable-next-line:no-any
463
508
  ngOnDestroy(isTempRef) {
@@ -469,9 +514,26 @@ class ComponentBase {
469
514
  tempOnDestroyThis.destroy();
470
515
  tempOnDestroyThis.clearTemplate(null);
471
516
  // removing bounded events and tagobjects from component after destroy
472
- tempOnDestroyThis.ngBoundedEvents = {};
473
- tempOnDestroyThis.tagObjects = {};
474
- tempOnDestroyThis.ngEle = null;
517
+ setTimeout(function () {
518
+ for (let key of Object.keys(tempOnDestroyThis)) {
519
+ let value = tempOnDestroyThis[key];
520
+ if (value && /object/.test(typeof value) && Object.keys(value).length !== 0) {
521
+ if (/properties|changedProperties|childChangedProperties|oldProperties|moduleLoader/.test(key)) {
522
+ for (let propKey of Object.keys(tempOnDestroyThis[key])) {
523
+ let propValue = value[propKey];
524
+ if (propValue && /object/.test(typeof propValue) && Object.keys(propValue).length !== 0 && (propValue.parent || propValue.parentObj)) {
525
+ tempOnDestroyThis[key][propKey] = null;
526
+ }
527
+ }
528
+ }
529
+ else {
530
+ if (value.parent || value.parentObj) {
531
+ tempOnDestroyThis[key] = null;
532
+ }
533
+ }
534
+ }
535
+ }
536
+ });
475
537
  }
476
538
  });
477
539
  }
@@ -515,17 +577,30 @@ class ComponentBase {
515
577
  let childObj = getValue('child' + tag.substring(0, 1).toUpperCase() + tag.substring(1), tagObject.instance.list[h]);
516
578
  if (childObj) {
517
579
  let innerchildObj = tagObject.instance.list[h]['child' + tag.substring(0, 1).toUpperCase() + tag.substring(1)];
518
- if (innerchildObj) {
519
- for (let j = 0; j < innerchildObj.list.length; j++) {
520
- let innerTag = innerchildObj.list[0].tags[0];
521
- if (innerTag) {
522
- let innerchildTag = getValue('child' + innerTag.substring(0, 1).toUpperCase() + innerTag.substring(1), innerchildObj.list[j]);
523
- if (innerchildTag) {
524
- innerchildObj.list[j].tagObjects.push({ instance: innerchildTag, name: innerTag });
580
+ // Update the inner child tag objects
581
+ const updateChildTag = (innerchild) => {
582
+ let innerLevelTag = [];
583
+ if (innerchild) {
584
+ for (let j = 0; j < innerchild.list.length; j++) {
585
+ let innerTag = innerchild.list[0].tags[0];
586
+ if (innerTag) {
587
+ let innerchildTag = getValue('child' + innerTag.substring(0, 1).toUpperCase() + innerTag.substring(1), innerchild.list[j]);
588
+ if (innerchildTag) {
589
+ innerchild.list[j].tagObjects.push({ instance: innerchildTag, name: innerTag });
590
+ innerLevelTag.push(innerchildTag);
591
+ }
525
592
  }
526
593
  }
527
594
  }
528
- }
595
+ // check for inner level tag
596
+ if (innerLevelTag.length !== 0) {
597
+ for (let l = 0; l < innerLevelTag.length; l++) {
598
+ updateChildTag(innerLevelTag[l]);
599
+ }
600
+ }
601
+
602
+ };
603
+ updateChildTag(innerchildObj);
529
604
  tagObject.instance.list[h].tagObjects.push({ instance: childObj, name: tag });
530
605
  }
531
606
  }
@@ -538,7 +613,7 @@ class ComponentBase {
538
613
  }
539
614
  else {
540
615
  /* istanbul ignore next */
541
- if ((tempAfterContentThis[tagObject.name].length !== tagObject.instance.list.length) || (tempAfterContentThis.getModuleName() === 'diagram')) {
616
+ if ((tempAfterContentThis[tagObject.name].length !== tagObject.instance.list.length) || (/diagram|DashboardLayout/.test(tempAfterContentThis.getModuleName()))) {
542
617
  tempAfterContentThis[tagObject.name] = tagObject.instance.list;
543
618
  }
544
619
  for (let list of tagObject.instance.list) {
@@ -548,7 +623,7 @@ class ComponentBase {
548
623
  complexTemplates = complexTemplates.filter((val) => {
549
624
  return /Ref$/i.test(val);
550
625
  });
551
- if (curChild.properties && Object.keys(curChild.properties).length !== 0 && /chart/.test(tempAfterContentThis.getModuleName())) {
626
+ if (curChild.properties && Object.keys(curChild.properties).length !== 0) {
552
627
  for (let complexPropName of complexTemplates) {
553
628
  complexPropName = complexPropName.replace(/Ref/, '');
554
629
  curChild.properties[complexPropName] = !curChild.properties[complexPropName] ?
@@ -670,6 +745,7 @@ class FormBase {
670
745
  }
671
746
  }
672
747
  }
748
+ this.cdr.markForCheck();
673
749
  }
674
750
  registerOnChange(registerFunction) {
675
751
  this.propagateChange = registerFunction;
@@ -695,16 +771,21 @@ class FormBase {
695
771
  // Used setTimeout for template binding
696
772
  // Refer Link: https://github.com/angular/angular/issues/6005
697
773
  // Removed setTimeout, Because we have called markForCheck() method in Angular Template Compiler
698
- // setTimeout(() => {
699
774
  /* istanbul ignore else */
700
775
  if (typeof window !== 'undefined') {
701
- tempFormAfterViewThis.appendTo(tempFormAfterViewThis.element);
776
+ if ((tempFormAfterViewThis.getModuleName()).includes('dropdown')) {
777
+ setTimeout(() => {
778
+ tempFormAfterViewThis.appendTo(tempFormAfterViewThis.element);
779
+ });
780
+ }
781
+ else {
782
+ tempFormAfterViewThis.appendTo(tempFormAfterViewThis.element);
783
+ }
702
784
  let ele = tempFormAfterViewThis.inputElement || tempFormAfterViewThis.element;
703
785
  ele.addEventListener('focus', tempFormAfterViewThis.ngOnFocus.bind(tempFormAfterViewThis));
704
786
  ele.addEventListener('blur', tempFormAfterViewThis.ngOnBlur.bind(tempFormAfterViewThis));
705
787
  }
706
788
  this.isFormInit = false;
707
- // });
708
789
  }
709
790
  setDisabledState(disabled) {
710
791
  this.enabled = !disabled;
@@ -738,6 +819,7 @@ class FormBase {
738
819
  // When binding Html textbox value to syncfusion textbox, change event triggered dynamically.
739
820
  // To prevent change event, trigger change in component side based on `preventChange` value
740
821
  this.preventChange = this.isFormInit ? false : true;
822
+ this.cdr.markForCheck();
741
823
  if (value === null) {
742
824
  return;
743
825
  }
@@ -747,6 +829,7 @@ class FormBase {
747
829
  if (this.skipFromEvent !== true) {
748
830
  this.focus.emit(e);
749
831
  }
832
+ this.cdr.markForCheck();
750
833
  }
751
834
  ngOnBlur(e) {
752
835
  this.propagateTouch();
@@ -754,6 +837,7 @@ class FormBase {
754
837
  if (this.skipFromEvent !== true) {
755
838
  this.blur.emit(e);
756
839
  }
840
+ this.cdr.markForCheck();
757
841
  }
758
842
  }
759
843
  FormBase.isFormBase = true;
@@ -763,7 +847,7 @@ let stringCompiler = getTemplateEngine();
763
847
  * Angular Template Compiler
764
848
  */
765
849
  function compile(templateEle, helper) {
766
- if (typeof templateEle === 'string') {
850
+ if (typeof templateEle === 'string' || (typeof templateEle === 'function' && templateEle.prototype && templateEle.prototype.CSPTemplate)) {
767
851
  return stringCompiler(templateEle, helper);
768
852
  }
769
853
  else {
@@ -775,7 +859,12 @@ function compile(templateEle, helper) {
775
859
  /* istanbul ignore next */
776
860
  let conRef = contRef ? contRef : component.viewContainerRef;
777
861
  let viewRef = conRef.createEmbeddedView(templateEle, context);
778
- viewRef.markForCheck();
862
+ if (getValue('currentInstance.element.nodeName', conRef) === 'EJS-MENTION') {
863
+ viewRef.detectChanges();
864
+ }
865
+ else {
866
+ viewRef.markForCheck();
867
+ }
779
868
  /* istanbul ignore next */
780
869
  let viewCollection = (component && component.registeredTemplate) ?
781
870
  component.registeredTemplate : getValue('currentInstance.registeredTemplate', conRef);