@syncfusion/ej2-vue-documenteditor 20.4.54 → 21.1.36

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 (71) hide show
  1. package/CHANGELOG.md +208 -0
  2. package/README.md +1 -1
  3. package/dist/ej2-vue-documenteditor.umd.min.js +2 -2
  4. package/dist/ej2-vue-documenteditor.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-vue-documenteditor.es2015.js +240 -282
  6. package/dist/es6/ej2-vue-documenteditor.es2015.js.map +1 -1
  7. package/dist/es6/ej2-vue-documenteditor.es5.js +261 -313
  8. package/dist/es6/ej2-vue-documenteditor.es5.js.map +1 -1
  9. package/dist/global/ej2-vue-documenteditor.min.js +2 -2
  10. package/package.json +11 -10
  11. package/src/document-editor/documenteditor.component.d.ts +3 -50
  12. package/src/document-editor/documenteditor.component.js +168 -197
  13. package/src/document-editor-container/documenteditorcontainer.component.d.ts +3 -26
  14. package/src/document-editor-container/documenteditorcontainer.component.js +96 -125
  15. package/styles/bootstrap-dark.css +167 -58
  16. package/styles/bootstrap.css +167 -54
  17. package/styles/bootstrap4.css +185 -65
  18. package/styles/bootstrap5-dark.css +187 -74
  19. package/styles/bootstrap5.css +187 -74
  20. package/styles/document-editor/bootstrap-dark.css +13 -2
  21. package/styles/document-editor/bootstrap.css +17 -2
  22. package/styles/document-editor/bootstrap4.css +23 -4
  23. package/styles/document-editor/bootstrap5-dark.css +32 -17
  24. package/styles/document-editor/bootstrap5.css +32 -17
  25. package/styles/document-editor/fabric-dark.css +13 -2
  26. package/styles/document-editor/fabric.css +17 -2
  27. package/styles/document-editor/fluent-dark.css +47 -27
  28. package/styles/document-editor/fluent.css +47 -27
  29. package/styles/document-editor/highcontrast-light.css +5 -0
  30. package/styles/document-editor/highcontrast.css +13 -2
  31. package/styles/document-editor/material-dark.css +13 -2
  32. package/styles/document-editor/material.css +13 -2
  33. package/styles/document-editor/material3-dark.css +3971 -0
  34. package/styles/document-editor/material3-dark.scss +2 -0
  35. package/styles/document-editor/material3.css +4027 -0
  36. package/styles/document-editor/material3.scss +2 -0
  37. package/styles/document-editor/tailwind-dark.css +29 -17
  38. package/styles/document-editor/tailwind.css +32 -17
  39. package/styles/document-editor-container/bootstrap-dark.css +154 -56
  40. package/styles/document-editor-container/bootstrap.css +150 -52
  41. package/styles/document-editor-container/bootstrap4.css +162 -61
  42. package/styles/document-editor-container/bootstrap5-dark.css +155 -57
  43. package/styles/document-editor-container/bootstrap5.css +155 -57
  44. package/styles/document-editor-container/fabric-dark.css +154 -56
  45. package/styles/document-editor-container/fabric.css +154 -56
  46. package/styles/document-editor-container/fluent-dark.css +159 -64
  47. package/styles/document-editor-container/fluent.css +159 -64
  48. package/styles/document-editor-container/highcontrast-light.css +154 -56
  49. package/styles/document-editor-container/highcontrast.css +154 -56
  50. package/styles/document-editor-container/material-dark.css +159 -61
  51. package/styles/document-editor-container/material.css +154 -55
  52. package/styles/document-editor-container/material3-dark.css +2178 -0
  53. package/styles/document-editor-container/material3-dark.scss +2 -0
  54. package/styles/document-editor-container/material3.css +2234 -0
  55. package/styles/document-editor-container/material3.scss +2 -0
  56. package/styles/document-editor-container/tailwind-dark.css +153 -55
  57. package/styles/document-editor-container/tailwind.css +153 -55
  58. package/styles/fabric-dark.css +167 -58
  59. package/styles/fabric.css +171 -58
  60. package/styles/fluent-dark.css +206 -91
  61. package/styles/fluent.css +206 -91
  62. package/styles/highcontrast-light.css +159 -56
  63. package/styles/highcontrast.css +167 -58
  64. package/styles/material-dark.css +172 -63
  65. package/styles/material.css +167 -57
  66. package/styles/material3-dark.css +6150 -0
  67. package/styles/material3-dark.scss +3 -0
  68. package/styles/material3.css +6261 -0
  69. package/styles/material3.scss +3 -0
  70. package/styles/tailwind-dark.css +182 -72
  71. package/styles/tailwind.css +185 -72
