@syncfusion/ej2-calendars 24.1.47 → 24.2.5

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 (65) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/ej2-calendars.min.js +2 -2
  3. package/dist/ej2-calendars.umd.min.js +2 -2
  4. package/dist/ej2-calendars.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-calendars.es2015.js +94 -25
  6. package/dist/es6/ej2-calendars.es2015.js.map +1 -1
  7. package/dist/es6/ej2-calendars.es5.js +94 -25
  8. package/dist/es6/ej2-calendars.es5.js.map +1 -1
  9. package/dist/global/ej2-calendars.min.js +2 -2
  10. package/dist/global/ej2-calendars.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +10 -10
  13. package/src/calendar/calendar.d.ts +2 -0
  14. package/src/calendar/calendar.js +86 -21
  15. package/src/datepicker/datepicker.js +8 -4
  16. package/styles/bootstrap-dark.css +26 -1
  17. package/styles/bootstrap.css +26 -1
  18. package/styles/bootstrap4.css +26 -1
  19. package/styles/bootstrap5-dark.css +26 -1
  20. package/styles/bootstrap5.css +26 -1
  21. package/styles/calendar/_bootstrap-dark-definition.scss +10 -0
  22. package/styles/calendar/_bootstrap-definition.scss +10 -0
  23. package/styles/calendar/_bootstrap4-definition.scss +10 -0
  24. package/styles/calendar/_bootstrap5-definition.scss +9 -1
  25. package/styles/calendar/_fabric-dark-definition.scss +10 -0
  26. package/styles/calendar/_fabric-definition.scss +11 -1
  27. package/styles/calendar/_fluent-definition.scss +11 -1
  28. package/styles/calendar/_fusionnew-definition.scss +10 -0
  29. package/styles/calendar/_highcontrast-definition.scss +11 -1
  30. package/styles/calendar/_highcontrast-light-definition.scss +10 -0
  31. package/styles/calendar/_layout.scss +3 -0
  32. package/styles/calendar/_material-dark-definition.scss +10 -0
  33. package/styles/calendar/_material-definition.scss +10 -0
  34. package/styles/calendar/_material3-definition.scss +10 -0
  35. package/styles/calendar/_tailwind-definition.scss +10 -1
  36. package/styles/calendar/_theme.scss +24 -3
  37. package/styles/calendar/bootstrap-dark.css +25 -1
  38. package/styles/calendar/bootstrap.css +25 -1
  39. package/styles/calendar/bootstrap4.css +25 -1
  40. package/styles/calendar/bootstrap5-dark.css +26 -1
  41. package/styles/calendar/bootstrap5.css +26 -1
  42. package/styles/calendar/fabric-dark.css +25 -1
  43. package/styles/calendar/fabric.css +27 -3
  44. package/styles/calendar/fluent-dark.css +35 -10
  45. package/styles/calendar/fluent.css +35 -10
  46. package/styles/calendar/highcontrast-light.css +25 -1
  47. package/styles/calendar/highcontrast.css +27 -3
  48. package/styles/calendar/material-dark.css +25 -1
  49. package/styles/calendar/material.css +25 -1
  50. package/styles/calendar/material3-dark.css +25 -1
  51. package/styles/calendar/material3.css +25 -1
  52. package/styles/calendar/tailwind-dark.css +25 -1
  53. package/styles/calendar/tailwind.css +25 -1
  54. package/styles/fabric-dark.css +26 -1
  55. package/styles/fabric.css +28 -3
  56. package/styles/fluent-dark.css +35 -10
  57. package/styles/fluent.css +35 -10
  58. package/styles/highcontrast-light.css +26 -1
  59. package/styles/highcontrast.css +28 -3
  60. package/styles/material-dark.css +26 -1
  61. package/styles/material.css +26 -1
  62. package/styles/material3-dark.css +26 -1
  63. package/styles/material3.css +26 -1
  64. package/styles/tailwind-dark.css +26 -1
  65. package/styles/tailwind.css +26 -1
package/styles/material.css CHANGED
@@ -214,6 +214,9 @@ ejs-calendar {
214
214
  font-size: 14px;
215
215
  font-weight: 500;
216
216
  text-align: left;
217
+ padding: 0 5px;
218
+ border: none;
219
+ border-radius: 4px;
217
220
  }
218
221
  .e-calendar .e-header .e-title,
