@syncfusion/ej2-navigations 21.1.38 → 21.2.3

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 (86) hide show
  1. package/CHANGELOG.md +30 -0
  2. package/dist/ej2-navigations.min.js +2 -2
  3. package/dist/ej2-navigations.umd.min.js +2 -2
  4. package/dist/ej2-navigations.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-navigations.es2015.js +68 -54
  6. package/dist/es6/ej2-navigations.es2015.js.map +1 -1
  7. package/dist/es6/ej2-navigations.es5.js +68 -54
  8. package/dist/es6/ej2-navigations.es5.js.map +1 -1
  9. package/dist/global/ej2-navigations.min.js +2 -2
  10. package/dist/global/ej2-navigations.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +12 -15
  13. package/src/common/h-scroll.js +1 -0
  14. package/src/common/menu-base.d.ts +1 -0
  15. package/src/common/menu-base.js +26 -20
  16. package/src/common/v-scroll.js +1 -1
  17. package/src/tab/tab.d.ts +1 -0
  18. package/src/tab/tab.js +35 -28
  19. package/src/treeview/treeview.js +5 -5
  20. package/styles/bootstrap-dark.css +35 -26
  21. package/styles/bootstrap.css +35 -26
  22. package/styles/bootstrap4.css +35 -26
  23. package/styles/bootstrap5-dark.css +44 -35
  24. package/styles/bootstrap5.css +44 -35
  25. package/styles/context-menu/_bootstrap5-definition.scss +1 -1
  26. package/styles/context-menu/bootstrap5-dark.css +4 -4
  27. package/styles/context-menu/bootstrap5.css +4 -4
  28. package/styles/fabric-dark.css +35 -26
  29. package/styles/fabric.css +35 -26
  30. package/styles/fluent-dark.css +35 -26
  31. package/styles/fluent.css +35 -26
  32. package/styles/highcontrast-light.css +35 -26
  33. package/styles/highcontrast.css +37 -27
  34. package/styles/material-dark.css +35 -26
  35. package/styles/material.css +35 -26
  36. package/styles/menu/_bootstrap5-definition.scss +1 -1
  37. package/styles/menu/bootstrap5-dark.css +5 -5
  38. package/styles/menu/bootstrap5.css +5 -5
  39. package/styles/tab/_icons.scss +0 -8
  40. package/styles/tab/bootstrap-dark.css +0 -10
  41. package/styles/tab/bootstrap.css +0 -10
  42. package/styles/tab/bootstrap4.css +0 -10
  43. package/styles/tab/bootstrap5-dark.css +0 -10
  44. package/styles/tab/bootstrap5.css +0 -10
  45. package/styles/tab/fabric-dark.css +0 -10
  46. package/styles/tab/fabric.css +0 -10
  47. package/styles/tab/fluent-dark.css +0 -10
  48. package/styles/tab/fluent.css +0 -10
  49. package/styles/tab/highcontrast-light.css +0 -10
  50. package/styles/tab/highcontrast.css +0 -10
  51. package/styles/tab/icons/_bootstrap-dark.scss +0 -8
  52. package/styles/tab/icons/_bootstrap.scss +0 -8
  53. package/styles/tab/icons/_bootstrap4.scss +0 -12
  54. package/styles/tab/icons/_bootstrap5.scss +0 -12
  55. package/styles/tab/icons/_fabric-dark.scss +0 -8
  56. package/styles/tab/icons/_fabric.scss +0 -8
  57. package/styles/tab/icons/_fluent.scss +0 -8
  58. package/styles/tab/icons/_fusionnew.scss +0 -12
  59. package/styles/tab/icons/_highcontrast-light.scss +0 -12
  60. package/styles/tab/icons/_highcontrast.scss +0 -12
  61. package/styles/tab/icons/_material-dark.scss +0 -12
  62. package/styles/tab/icons/_material.scss +0 -12
  63. package/styles/tab/icons/_material3.scss +0 -12
  64. package/styles/tab/icons/_tailwind.scss +0 -12
  65. package/styles/tab/material-dark.css +0 -10
  66. package/styles/tab/material.css +0 -10
  67. package/styles/tab/tailwind-dark.css +0 -10
  68. package/styles/tab/tailwind.css +0 -10
  69. package/styles/tailwind-dark.css +35 -26
  70. package/styles/tailwind.css +35 -26
  71. package/styles/treeview/_theme.scss +20 -10
  72. package/styles/treeview/bootstrap-dark.css +35 -16
  73. package/styles/treeview/bootstrap.css +35 -16
  74. package/styles/treeview/bootstrap4.css +35 -16
  75. package/styles/treeview/bootstrap5-dark.css +35 -16
  76. package/styles/treeview/bootstrap5.css +35 -16
  77. package/styles/treeview/fabric-dark.css +35 -16
  78. package/styles/treeview/fabric.css +35 -16
  79. package/styles/treeview/fluent-dark.css +35 -16
  80. package/styles/treeview/fluent.css +35 -16
  81. package/styles/treeview/highcontrast-light.css +35 -16
  82. package/styles/treeview/highcontrast.css +37 -17
  83. package/styles/treeview/material-dark.css +35 -16
  84. package/styles/treeview/material.css +35 -16
  85. package/styles/treeview/tailwind-dark.css +35 -16
  86. package/styles/treeview/tailwind.css +35 -16