@@ -399,6 +399,21 @@
399
399
  font-family: "e-icons";
400
400
  }
401
401
 
402
+ .e-de-e-paragraph-style-mark::before {
403
+ content: "\e353";
404
+ font-family: "e-icons";
405
+ }
406
+
407
+ .e-de-e-character-style-mark::before {
408
+ content: "\e98e";
409
+ font-family: "e-icons";
410
+ }
411
+
412
+ .e-de-e-linked-style-mark::before {
413
+ content: "\e992";
414
+ font-family: "e-icons";
415
+ }
416
+
402
417
  .e-de-ctnr-columns::before {
403
418
  content: "\e955";
404
419
  font-family: "e-icons";
@@ -531,8 +546,48 @@
531
546
  height: 100%;
532
547
  }
533
548
 
549
+ .e-de-prop-pane .e-de-ctnr-group-btn.e-btn-group:not(.e-outline) {
550
+ box-shadow: none;
551
+ height: 34px;
552
+ }
553
+ .e-de-prop-pane .e-de-ctnr-group-btn.e-btn-group:not(.e-outline):focus {
554
+ box-shadow: none;
555
+ }
556
+ .e-de-prop-pane .e-de-ctnr-group-btn.e-btn-group:not(.e-outline):active {
557
+ box-shadow: none;
558
+ }
559
+ .e-de-prop-pane .e-de-ctnr-group-btn.e-btn-group:not(.e-outline):hover {
560
+ box-shadow: none;
561
+ }
562
+
563
+ .e-de-ctnr-group-btn-middle button {
564
+ border-radius: 0px;
565
+ }
566
+
567
+ .de-tbl-fill-clr .e-dropdown-btn.e-btn {
568
+ box-shadow: none;
569
+ }
570
+
571
+ .e-de-prop-pane .e-de-ctnr-group-btn button,
572
+ .e-de-ctn .e-de-status-bar button {
573
+ box-shadow: none;
574
+ height: 34px;
575
+ }
576
+ .e-de-prop-pane .e-de-ctnr-group-btn button:focus,
577
+ .e-de-ctn .e-de-status-bar button:focus {
578
+ box-shadow: none;
579
+ }
580
+ .e-de-prop-pane .e-de-ctnr-group-btn button:active,
581
+ .e-de-ctn .e-de-status-bar button:active {
582
+ box-shadow: none;
583
+ }
584
+ .e-de-prop-pane .e-de-ctnr-group-btn button:hover,
585
+ .e-de-ctn .e-de-status-bar button:hover {
586
+ box-shadow: none;
587
+ }
588
+
534
589
  .e-de-statusbar-pageweb {
535
- background-color: #f8f8f8;
590
+ background: #f8f8f8;
536
591
  border: 0;
537
592
  box-shadow: none;
538
593
  float: right;
@@ -562,12 +617,25 @@
562
617
  margin-top: -6px;
563
618
  }
564
619
 
620
+ .e-listview .e-list-icon {
621
+ height: 24px;
622
+ width: 16px;
623
+ margin-right: 12px;
624
+ }
625
+
626
+ .e-de-listview-icon {
627
+ height: auto;
628
+ width: auto;
629
+ line-height: 22px;
630
+ margin-right: 12px;
631
+ }
632
+
565
633
  .e-de-linespacing {
566
634
  margin-top: 6px;
567
635
  }
568
636
 
