@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
package/styles/treeview/fluent.css CHANGED
@@ -697,17 +697,22 @@
697
697
  font-size: 20px;
698
698
  }
699
699
  .e-treeview .e-list-item.e-active,
700
- .e-treeview .e-list-item.e-hover {
700
+ .e-treeview .e-list-item.e-hover,
701
+ .e-treeview .e-list-item.e-node-focus {
701
702
  background: transparent;
702
703
  }
703
- .e-treeview .e-list-item.e-hover > .e-text-content {
704
+ .e-treeview .e-list-item.e-hover > .e-text-content,
705
+ .e-treeview .e-list-item.e-node-focus > .e-text-content {
704
706
  color: #201f1e;
705
707
  }
706
- .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
708
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
709
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text {
707
710
  color: #201f1e;
708
711
  }
709
712
  .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
710
- .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable {
713
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
714
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
715
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
711
716
  color: #323130;
712
717
  }
713
718
  .e-treeview .e-list-item.e-active > .e-text-content {
@@ -726,31 +731,40 @@
726
731
  .e-treeview .e-list-item.e-active > .e-text-content .e-stop {
727
732
  border-color: #201f1e;
728
733
  }
729
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content {
734
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content,
735
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
730
736
  color: #201f1e;
731
737
  }
732
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text {
738
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
739
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
733
740
  color: #201f1e;
734
741
  }
735
742
  .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-collapsible,
736
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable {
743
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable,
744
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-collapsible,
745
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-expandable {
737
746
  color: #201f1e;
738
747
  }
739
748
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content,
740
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content {
749
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content,
750
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content {
741
751
  color: #201f1e;
742
752
  }
743
753
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text,
744
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text {
754
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text,
755
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text {
745
756
  color: #201f1e;
746
757
  }
747
758
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-collapsible,
748
759
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-expandable,
749
760
  .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-collapsible,
750
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable {
761
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable,
762
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-collapsible,
763
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-expandable {
751
764
  color: #605e5c;
752
765
  }
753
- .e-treeview .e-list-item.e-hover > .e-fullrow {
766
+ .e-treeview .e-list-item.e-hover > .e-fullrow,
767
+ .e-treeview .e-list-item.e-node-focus > .e-fullrow {
754
768
  background-color: #f3f2f1;
755
769
  border-color: #f3f2f1;
756
770
  }
@@ -768,12 +782,14 @@
768
782
  .e-treeview .e-list-item.e-active.e-animation-active > .e-text-content .e-list-text {
769
783
  color: #201f1e;
770
784
  }
771
- .e-treeview .e-list-item.e-active.e-hover > .e-fullrow {
785
+ .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
786
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
772
787
  background-color: #e2dedb;
773
788
  border-color: #edebe9;
774
789
  }
775
790
  .e-treeview .e-list-item.e-editing.e-active > .e-fullrow,
776
- .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow {
791
+ .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow,
792
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-fullrow {
777
793
  background-color: transparent;
778
794
  border-color: transparent;
779
795
  }
@@ -808,7 +824,8 @@
808
824
  .e-treeview .e-popup .e-downtail::after {
809
825
  border-top-color: #f3f2f1;
810
826
  }
811
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content {
827
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content,
828
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
812
829
  background-color: #f3f2f1;
813
830
  border-color: #f3f2f1;
814
831
  }
@@ -816,12 +833,14 @@
816
833
  background-color: #edebe9;
817
834
  border-color: #edebe9;
818
835
  }
819
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content {
836
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content,
837
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
820
838
  background-color: #e2dedb;
821
839
  border-color: #edebe9;
822
840
  }
823
841
  .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content,
824
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content {
842
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content,
843
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
825
844
  background-color: transparent;
826
845
  border-color: transparent;
827
846
  }
package/styles/treeview/highcontrast-light.css CHANGED
@@ -589,17 +589,22 @@
589
589
  font-size: 10px;
590
590
  }
591
591
  .e-treeview .e-list-item.e-active,
592
- .e-treeview .e-list-item.e-hover {
592
+ .e-treeview .e-list-item.e-hover,
593
+ .e-treeview .e-list-item.e-node-focus {
593
594
  background: transparent;
594
595
  }
595
- .e-treeview .e-list-item.e-hover > .e-text-content {
596
+ .e-treeview .e-list-item.e-hover > .e-text-content,
597
+ .e-treeview .e-list-item.e-node-focus > .e-text-content {
596
598
  color: #000;
597
599
  }
598
- .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
600
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
601
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text {
599
602
  color: #000;
600
603
  }
601
604
  .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
602
- .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable {
605
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
606
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
607
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
603
608
  color: #000;
604
609
  }
605
610
  .e-treeview .e-list-item.e-active > .e-text-content {
@@ -612,31 +617,40 @@
612
617
  .e-treeview .e-list-item.e-active > .e-text-content .e-icon-expandable {
613
618
  color: #fff;
614
619
  }
615
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content {
620
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content,
621
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
616
622
  color: #fff;
617
623
  }
618
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text {
624
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
625
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
619
626
  color: #fff;
620
627
  }
621
628
  .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-collapsible,
622
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable {
629
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable,
630
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-collapsible,
631
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-expandable {
623
632
  color: #fff;
624
633
  }
625
634
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content,
626
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content {
635
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content,
636
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content {
627
637
  color: #000;
628
638
  }
629
639
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text,
630
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text {
640
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text,
641
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text {
631
642
  color: #000;
632
643
  }
633
644
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-collapsible,
634
645
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-expandable,
635
646
  .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-collapsible,
636
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable {
647
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable,
648
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-collapsible,
649
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-expandable {
637
650
  color: #000;
638
651
  }
639
- .e-treeview .e-list-item.e-hover > .e-fullrow {
652
+ .e-treeview .e-list-item.e-hover > .e-fullrow,
653
+ .e-treeview .e-list-item.e-node-focus > .e-fullrow {
640
654
  background-color: #ecf;
641
655
  border-color: #000;
642
656
  }
@@ -654,12 +668,14 @@
654
668
  .e-treeview .e-list-item.e-active.e-animation-active > .e-text-content .e-list-text {
655
669
  color: #000;
656
670
  }
657
- .e-treeview .e-list-item.e-active.e-hover > .e-fullrow {
671
+ .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
672
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
658
673
  background-color: #400074;
659
674
  border-color: #000;
660
675
  }
661
676
  .e-treeview .e-list-item.e-editing.e-active > .e-fullrow,
662
- .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow {
677
+ .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow,
678
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-fullrow {
663
679
  background-color: transparent;
664
680
  border-color: transparent;
665
681
  }
@@ -691,7 +707,8 @@
691
707
  .e-treeview .e-popup .e-downtail::after {
692
708
  border-top-color: #ecf;
693
709
  }
694
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content {
710
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content,
711
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
695
712
  background-color: #ecf;
696
713
  border-color: #000;
697
714
  }
@@ -699,12 +716,14 @@
699
716
  background-color: #400074;
700
717
  border-color: #400074;
701
718
  }
702
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content {
719
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content,
720
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
703
721
  background-color: #400074;
704
722
  border-color: #000;
705
723
  }
706
724
  .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content,
707
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content {
725
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content,
726
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
708
727
  background-color: transparent;
709
728
  border-color: transparent;
710
729
  }
package/styles/treeview/highcontrast.css CHANGED
@@ -593,17 +593,22 @@
593
593
  font-size: 10px;
594
594
  }
595
595
  .e-treeview .e-list-item.e-active,
596
- .e-treeview .e-list-item.e-hover {
596
+ .e-treeview .e-list-item.e-hover,
597
+ .e-treeview .e-list-item.e-node-focus {
597
598
  background: transparent;
598
599
  }
599
- .e-treeview .e-list-item.e-hover > .e-text-content {
600
+ .e-treeview .e-list-item.e-hover > .e-text-content,
601
+ .e-treeview .e-list-item.e-node-focus > .e-text-content {
600
602
  color: #fff;
601
603
  }
602
- .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
604
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
605
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text {
603
606
  color: #fff;
604
607
  }
605
608
  .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
606
- .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable {
609
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
610
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
611
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
607
612
  color: #fff;
608
613
  }
609
614
  .e-treeview .e-list-item.e-active > .e-text-content {
@@ -622,35 +627,45 @@
622
627
  border-color: #000;
623
628
  color: #ffd939;
624
629
  }
625
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content {
630
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content,
631
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
626
632
  color: #000;
627
633
  }
628
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text {
634
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
635
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
629
636
  color: #000;
630
637
  }
631
638
  .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-collapsible,
632
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable {
639
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable,
640
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-collapsible,
641
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-expandable {
633
642
  color: #000;
634
643
  }
635
644
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content,
636
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content {
645
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content,
646
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content {
637
647
  color: #fff;
638
648
  }
639
649
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text,
640
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text {
650
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text,
651
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text {
641
652
  color: #fff;
642
653
  }
643
654
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text .e-input,
644
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text .e-input {
655
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text .e-input,
656
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text .e-input {
645
657
  font-weight: 600;
646
658
  }
647
659
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-collapsible,
648
660
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-expandable,
649
661
  .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-collapsible,
650
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable {
662
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable,
663
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-collapsible,
664
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-expandable {
651
665
  color: #fff;
652
666
  }
653
- .e-treeview .e-list-item.e-hover > .e-fullrow {
667
+ .e-treeview .e-list-item.e-hover > .e-fullrow,
668
+ .e-treeview .e-list-item.e-node-focus > .e-fullrow {
654
669
  background-color: #685708;
655
670
  border-color: #fff;
656
671
  }
@@ -668,13 +683,15 @@
668
683
  .e-treeview .e-list-item.e-active.e-animation-active > .e-text-content .e-list-text {
669
684
  color: #fff;
670
685
  }
671
- .e-treeview .e-list-item.e-active.e-hover > .e-fullrow {
686
+ .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
687
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
672
688
  background-color: #ffd939;
673
689
  border-color: #fff;
674
690
  box-shadow: 0 -1px 2px #fff, 0 1px 2px #fff;
675
691
  }
676
692
  .e-treeview .e-list-item.e-editing.e-active > .e-fullrow,
677
- .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow {
693
+ .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow,
694
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-fullrow {
678
695
  background-color: transparent;
679
696
  border-color: transparent;
680
697
  }
@@ -706,7 +723,8 @@
706
723
  .e-treeview .e-popup .e-downtail::after {
707
724
  border-top-color: #685708;
708
725
  }
709
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content {
726
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content,
727
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
710
728
  background-color: #685708;
711
729
  border-color: #fff;
712
730
  }
@@ -714,13 +732,15 @@
714
732
  background-color: #ffd939;
715
733
  border-color: #ffd939;
716
734
  }
717
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content {
735
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content,
736
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
718
737
  background-color: #ffd939;
719
738
  border-color: #fff;
720
739
  box-shadow: 0 -1px 2px #fff, 0 1px 2px #fff;
721
740
  }
722
741
  .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content,
723
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content {
742
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content,
743
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
724
744
  background-color: transparent;
725
745
  border-color: transparent;
726
746
  }
package/styles/treeview/material-dark.css CHANGED
@@ -596,17 +596,22 @@
596
596
  font-size: 10px;
597
597
  }
598
598
  .e-treeview .e-list-item.e-active,
599
- .e-treeview .e-list-item.e-hover {
599
+ .e-treeview .e-list-item.e-hover,
600
+ .e-treeview .e-list-item.e-node-focus {
600
601
  background: transparent;
601
602
  }
602
- .e-treeview .e-list-item.e-hover > .e-text-content {
603
+ .e-treeview .e-list-item.e-hover > .e-text-content,
604
+ .e-treeview .e-list-item.e-node-focus > .e-text-content {
603
605
  color: #fff;
604
606
  }
605
- .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
607
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
608
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text {
606
609
  color: #fff;
607
610
  }
608
611
  .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
609
- .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable {
612
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
613
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
614
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
610
615
  color: rgba(255, 255, 255, 0.7);
611
616
  }
612
617
  .e-treeview .e-list-item.e-active > .e-text-content {
@@ -619,31 +624,40 @@
619
624
  .e-treeview .e-list-item.e-active > .e-text-content .e-icon-expandable {
620
625
  color: rgba(255, 255, 255, 0.7);
621
626
  }
622
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content {
627
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content,
628
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
623
629
  color: #00b0ff;
624
630
  }
625
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text {
631
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
632
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
626
633
  color: #00b0ff;
627
634
  }
628
635
  .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-collapsible,
629
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable {
636
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable,
637
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-collapsible,
638
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-expandable {
630
639
  color: rgba(255, 255, 255, 0.7);
631
640
  }
632
641
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content,
633
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content {
642
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content,
643
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content {
634
644
  color: #fff;
635
645
  }
636
646
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text,
637
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text {
647
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text,
648
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text {
638
649
  color: #fff;
639
650
  }
640
651
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-collapsible,
641
652
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-expandable,
642
653
  .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-collapsible,
643
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable {
654
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable,
655
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-collapsible,
656
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-expandable {
644
657
  color: rgba(255, 255, 255, 0.7);
645
658
  }
646
- .e-treeview .e-list-item.e-hover > .e-fullrow {
659
+ .e-treeview .e-list-item.e-hover > .e-fullrow,
660
+ .e-treeview .e-list-item.e-node-focus > .e-fullrow {
647
661
  background-color: rgba(255, 255, 255, 0.1);
648
662
  border-color: transparent;
649
663
  }
@@ -661,12 +675,14 @@
661
675
  .e-treeview .e-list-item.e-active.e-animation-active > .e-text-content .e-list-text {
662
676
  color: #fff;
663
677
  }
664
- .e-treeview .e-list-item.e-active.e-hover > .e-fullrow {
678
+ .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
679
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
665
680
  background-color: rgba(255, 255, 255, 0.18);
666
681
  border-color: transparent;
667
682
  }
668
683
  .e-treeview .e-list-item.e-editing.e-active > .e-fullrow,
669
- .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow {
684
+ .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow,
685
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-fullrow {
670
686
  background-color: transparent;
671
687
  border-color: transparent;
672
688
  }
@@ -698,7 +714,8 @@
698
714
  .e-treeview .e-popup .e-downtail::after {
699
715
  border-top-color: #616161;
700
716
  }
701
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content {
717
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content,
718
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
702
719
  background-color: rgba(255, 255, 255, 0.1);
703
720
  border-color: transparent;
704
721
  }
@@ -706,12 +723,14 @@
706
723
  background-color: rgba(255, 255, 255, 0.18);
707
724
  border-color: transparent;
708
725
  }
709
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content {
726
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content,
727
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
710
728
  background-color: rgba(255, 255, 255, 0.18);
711
729
  border-color: transparent;
712
730
  }
713
731
  .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content,
714
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content {
732
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content,
733
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
715
734
  background-color: transparent;
716
735
  border-color: transparent;
717
736
  }
package/styles/treeview/material.css CHANGED
@@ -600,17 +600,22 @@
600
600
  font-size: 10px;
601
601
  }
602
602
  .e-treeview .e-list-item.e-active,
603
- .e-treeview .e-list-item.e-hover {
603
+ .e-treeview .e-list-item.e-hover,
604
+ .e-treeview .e-list-item.e-node-focus {
604
605
  background: transparent;
605
606
  }
606
- .e-treeview .e-list-item.e-hover > .e-text-content {
607
+ .e-treeview .e-list-item.e-hover > .e-text-content,
608
+ .e-treeview .e-list-item.e-node-focus > .e-text-content {
607
609
  color: rgba(0, 0, 0, 0.87);
608
610
  }
609
- .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text {
611
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-list-text,
612
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-list-text {
610
613
  color: rgba(0, 0, 0, 0.87);
611
614
  }
612
615
  .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-collapsible,
613
- .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable {
616
+ .e-treeview .e-list-item.e-hover > .e-text-content .e-icon-expandable,
617
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-collapsible,
618
+ .e-treeview .e-list-item.e-node-focus > .e-text-content .e-icon-expandable {
614
619
  color: rgba(0, 0, 0, 0.54);
615
620
  }
616
621
  .e-treeview .e-list-item.e-active > .e-text-content {
@@ -623,31 +628,40 @@
623
628
  .e-treeview .e-list-item.e-active > .e-text-content .e-icon-expandable {
624
629
  color: rgba(0, 0, 0, 0.54);
625
630
  }
626
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content {
631
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content,
632
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content {
627
633
  color: #e3165b;
628
634
  }
629
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text {
635
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-list-text,
636
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-list-text {
630
637
  color: #e3165b;
631
638
  }
632
639
  .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-collapsible,
633
- .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable {
640
+ .e-treeview .e-list-item.e-active.e-hover > .e-text-content .e-icon-expandable,
641
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-collapsible,
642
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-text-content .e-icon-expandable {
634
643
  color: rgba(0, 0, 0, 0.54);
635
644
  }
636
645
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content,
637
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content {
646
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content,
647
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content {
638
648
  color: rgba(0, 0, 0, 0.87);
639
649
  }
640
650
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-list-text,
641
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text {
651
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-list-text,
652
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-list-text {
642
653
  color: rgba(0, 0, 0, 0.87);
643
654
  }
644
655
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-collapsible,
645
656
  .e-treeview .e-list-item.e-editing.e-active > .e-text-content .e-icon-expandable,
646
657
  .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-collapsible,
647
- .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable {
658
+ .e-treeview .e-list-item.e-editing.e-hover > .e-text-content .e-icon-expandable,
659
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-collapsible,
660
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-text-content .e-icon-expandable {
648
661
  color: rgba(0, 0, 0, 0.54);
649
662
  }
650
- .e-treeview .e-list-item.e-hover > .e-fullrow {
663
+ .e-treeview .e-list-item.e-hover > .e-fullrow,
664
+ .e-treeview .e-list-item.e-node-focus > .e-fullrow {
651
665
  background-color: #f5f5f5;
652
666
  border-color: #f5f5f5;
653
667
  }
@@ -665,12 +679,14 @@
665
679
  .e-treeview .e-list-item.e-active.e-animation-active > .e-text-content .e-list-text {
666
680
  color: rgba(0, 0, 0, 0.87);
667
681
  }
668
- .e-treeview .e-list-item.e-active.e-hover > .e-fullrow {
682
+ .e-treeview .e-list-item.e-active.e-hover > .e-fullrow,
683
+ .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
669
684
  background-color: #e0e0e0;
670
685
  border-color: #e0e0e0;
671
686
  }
672
687
  .e-treeview .e-list-item.e-editing.e-active > .e-fullrow,
673
- .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow {
688
+ .e-treeview .e-list-item.e-editing.e-hover > .e-fullrow,
689
+ .e-treeview .e-list-item.e-editing.e-node-focus > .e-fullrow {
674
690
  background-color: transparent;
675
691
  border-color: transparent;
676
692
  }
@@ -701,7 +717,8 @@
701
717
  .e-treeview .e-popup .e-downtail::after {
702
718
  border-top-color: #fff;
703
719
  }
704
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content {
720
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-hover > .e-text-content,
721
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-node-focus > .e-text-content {
705
722
  background-color: #f5f5f5;
706
723
  border-color: #f5f5f5;
707
724
  }
@@ -709,12 +726,14 @@
709
726
  background-color: #eee;
710
727
  border-color: #eee;
711
728
  }
712
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content {
729
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-hover > .e-text-content,
730
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-active.e-node-focus > .e-text-content {
713
731
  background-color: #e0e0e0;
714
732
  border-color: #e0e0e0;
715
733
  }
716
734
  .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-active > .e-text-content,
717
- .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content {
735
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-hover > .e-text-content,
736
+ .e-treeview:not(.e-fullrow-wrap) .e-list-item.e-editing.e-node-focus > .e-text-content {
718
737
  background-color: transparent;
719
738
  border-color: transparent;
720
739
  }