@@ -695,17 +695,22 @@
695
695
  font-size: 20px;
696
696
  }
697
697
  .e-treeview .e-list-item.e-active,
698
- .e-treeview .e-list-item.e-hover {
698
+ .e-treeview .e-list-item.e-hover,
699
+ .e-treeview .e-list-item.e-node-focus {
699
700
  background: transparent;
700
701
  }
701
- .e-treeview .e-list-item.e-hover > .e-text-content {
702
+ .e-treeview .e-list-item.e-hover > .e-text-content,
703
+ .e-treeview .e-list-item.e-node-focus > .e-text-content {
702
704
  color: #fff;
703
705
  }
704
- .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
706
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
707
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text {
705
708
  color: #fff;
706
709
  }
707
710
  .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
708
- .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable {
711
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
712
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
713
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
709
714
  color: #f3f4f6;
710
715
  }
711
716
  .e-treeview .e-list-item.e-active > .e-text-content {
@@ -718,31 +723,40 @@
718
723
  .e-treeview .e-list-item.e-active > .e-text-content .e-icon-expandable {
719
724
  color: #fff;
720
725
  }
721
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content {
726
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content,
727
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
722
728
  color: #fff;
723
729
  }
724
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text {
730
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
731
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
725
732
  color: #fff;
726
733
  }
727
734
  .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-collapsible,
728
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable {
735
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable,
736
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-collapsible,
737
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-expandable {
729
738
  color: #f3f4f6;
730
739
  }
731
740
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content,
732
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content {
741
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content,
742
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content {
733
743
  color: #fff;
734
744
  }
735
745
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text,
736
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text {
746
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text,
747
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text {
737
748
  color: #fff;
738
749
  }
739
750
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-collapsible,
740
751
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-expandable,
741
752
  .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-collapsible,
742
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable {
753
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable,
754
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-collapsible,
755
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-expandable {
743
756
  color: #d1d5db;
744
757
  }
745
- .e-treeview .e-list-item.e-hover > .e-fullrow {
758
+ .e-treeview .e-list-item.e-hover > .e-fullrow,
759
+ .e-treeview .e-list-item.e-node-focus > .e-fullrow {
746
760
  background-color: #4b5563;
747
761
  border-color: #4b5563;
748
762
  }
@@ -760,12 +774,14 @@
760
774
  .e-treeview .e-list-item.e-active.e-animation-active > .e-text-content .e-list-text {
761
775
  color: #fff;
762
776
  }
763
- .e-treeview .e-list-item.e-active.e-hover > .e-fullrow {
777
+ .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
778
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
764
779
  background-color: #4b5563;
765
780
  border-color: #4b5563;
766
781
  }
767
782
  .e-treeview .e-list-item.e-editing.e-active > .e-fullrow,
768
- .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow {
783
+ .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow,
784
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-fullrow {
769
785
  background-color: transparent;
770
786
  border-color: transparent;
771
787
  }
@@ -796,7 +812,8 @@
796
812
  .e-treeview .e-popup .e-downtail::after {
797
813
  border-top-color: #4b5563;
798
814
  }
799
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content {
815
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content,
816
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
800
817
  background-color: #4b5563;
801
818
  border-color: #4b5563;
802
819
  }
@@ -804,12 +821,14 @@
804
821
  background-color: #6b7280;
805
822
  border-color: #6b7280;
806
823
  }
807
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content {
824
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content,
825
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
808
826
  background-color: #4b5563;
809
827
  border-color: #4b5563;
810
828
  }
811
829
  .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content,
812
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content {
830
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content,
831
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
813
832
  background-color: transparent;
814
833
  border-color: transparent;
815
834
  }
@@ -695,17 +695,22 @@
695
695
  font-size: 20px;
696
696
  }
697
697
  .e-treeview .e-list-item.e-active,
698
- .e-treeview .e-list-item.e-hover {
698
+ .e-treeview .e-list-item.e-hover,
699
+ .e-treeview .e-list-item.e-node-focus {
699
700
  background: transparent;
700
701
  }
701
- .e-treeview .e-list-item.e-hover > .e-text-content {
702
+ .e-treeview .e-list-item.e-hover > .e-text-content,
703
+ .e-treeview .e-list-item.e-node-focus > .e-text-content {
702
704
  color: #111827;
703
705
  }
704
- .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
706
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
707
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text {
705
708
  color: #111827;
706
709
  }
707
710
  .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
708
- .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable {
711
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
712
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
713
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
709
714
  color: #374151;
710
715
  }
711
716
  .e-treeview .e-list-item.e-active > .e-text-content {
@@ -718,31 +723,40 @@
718
723
  .e-treeview .e-list-item.e-active > .e-text-content .e-icon-expandable {
719
724
  color: #111827;
720
725
  }
721
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content {
726
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content,
727
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
722
728
  color: #111827;
723
729
  }
724
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text {
730
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
731
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
725
732
  color: #111827;
726
733
  }
727
734
  .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-collapsible,
728
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable {
735
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable,
736
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-collapsible,
737
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-expandable {
729
738
  color: #374151;
730
739
  }
731
740
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content,
732
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content {
741
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content,
742
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content {
733
743
  color: #111827;
734
744
  }
735
745
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text,
736
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text {
746
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text,
747
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text {
737
748
  color: #111827;
738
749
  }
739
750
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-collapsible,
740
751
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-expandable,
741
752
  .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-collapsible,
742
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable {
753
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable,
754
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-collapsible,
755
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-expandable {
743
756
  color: #6b7280;
744
757
  }
745
- .e-treeview .e-list-item.e-hover > .e-fullrow {
758
+ .e-treeview .e-list-item.e-hover > .e-fullrow,
759
+ .e-treeview .e-list-item.e-node-focus > .e-fullrow {
746
760
  background-color: #f3f4f6;
747
761
  border-color: #f3f4f6;
748
762
  }
@@ -760,12 +774,14 @@
760
774
  .e-treeview .e-list-item.e-active.e-animation-active > .e-text-content .e-list-text {
761
775
  color: #111827;
762
776
  }
763
- .e-treeview .e-list-item.e-active.e-hover > .e-fullrow {
777
+ .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
778
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
764
779
  background-color: #d6d9e0;
765
780
  border-color: #f3f4f6;
766
781
  }
767
782
  .e-treeview .e-list-item.e-editing.e-active > .e-fullrow,
768
- .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow {
783
+ .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow,
784
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-fullrow {
769
785
  background-color: transparent;
770
786
  border-color: transparent;
771
787
  }
@@ -796,7 +812,8 @@
796
812
  .e-treeview .e-popup .e-downtail::after {
797
813
  border-top-color: #f3f4f6;
798
814
  }
799
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content {
815
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content,
816
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
800
817
  background-color: #f3f4f6;
801
818
  border-color: #f3f4f6;
802
819
  }
@@ -804,12 +821,14 @@
804
821
  background-color: #e5e7eb;
805
822
  border-color: #e5e7eb;
806
823
  }
807
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content {
824
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content,
825
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
808
826
  background-color: #d6d9e0;
809
827
  border-color: #f3f4f6;
810
828
  }
811
829
  .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content,
812
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content {
830
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content,
831
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
813
832
  background-color: transparent;
814
833
  border-color: transparent;
815
834
  }