569
637
  .e-de-statusbar-zoom {
570
- background-color: #f8f8f8;
638
+ background: #f8f8f8;
571
639
  border: 0;
572
640
  color: #333;
573
641
  float: right;
@@ -630,14 +698,22 @@
630
698
  .e-de-statusbar-separator {
631
699
  border-left: 1px solid #ccc;
632
700
  height: 16px;
633
- margin-left: 15.5;
701
+ margin-left: 7.5px;
702
+ margin-right: 7.5px;
703
+ margin-top: 10px;
704
+ }
705
+
706
+ .e-bigger .e-de-statusbar-separator {
707
+ border-left: 1px solid #ccc;
708
+ height: 16px;
709
+ margin-left: 7.5px;
710
+ margin-right: 7.5px;
634
711
  margin-top: 10px;
635
712
  }
636
713
 
637
714
  .e-de-statusbar-spellcheck {
638
715
  border-radius: 2px;
639
716
  font-weight: 400;
640
- margin-left: 7.5px;
641
717
  }
642
718
 
643
719
  .e-de-ctn {
@@ -650,7 +726,6 @@
650
726
 
651
727
  .e-bigger .e-de-statusbar-spellcheck {
652
728
  border-radius: 2px;
653
- margin-left: 7.5px;
654
729
  }
655
730
 
656
731
  .e-de-ctnr-toolbar {
@@ -675,7 +750,7 @@
675
750
 
676
751
  .e-de-tool-ctnr-properties-pane,
677
752
  .e-de-ctnr-properties-pane {
678
- background-color: #f8f8f8;
753
+ background: #f8f8f8;
679
754
  border-bottom: 1px solid #ccc;
680
755
  border-top: 1px solid #ccc;
681
756
  }
@@ -785,7 +860,7 @@
785
860
  margin: 0 5.5px;
786
861
  }
787
862
  .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-de-toolbar-btn-start {
788
- margin-left: 12px;
863
+ margin-left: 12px !important;
789
864
  margin-right: 6px;
790
865
  }
791
866
  .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-de-toolbar-btn-middle {
@@ -801,20 +876,23 @@
801
876
  }
802
877
 
803
878
  .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn {
879
+ -ms-flex-direction: column;
880
+ flex-direction: column;
881
+ height: calc(100% - 10px);
804
882
  padding: 0 1px;
805
- padding-bottom: 6px;
883
+ padding-bottom: 5px;
806
884
  }
807
885
  .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn:focus {
808
886
  padding: 0;
809
- padding-bottom: 6px;
887
+ padding-bottom: 5px;
810
888
  }
811
889
  .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn:active {
812
890
  padding: 0;
813
- padding-bottom: 6px;
891
+ padding-bottom: 5px;
814
892
  }
815
893
  .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn:hover {
816
894
  padding: 0;
817
- padding-bottom: 6px;
895
+ padding-bottom: 5px;
818
896
  }
819
897
 
820
898
  .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn .e-tbar-btn-text {
@@ -843,7 +921,7 @@
843
921
  }
844
922
 
845
923
  .e-de-ctnr-properties-pane-btn .e-btn {
846
- background-color: #f8f8f8;
924
+ background: #f8f8f8;
847
925
  border-radius: 0;
848
926
  box-shadow: none;
849
927
  color: #317ab9;
@@ -885,6 +963,7 @@
885
963
  .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item button.e-btn.e-tbtn-txt .e-icons.e-btn-icon,
886
964
  .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn.e-tbtn-txt .e-icons.e-btn-icon {
887
965
  padding: 0 !important;
966
+ min-height: 16px;
888
967
  }
889
968
 
890
969
  .e-de-hdr-ftr-frst-div {
@@ -907,6 +986,7 @@
907
986
  }
908
987
 
909
988
  .e-de-review-pane {
989
+ background: #f8f8f8;
910
990
  border-left: 1px solid #e6e6e6;
911
991
  height: 100%;
912
992
  min-height: 200px;
@@ -924,34 +1004,6 @@
924
1004
  width: 272px;
925
1005
  }
926
1006
 
927
- .e-de-ctnr-group-btn.e-btn-group:not(.e-outline) {
928
- box-shadow: none;
929
- height: 34px;
930
- }
931
- .e-de-ctnr-group-btn.e-btn-group:not(.e-outline):focus {
932
- box-shadow: none;
933
- }
934
- .e-de-ctnr-group-btn.e-btn-group:not(.e-outline):active {
935
- box-shadow: none;
936
- }
937
- .e-de-ctnr-group-btn.e-btn-group:not(.e-outline):hover {
938
- box-shadow: none;
939
- }
940
-
941
- .e-de-ctnr-group-btn button {
942
- box-shadow: none;
943
- height: 34px;
944
- }
945
- .e-de-ctnr-group-btn button:focus {
946
- box-shadow: none;
947
- }
948
- .e-de-ctnr-group-btn button:active {
949
- box-shadow: none;
950
- }
951
- .e-de-ctnr-group-btn button:hover {
952
- box-shadow: none;
953
- }
954
-
955
1007
  .e-de-property-div-padding {
956
1008
  border-bottom: 0.5px solid #e0e0e0;
957
1009
  padding: 12.5px;
@@ -1076,7 +1128,7 @@
1076
1128
  }
1077
1129
 
1078
1130
  .e-de-list-header-presetmenu .e-de-list-line {
1079
- border-bottom: 1px solid #ccc;
1131
+ border-bottom: 1px solid #ccc !important;
1080
1132
  margin-left: 5px;
1081
1133
  width: 100%;
1082
1134
  }
@@ -1145,10 +1197,10 @@
1145
1197
  }
1146
1198
 
1147
1199
  .e-de-list-container {
1148
- background: #f8f8f8;
1149
1200
  border: 1px solid #ccc;
1150
1201
  border-radius: 2px;
1151
1202
  box-shadow: 0 0 14px rgba(0, 0, 0, 0.2);
1203
+ background: #f8f8f8;
1152
1204
  box-sizing: border-box;
1153
1205
  display: inline-block;
1154
1206
  line-height: normal;
@@ -1240,8 +1292,8 @@
1240
1292
  border: 1px solid #ccc;
1241
1293
  color: #333;
1242
1294
  height: 129px;
1243
- margin-left: 78px;
1244
1295
  width: 94px;
1296
+ margin-left: 78px;
1245
1297
  }
1246
1298
 
1247
1299
  .e-de-toc-template1.e-de-rtl {
@@ -1296,7 +1348,7 @@
1296
1348
  }
1297
1349
 
1298
1350
  .e-de-status-bar {
1299
- background-color: #f8f8f8;
1351
+ background: #f8f8f8;
1300
1352
  display: -ms-flexbox;
1301
1353
  display: flex;
1302
1354
  padding-top: 2.5px;
@@ -1421,7 +1473,7 @@
1421
1473
  }
1422
1474
 
1423
1475
  .e-de-grp-btn-ctnr .e-de-ctnr-group-btn {
1424
- height: 38px !important;
1476
+ height: 36px !important;
1425
1477
  }
1426
1478
 
1427
1479
  .e-bigger .e-de-grp-btn-ctnr .e-de-ctnr-group-btn {
@@ -1429,8 +1481,8 @@
1429
1481
  }
1430
1482
 
1431
1483
  .e-de-grp-btn-ctnr .e-de-ctnr-group-btn > button {
1432
- height: 38px;
1433
1484
  width: 38px;
1485
+ height: 38px;
1434
1486
  }
1435
1487
 
1436
1488
  .e-bigger .e-de-grp-btn-ctnr .e-de-ctnr-group-btn > button {
@@ -1442,6 +1494,18 @@
1442
1494
  width: 70px;
1443
1495
  }
1444
1496
 
1497
+ .e-rtl .e-listview .e-list-icon {
1498
+ height: 24px;
1499
+ width: 16px;
1500
+ margin-left: 12px;
1501
+ }
1502
+ .e-rtl .e-de-listview-icon {
1503
+ height: auto;
1504
+ width: auto;
1505
+ line-height: 22px;
1506
+ margin-left: 12px;
1507
+ }
1508
+
1445
1509
  .e-bigger .de-split-button > div:first-child {
1446
1510
  margin-right: 16px;
1447
1511
  }
@@ -1559,11 +1623,10 @@
1559
1623
  height: 82px;
1560
1624
  }
1561
1625
  .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-de-separator {
1562
- height: 25px;
1563
1626
  margin: 0 7.5px;
1564
1627
  }
1565
1628
  .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-de-toolbar-btn-start {
1566
- margin-left: 16px;
1629
+ margin-left: 16px !important;
1567
1630
  margin-right: 8px;
1568
1631
  }
1569
1632
  .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-de-toolbar-btn-middle {
@@ -1611,7 +1674,7 @@
1611
1674
  width: 75px;
1612
1675
  }
1613
1676
  .e-bigger .e-de-ctnr-properties-pane-btn .e-btn {
1614
- background-color: #f8f8f8;
1677
+ background: #f8f8f8;
1615
1678
  border-radius: 0;
1616
1679
  box-shadow: none;
1617
1680
  min-height: 100%;
@@ -1639,7 +1702,7 @@
1639
1702
  }
1640
1703
  .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn-text {
1641
1704
  display: table;
1642
- font-size: 12px;
1705
+ font-size: 12px !important;
1643
1706
  margin: 0 6px;
1644
1707
  padding: 0;
1645
1708
  white-space: normal;
@@ -1661,6 +1724,19 @@
1661
1724
  .e-bigger .e-de-ctnr-group-btn.e-btn-group:not(.e-outline):hover {
1662
1725
  box-shadow: none;
1663
1726
  }
1727
+ .e-bigger .e-de-status-bar button {
1728
+ height: 38px;
1729
+ box-shadow: none;
1730
+ }
1731
+ .e-bigger .e-de-status-bar button:focus {
1732
+ box-shadow: none;
1733
+ }
1734
+ .e-bigger .e-de-status-bar button:active {
1735
+ box-shadow: none;
1736
+ }
1737
+ .e-bigger .e-de-status-bar button:hover {
1738
+ box-shadow: none;
1739
+ }
1664
1740
  .e-bigger .e-de-ctnr-group-btn button {
1665
1741
  box-shadow: none;
1666
1742
  height: 38px;
@@ -1781,18 +1857,18 @@
1781
1857
  margin-left: 10px;
1782
1858
  }
1783
1859
  .e-bigger .e-de-status-bar {
1784
- background-color: #f8f8f8;
1860
+ background: #f8f8f8;
1785
1861
  display: -ms-flexbox;
1786
1862
  display: flex;
1787
1863
  padding-top: 2.5px;
1788
1864
  width: 100%;
1789
1865
  }
1790
1866
  .e-bigger .e-de-statusbar-zoom {
1791
- background-color: #f8f8f8;
1792
1867
  border: 0;
1793
1868
  color: #333;
1794
1869
  float: right;
1795
1870
  height: 34px;
1871
+ background-color: #f8f8f8;
1796
1872
  }
1797
1873
  .e-bigger .e-de-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn-text {
1798
1874
  line-height: 25px;
@@ -1802,6 +1878,28 @@
1802
1878
  height: 0;
1803
1879
  line-height: 0;
1804
1880
  }
1881
+ .e-bigger .e-listview .e-list-icon {
1882
+ height: 24px;
1883
+ width: 16px;
1884
+ margin-right: 16px;
1885
+ }
1886
+ .e-bigger .e-de-listview-icon {
1887
+ height: auto;
1888
+ width: auto;
1889
+ line-height: 22px;
1890
+ margin-right: 16px;
1891
+ }
1892
+ .e-bigger .e-rtl .e-listview .e-list-icon {
1893
+ height: 24px;
1894
+ width: 16px;
1895
+ margin-left: 16px;
1896
+ }
1897
+ .e-bigger .e-rtl .e-de-listview-icon {
1898
+ height: auto;
1899
+ width: auto;
1900
+ line-height: 22px;
1901
+ margin-left: 16px;
1902
+ }
1805
1903
 
1806
1904
  .e-de-ctn .e-de-bzr-button {
1807
1905
  font-size: 12px;