219
222
  .e-bigger.e-small .e-calendar .e-header .e-title {
@@ -598,10 +601,22 @@ ejs-calendar {
598
601
  }
599
602
  .e-calendar .e-header .e-title:hover,
600
603
  .e-bigger.e-small .e-calendar .e-header .e-title:hover {
601
- color: rgba(0, 0, 0, 0.75);
604
+ background: none;
602
605
  cursor: pointer;
603
606
  text-decoration: none;
604
607
  }
608
+ .e-calendar .e-header .e-title:focus,
609
+ .e-bigger.e-small .e-calendar .e-header .e-title:focus {
610
+ box-shadow: 0 0 0 1px #212121;
611
+ background: none;
612
+ text-decoration: none;
613
+ }
614
+ .e-calendar .e-header .e-title:active,
615
+ .e-bigger.e-small .e-calendar .e-header .e-title:active {
616
+ box-shadow: none;
617
+ background: #fff;
618
+ text-decoration: none;
619
+ }
605
620
  .e-calendar .e-header .e-prev:hover > span, .e-calendar .e-header .e-next:hover > span,
606
621
  .e-bigger.e-small .e-calendar .e-header .e-prev:hover > span,
607
622
  .e-bigger.e-small .e-calendar .e-header .e-next:hover > span {
@@ -614,6 +629,11 @@ ejs-calendar {
614
629
  .e-bigger.e-small .e-calendar .e-header .e-next:hover {
615
630
  background: none;
616
631
  }
632
+ .e-calendar .e-header .e-prev:focus, .e-calendar .e-header .e-next:focus,
633
+ .e-bigger.e-small .e-calendar .e-header .e-prev:focus,
634
+ .e-bigger.e-small .e-calendar .e-header .e-next:focus {
635
+ box-shadow: 0 0 0 1px #212121;
636
+ }
617
637
  .e-calendar .e-header .e-prev:active, .e-calendar .e-header .e-next:active,
618
638
  .e-bigger.e-small .e-calendar .e-header .e-prev:active,
619
639
  .e-bigger.e-small .e-calendar .e-header .e-next:active {
@@ -833,6 +853,11 @@ ejs-calendar {
833
853
  transform: scale(1);
834
854
  }
835
855
  }
856
+ .e-calendar .e-content-table .e-cell.e-focused-cell span.e-day {
857
+ box-shadow: 0 0 0 1px #212121;
858
+ border-radius: 50%;
859
+ }
860
+
836
861
  /* stylelint-disable property-no-vendor-prefix */
837
862
  @keyframes e-input-ripple {
838
863
  100% {
package/styles/material3-dark.css CHANGED
@@ -269,6 +269,9 @@ ejs-calendar {
269
269
  font-size: 14px;
270
270
  font-weight: 600;
271
271
  text-align: left;
272
+ padding: 0 5px;
273
+ border: none;
274
+ border-radius: 4px;
272
275
  }
273
276
  .e-calendar .e-header .e-title,
274
277
  .e-bigger.e-small .e-calendar .e-header .e-title {
@@ -657,10 +660,22 @@ ejs-calendar {
657
660
  }
658
661
  .e-calendar .e-header .e-title:hover,
659
662
  .e-bigger.e-small .e-calendar .e-header .e-title:hover {
660
- color: rgba(var(--color-sf-on-surface));
663
+ background: rgba(var(--color-sf-on-surface), 0.08);
661
664
  cursor: pointer;
662
665
  text-decoration: none;
663
666
  }
667
+ .e-calendar .e-header .e-title:focus,
668
+ .e-bigger.e-small .e-calendar .e-header .e-title:focus {
669
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
670
+ background: none;
671
+ text-decoration: none;
672
+ }
673
+ .e-calendar .e-header .e-title:active,
674
+ .e-bigger.e-small .e-calendar .e-header .e-title:active {
675
+ box-shadow: none;
676
+ background: rgba(var(--color-sf-on-surface), 0.12);
677
+ text-decoration: none;
678
+ }
664
679
  .e-calendar .e-header .e-prev:hover > span, .e-calendar .e-header .e-next:hover > span,
665
680
  .e-bigger.e-small .e-calendar .e-header .e-prev:hover > span,
666
681
  .e-bigger.e-small .e-calendar .e-header .e-next:hover > span {
@@ -673,6 +688,11 @@ ejs-calendar {
673
688
  .e-bigger.e-small .e-calendar .e-header .e-next:hover {
674
689
  background: rgba(var(--color-sf-on-surface), 0.08);
675
690
  }
691
+ .e-calendar .e-header .e-prev:focus, .e-calendar .e-header .e-next:focus,
692
+ .e-bigger.e-small .e-calendar .e-header .e-prev:focus,
693
+ .e-bigger.e-small .e-calendar .e-header .e-next:focus {
694
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
695
+ }
676
696
  .e-calendar .e-header .e-prev:active, .e-calendar .e-header .e-next:active,
677
697
  .e-bigger.e-small .e-calendar .e-header .e-prev:active,
678
698
  .e-bigger.e-small .e-calendar .e-header .e-next:active {
@@ -892,6 +912,11 @@ ejs-calendar {
892
912
  transform: scale(1);
893
913
  }
894
914
  }
915
+ .e-calendar .e-content-table .e-cell.e-focused-cell span.e-day {
916
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
917
+ border-radius: 32px;
918
+ }
919
+
895
920
  /* stylelint-disable property-no-vendor-prefix */
896
921
  @keyframes e-input-ripple {
897
922
  100% {
package/styles/material3.css CHANGED
@@ -325,6 +325,9 @@ ejs-calendar {
325
325
  font-size: 14px;
326
326
  font-weight: 600;
327
327
  text-align: left;
328
+ padding: 0 5px;
329
+ border: none;
330
+ border-radius: 4px;
328
331
  }
329
332
  .e-calendar .e-header .e-title,
330
333
  .e-bigger.e-small .e-calendar .e-header .e-title {
@@ -713,10 +716,22 @@ ejs-calendar {
713
716
  }
714
717
  .e-calendar .e-header .e-title:hover,
715
718
  .e-bigger.e-small .e-calendar .e-header .e-title:hover {
716
- color: rgba(var(--color-sf-on-surface));
719
+ background: rgba(var(--color-sf-on-surface), 0.08);
717
720
  cursor: pointer;
718
721
  text-decoration: none;
719
722
  }
723
+ .e-calendar .e-header .e-title:focus,
724
+ .e-bigger.e-small .e-calendar .e-header .e-title:focus {
725
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
726
+ background: none;
727
+ text-decoration: none;
728
+ }
729
+ .e-calendar .e-header .e-title:active,
730
+ .e-bigger.e-small .e-calendar .e-header .e-title:active {
731
+ box-shadow: none;
732
+ background: rgba(var(--color-sf-on-surface), 0.12);
733
+ text-decoration: none;
734
+ }
720
735
  .e-calendar .e-header .e-prev:hover > span, .e-calendar .e-header .e-next:hover > span,
721
736
  .e-bigger.e-small .e-calendar .e-header .e-prev:hover > span,
722
737
  .e-bigger.e-small .e-calendar .e-header .e-next:hover > span {
@@ -729,6 +744,11 @@ ejs-calendar {
729
744
  .e-bigger.e-small .e-calendar .e-header .e-next:hover {
730
745
  background: rgba(var(--color-sf-on-surface), 0.08);
731
746
  }
747
+ .e-calendar .e-header .e-prev:focus, .e-calendar .e-header .e-next:focus,
748
+ .e-bigger.e-small .e-calendar .e-header .e-prev:focus,
749
+ .e-bigger.e-small .e-calendar .e-header .e-next:focus {
750
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
751
+ }
732
752
  .e-calendar .e-header .e-prev:active, .e-calendar .e-header .e-next:active,
733
753
  .e-bigger.e-small .e-calendar .e-header .e-prev:active,
734
754
  .e-bigger.e-small .e-calendar .e-header .e-next:active {
@@ -948,6 +968,11 @@ ejs-calendar {
948
968
  transform: scale(1);
949
969
  }
950
970
  }
971
+ .e-calendar .e-content-table .e-cell.e-focused-cell span.e-day {
972
+ box-shadow: 0 0 0 1px rgba(var(--color-sf-primary));
973
+ border-radius: 32px;
974
+ }
975
+
951
976
  /* stylelint-disable property-no-vendor-prefix */
952
977
  @keyframes e-input-ripple {
953
978
  100% {
package/styles/tailwind-dark.css CHANGED
@@ -205,6 +205,9 @@ ejs-calendar {
205
205
  font-size: 16px;
206
206
  font-weight: 500;
207
207
  text-align: left;
208
+ padding: 0 5px;
209
+ border: none;
210
+ border-radius: 4px;
208
211
  }
209
212
  .e-calendar .e-header .e-title,
210
213
  .e-bigger.e-small .e-calendar .e-header .e-title {
@@ -667,10 +670,22 @@ ejs-calendar {
667
670
  }
668
671
  .e-calendar .e-header .e-title:hover,
669
672
  .e-bigger.e-small .e-calendar .e-header .e-title:hover {
670
- color: #fff;
673
+ background: none;
671
674
  cursor: pointer;
672
675
  text-decoration: none;
673
676
  }
677
+ .e-calendar .e-header .e-title:focus,
678
+ .e-bigger.e-small .e-calendar .e-header .e-title:focus {
679
+ box-shadow: 0 0 0 1px #8b919e;
680
+ background: none;
681
+ text-decoration: none;
682
+ }
683
+ .e-calendar .e-header .e-title:active,
684
+ .e-bigger.e-small .e-calendar .e-header .e-title:active {
685
+ box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
686
+ background: none;
687
+ text-decoration: none;
688
+ }
674
689
  .e-calendar .e-header .e-prev:hover > span, .e-calendar .e-header .e-next:hover > span,
675
690
  .e-bigger.e-small .e-calendar .e-header .e-prev:hover > span,
676
691
  .e-bigger.e-small .e-calendar .e-header .e-next:hover > span {
@@ -683,6 +698,11 @@ ejs-calendar {
683
698
  .e-bigger.e-small .e-calendar .e-header .e-next:hover {
684
699
  background: transparent;
685
700
  }
701
+ .e-calendar .e-header .e-prev:focus, .e-calendar .e-header .e-next:focus,
702
+ .e-bigger.e-small .e-calendar .e-header .e-prev:focus,
703
+ .e-bigger.e-small .e-calendar .e-header .e-next:focus {
704
+ box-shadow: 0 0 0 1px #8b919e;
705
+ }
686
706
  .e-calendar .e-header .e-prev:active, .e-calendar .e-header .e-next:active,
687
707
  .e-bigger.e-small .e-calendar .e-header .e-prev:active,
688
708
  .e-bigger.e-small .e-calendar .e-header .e-next:active {
@@ -925,6 +945,11 @@ ejs-calendar {
925
945
  transform: scale(1);
926
946
  }
927
947
  }
948
+ .e-calendar .e-content-table .e-cell.e-focused-cell span.e-day {
949
+ box-shadow: 0 0 0 1px #8b919e;
950
+ border-radius: 4px;
951
+ }
952
+
928
953
  /* stylelint-disable property-no-vendor-prefix */
929
954
  /* stylelint-disable-line no-empty-source */
930
955
  /*! component icons */
package/styles/tailwind.css CHANGED
@@ -205,6 +205,9 @@ ejs-calendar {
205
205
  font-size: 16px;
206
206
  font-weight: 500;
207
207
  text-align: left;
208
+ padding: 0 5px;
209
+ border: none;
210
+ border-radius: 4px;
208
211
  }
209
212
  .e-calendar .e-header .e-title,
210
213
  .e-bigger.e-small .e-calendar .e-header .e-title {
@@ -667,10 +670,22 @@ ejs-calendar {
667
670
  }
668
671
  .e-calendar .e-header .e-title:hover,
669
672
  .e-bigger.e-small .e-calendar .e-header .e-title:hover {
670
- color: #111827;
673
+ background: none;
671
674
  cursor: pointer;
672
675
  text-decoration: none;
673
676
  }
677
+ .e-calendar .e-header .e-title:focus,
678
+ .e-bigger.e-small .e-calendar .e-header .e-title:focus {
679
+ box-shadow: 0 0 0 1px #9ca3af;
680
+ background: none;
681
+ text-decoration: none;
682
+ }
683
+ .e-calendar .e-header .e-title:active,
684
+ .e-bigger.e-small .e-calendar .e-header .e-title:active {
685
+ box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
686
+ background: none;
687
+ text-decoration: none;
688
+ }
674
689
  .e-calendar .e-header .e-prev:hover > span, .e-calendar .e-header .e-next:hover > span,
675
690
  .e-bigger.e-small .e-calendar .e-header .e-prev:hover > span,
676
691
  .e-bigger.e-small .e-calendar .e-header .e-next:hover > span {
@@ -683,6 +698,11 @@ ejs-calendar {
683
698
  .e-bigger.e-small .e-calendar .e-header .e-next:hover {
684
699
  background: transparent;
685
700
  }
701
+ .e-calendar .e-header .e-prev:focus, .e-calendar .e-header .e-next:focus,
702
+ .e-bigger.e-small .e-calendar .e-header .e-prev:focus,
703
+ .e-bigger.e-small .e-calendar .e-header .e-next:focus {
704
+ box-shadow: 0 0 0 1px #9ca3af;
705
+ }
686
706
  .e-calendar .e-header .e-prev:active, .e-calendar .e-header .e-next:active,
687
707
  .e-bigger.e-small .e-calendar .e-header .e-prev:active,
688
708
  .e-bigger.e-small .e-calendar .e-header .e-next:active {
@@ -925,6 +945,11 @@ ejs-calendar {
925
945
  transform: scale(1);
926
946
  }
927
947
  }
948
+ .e-calendar .e-content-table .e-cell.e-focused-cell span.e-day {
949
+ box-shadow: 0 0 0 1px #9ca3af;
950
+ border-radius: 4px;
951
+ }
952
+
928
953
  /* stylelint-disable property-no-vendor-prefix */
929
954
  /* stylelint-disable-line no-empty-source */
930
955
  /*! component icons */