@syncfusion/ej2-vue-schedule 19.2.55 → 19.3.43

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-vue-schedule@*",
-  "_id": "@syncfusion/ej2-vue-schedule@19.2.51",
+  "_id": "@syncfusion/ej2-vue-schedule@19.5.10",
   "_inBundle": false,
-  "_integrity": "sha512-PbekaCiPxmkxBhuWAVFLkEHbalElX8I9+MuCwn9zHsCqhzpZEoZYBkNOendE/zUmoxsx0TzaJb74oOoKZReGvg==",
+  "_integrity": "sha512-JiHl7SBL2sXE+nI7LgsurwOtlsVj9BBqyJbYhLM3EtiFMRsHkhYLefTnYNYNu9pkAhMglXpNC2me8PfFE5kBGQ==",
   "_location": "/@syncfusion/ej2-vue-schedule",
   "_phantomChildren": {},
   "_requested": {
@@ -19,8 +19,8 @@
   "_requiredBy": [
     "/"
   ],
-  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix/@syncfusion/ej2-vue-schedule/-/ej2-vue-schedule-19.2.51.tgz",
-  "_shasum": "8be0ba383445e65486176875081584525208d0d7",
+  "_resolved": "http://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-vue-schedule/-/ej2-vue-schedule-19.5.10.tgz",
+  "_shasum": "213dcc9a5fd2970a06cf36356d66a558b74eff06",
   "_spec": "@syncfusion/ej2-vue-schedule@*",
   "_where": "/jenkins/workspace/automation_release_19.1.0.1-ZPMUBNQ6AUYH6YGEFBPVYMEQLRRW2SLD4XCZ6GATNZJFYJ3RIAOA/packages/included",
   "author": {
@@ -31,9 +31,9 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~19.2.55",
-    "@syncfusion/ej2-schedule": "19.2.55",
-    "@syncfusion/ej2-vue-base": "~19.2.55"
+    "@syncfusion/ej2-base": "~19.3.43",
+    "@syncfusion/ej2-schedule": "19.3.43",
+    "@syncfusion/ej2-vue-base": "~19.3.43"
   },
   "deprecated": false,
   "description": "Flexible scheduling library with more built-in features and enhanced customization options similar to outlook and google calendar, allowing the users to plan and manage their appointments with efficient data-binding support. for Vue",
@@ -70,6 +70,6 @@
     "type": "git",
     "url": "git+https://github.com/syncfusion/ej2-vue-ui-components.git"
   },
-  "version": "19.2.55",
+  "version": "19.3.43",
   "sideEffects": false
 }

package/src/recurrence-editor/recurrenceeditor.component.d.ts

@@ -23,7 +23,9 @@ export declare class RecurrenceEditorComponent extends ComponentBase {
     };
     tagNameMapper: Object;
     isVue3: boolean;
+    templateCollection: any;
     constructor();
+    clearTemplate(templateNames?: string[]): any;
     setProperties(prop: any, muteOnChange: boolean): void;
     render(createElement: any): any;
     getRecurrenceDates(startDate: Object, rule: string, excludeDate?: string, maximumCount?: number, viewDate?: Object): number[];

package/src/recurrence-editor/recurrenceeditor.component.js

@@ -18,7 +18,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { ComponentBase, EJComponentDecorator, getProps, gh } from '@syncfusion/ej2-vue-base';
-import { isNullOrUndefined } from '@syncfusion/ej2-base';
+import { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
 import { RecurrenceEditor } from '@syncfusion/ej2-schedule';
 import { Options } from 'vue-class-component';
 export var properties = ['calendarMode', 'cssClass', 'dateFormat', 'enablePersistence', 'enableRtl', 'firstDayOfWeek', 'frequencies', 'locale', 'maxDate', 'minDate', 'selectedType', 'startDate', 'value', 'change'];
@@ -54,8 +54,33 @@ var RecurrenceEditorComponent = /** @class */ (function (_super) {
         _this.bindProperties();
         _this.ej2Instances._setProperties = _this.ej2Instances.setProperties;
         _this.ej2Instances.setProperties = _this.setProperties;
+        _this.ej2Instances.clearTemplate = _this.clearTemplate;
         return _this;
     }
+    RecurrenceEditorComponent.prototype.clearTemplate = function (templateNames) {
+        if (!templateNames) {
+            templateNames = Object.keys(this.templateCollection || {});
+        }
+        if (templateNames.length && this.templateCollection) {
+            for (var _i = 0, templateNames_1 = templateNames; _i < templateNames_1.length; _i++) {
+                var tempName = templateNames_1[_i];
+                var elementCollection = this.templateCollection[tempName];
+                if (elementCollection && elementCollection.length) {
+                    for (var _a = 0, elementCollection_1 = elementCollection; _a < elementCollection_1.length; _a++) {
+                        var ele = elementCollection_1[_a];
+                        var destroy = getValue('__vue__.$destroy', ele);
+                        if (destroy) {
+                            ele.__vue__.$destroy();
+                        }
+                        if (ele.innerHTML) {
+                            ele.innerHTML = '';
+                        }
+                    }
+                    delete this.templateCollection[tempName];
+                }
+            }
+        }
+    };
     RecurrenceEditorComponent.prototype.setProperties = function (prop, muteOnChange) {
         var _this = this;
         if (this.isVue3) {
@@ -73,6 +98,7 @@ var RecurrenceEditorComponent = /** @class */ (function (_super) {
                         }
                         else {
                             _this.$emit('update:' + key, prop[key]);
+                            _this.$emit('modelchanged', prop[key]);
                         }
                     }
                 });

package/src/schedule/schedule.component.d.ts

@@ -23,7 +23,9 @@ export declare class ScheduleComponent extends ComponentBase {
     };
     tagNameMapper: Object;
     isVue3: boolean;
+    templateCollection: any;
     constructor();
+    clearTemplate(templateNames?: string[]): any;
     setProperties(prop: any, muteOnChange: boolean): void;
     trigger(eventName: string, eventProp: {
         [key: string]: Object;
@@ -59,7 +61,9 @@ export declare class ScheduleComponent extends ComponentBase {
     isSlotAvailable(startTime: Object | Object, endTime?: Object, groupIndex?: number): boolean;
     openEditor(data: Object, action: Object, isEventData?: boolean, repeatType?: number): void;
     print(printOptions?: Object): void;
-    refreshEvents(): void;
+    refreshEvents(isRemoteRefresh: boolean): void;
+    refreshLayout(): void;
+    refreshTemplates(templateName: string): void;
     removeResource(resourceId: string | string[] | number | number[], name: string): void;
     resetWorkHours(dates: Object[], start?: string, end?: string, groupIndex?: number): void;
     saveEvent(data: Object | Object[], currentAction?: Object): void;

package/src/schedule/schedule.component.js

@@ -19,13 +19,13 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { isUndefined } from '@syncfusion/ej2-base';
 import { ComponentBase, EJComponentDecorator, getProps, gh } from '@syncfusion/ej2-vue-base';
-import { isNullOrUndefined } from '@syncfusion/ej2-base';
+import { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
 import { Schedule } from '@syncfusion/ej2-schedule';
 import { ViewsDirective, ViewDirective, ViewsPlugin, ViewPlugin } from './views.directive';
 import { ResourcesDirective, ResourceDirective, ResourcesPlugin, ResourcePlugin } from './resources.directive';
 import { HeaderRowsDirective, HeaderRowDirective, HeaderRowsPlugin, HeaderRowPlugin } from './headerrows.directive';
 import { Options } from 'vue-class-component';
-export var properties = ['agendaDaysCount', 'allowDragAndDrop', 'allowInline', 'allowKeyboardInteraction', 'allowMultiCellSelection', 'allowMultiDrag', 'allowMultiRowSelection', 'allowResizing', 'calendarMode', 'cellHeaderTemplate', 'cellTemplate', 'cssClass', 'currentView', 'dateFormat', 'dateHeaderTemplate', 'dayHeaderTemplate', 'editorTemplate', 'enableAdaptiveUI', 'enableAllDayScroll', 'enablePersistence', 'enableRecurrenceValidation', 'enableRtl', 'endHour', 'eventDragArea', 'eventSettings', 'firstDayOfWeek', 'firstMonthOfYear', 'group', 'headerRows', 'height', 'hideEmptyAgendaDays', 'locale', 'maxDate', 'minDate', 'monthHeaderTemplate', 'monthsCount', 'quickInfoOnSelectionEnd', 'quickInfoTemplates', 'readonly', 'resourceHeaderTemplate', 'resources', 'rowAutoHeight', 'selectedDate', 'showHeaderBar', 'showQuickInfo', 'showTimeIndicator', 'showWeekNumber', 'showWeekend', 'startHour', 'timeFormat', 'timeScale', 'timezone', 'views', 'weekRule', 'width', 'workDays', 'workHours', 'actionBegin', 'actionComplete', 'actionFailure', 'cellClick', 'cellDoubleClick', 'created', 'dataBinding', 'dataBound', 'destroyed', 'drag', 'dragStart', 'dragStop', 'eventClick', 'eventRendered', 'hover', 'moreEventsClick', 'navigating', 'popupClose', 'popupOpen', 'renderCell', 'resizeStart', 'resizeStop', 'resizing', 'select'];
+export var properties = ['agendaDaysCount', 'allowDragAndDrop', 'allowInline', 'allowKeyboardInteraction', 'allowMultiCellSelection', 'allowMultiDrag', 'allowMultiRowSelection', 'allowResizing', 'calendarMode', 'cellHeaderTemplate', 'cellTemplate', 'cssClass', 'currentView', 'dateFormat', 'dateHeaderTemplate', 'dayHeaderTemplate', 'editorTemplate', 'enableAdaptiveUI', 'enableAllDayScroll', 'enablePersistence', 'enableRecurrenceValidation', 'enableRtl', 'endHour', 'eventDragArea', 'eventSettings', 'firstDayOfWeek', 'firstMonthOfYear', 'group', 'headerIndentTemplate', 'headerRows', 'height', 'hideEmptyAgendaDays', 'locale', 'maxDate', 'minDate', 'monthHeaderTemplate', 'monthsCount', 'quickInfoOnSelectionEnd', 'quickInfoTemplates', 'readonly', 'resourceHeaderTemplate', 'resources', 'rowAutoHeight', 'selectedDate', 'showHeaderBar', 'showQuickInfo', 'showTimeIndicator', 'showWeekNumber', 'showWeekend', 'startHour', 'timeFormat', 'timeScale', 'timezone', 'views', 'weekRule', 'width', 'workDays', 'workHours', 'actionBegin', 'actionComplete', 'actionFailure', 'cellClick', 'cellDoubleClick', 'created', 'dataBinding', 'dataBound', 'destroyed', 'drag', 'dragStart', 'dragStop', 'eventClick', 'eventRendered', 'hover', 'moreEventsClick', 'navigating', 'popupClose', 'popupOpen', 'renderCell', 'resizeStart', 'resizeStop', 'resizing', 'select'];
 export var modelProps = ['currentView', 'selectedDate'];
 export var testProp = getProps({ props: properties });
 export var props = testProp[0];
@@ -60,8 +60,33 @@ var ScheduleComponent = /** @class */ (function (_super) {
         _this.bindProperties();
         _this.ej2Instances._setProperties = _this.ej2Instances.setProperties;
         _this.ej2Instances.setProperties = _this.setProperties;
+        _this.ej2Instances.clearTemplate = _this.clearTemplate;
         return _this;
     }
+    ScheduleComponent.prototype.clearTemplate = function (templateNames) {
+        if (!templateNames) {
+            templateNames = Object.keys(this.templateCollection || {});
+        }
+        if (templateNames.length && this.templateCollection) {
+            for (var _i = 0, templateNames_1 = templateNames; _i < templateNames_1.length; _i++) {
+                var tempName = templateNames_1[_i];
+                var elementCollection = this.templateCollection[tempName];
+                if (elementCollection && elementCollection.length) {
+                    for (var _a = 0, elementCollection_1 = elementCollection; _a < elementCollection_1.length; _a++) {
+                        var ele = elementCollection_1[_a];
+                        var destroy = getValue('__vue__.$destroy', ele);
+                        if (destroy) {
+                            ele.__vue__.$destroy();
+                        }
+                        if (ele.innerHTML) {
+                            ele.innerHTML = '';
+                        }
+                    }
+                    delete this.templateCollection[tempName];
+                }
+            }
+        }
+    };
     ScheduleComponent.prototype.setProperties = function (prop, muteOnChange) {
         var _this = this;
         if (this.isVue3) {
@@ -79,6 +104,7 @@ var ScheduleComponent = /** @class */ (function (_super) {
                         }
                         else {
                             _this.$emit('update:' + key, prop[key]);
+                            _this.$emit('modelchanged', prop[key]);
                         }
                     }
                 });
@@ -219,8 +245,14 @@ var ScheduleComponent = /** @class */ (function (_super) {
     ScheduleComponent.prototype.print = function (printOptions) {
         return this.ej2Instances.print(printOptions);
     };
-    ScheduleComponent.prototype.refreshEvents = function () {
-        return this.ej2Instances.refreshEvents();
+    ScheduleComponent.prototype.refreshEvents = function (isRemoteRefresh) {
+        return this.ej2Instances.refreshEvents(isRemoteRefresh);
+    };
+    ScheduleComponent.prototype.refreshLayout = function () {
+        return this.ej2Instances.refreshLayout();
+    };
+    ScheduleComponent.prototype.refreshTemplates = function (templateName) {
+        return this.ej2Instances.refreshTemplates(templateName);
     };
     ScheduleComponent.prototype.removeResource = function (resourceId, name) {
         return this.ej2Instances.removeResource(resourceId, name);

package/styles/bootstrap-dark.css

@@ -218,7 +218,6 @@
   box-shadow: none;
   margin-bottom: 0;
   min-height: 43px;
-  border-radius: 0;
 }
 
 .e-schedule .e-schedule-toolbar .e-active-view .e-tbar-btn-text,
@@ -227,22 +226,9 @@
 }
 
 .e-schedule .e-schedule-toolbar .e-toolbar-pop {
-  background: #131313;
   overflow: auto;
 }
 
-.e-schedule .e-schedule-toolbar .e-tbar-btn {
-  background: #131313;
-}
-
-.e-schedule .e-schedule-toolbar .e-tbar-btn:hover, .e-schedule .e-schedule-toolbar .e-tbar-btn:focus {
-  background-color: #393939;
-}
-
-.e-schedule .e-schedule-toolbar .e-tbar-btn:active {
-  background: #484848;
-}
-
 .e-schedule .e-schedule-toolbar .e-tbar-btn .e-tbar-btn-text {
   cursor: pointer;
   font-size: 14px;
@@ -267,13 +253,7 @@
   padding-top: 0;
 }
 
-.e-schedule .e-schedule-toolbar .e-toolbar-items .e-toolbar-left .e-tbar-btn.e-icon-btn:hover {
-  background: #393939;
-  border-radius: 4px;
-}
-
-.e-schedule .e-schedule-toolbar .e-toolbar-items .e-toolbar-left .e-tbar-btn.e-icon-btn:focus {
-  background: #393939;
+.e-schedule .e-schedule-toolbar .e-toolbar-items .e-toolbar-left .e-tbar-btn.e-icon-btn:focus, .e-schedule .e-schedule-toolbar .e-toolbar-items .e-toolbar-left .e-tbar-btn.e-icon-btn:hover {
   border-radius: 4px;
 }
 
@@ -314,16 +294,6 @@
   text-transform: initial;
 }
 
-.e-schedule .e-schedule-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn .e-tbar-btn-text {
-  cursor: pointer;
-  font-size: 14px;
-  text-transform: initial;
-}
-
-.e-schedule .e-schedule-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn.e-tbtn-txt .e-icons.e-btn-icon {
-  padding-left: 0;
-}
-
 .e-schedule .e-schedule-toolbar.e-rtl .e-hor-nav {
   background: #131313;
   border-left: 0;
@@ -336,7 +306,6 @@
 }
 
 .e-schedule .e-schedule-toolbar .e-hor-nav {
-  background: #131313;
   border-left: 1px solid #858585;
 }
 
@@ -547,6 +516,13 @@
   width: 100%;
 }
 
+.e-schedule .e-content-placeholder {
+  height: 100%;
+  position: relative;
+  width: 100%;
+  z-index: 99999;
+}
+
 .e-schedule .e-content-wrap,
 .e-schedule .e-scroll-container {
   -webkit-overflow-scrolling: touch;
@@ -586,7 +562,7 @@
 
 .e-schedule .e-block-appointment {
   background: rgba(255, 255, 255, 0.08);
-  border-radius: 2px;
+  border-radius: 4px;
   color: #969696;
   cursor: default;
   overflow: hidden;
@@ -776,8 +752,8 @@
 
 .e-schedule .e-vertical-view.e-timescale-disable .e-appointment {
   background: #0070f0;
-  border: 1px solid #248aff;
-  border-radius: 2px;
+  border: 1px solid #1a1a1a;
+  border-radius: 4px;
   color: #fff;
   display: -ms-flexbox;
   display: flex;
@@ -861,7 +837,7 @@
 .e-schedule .e-vertical-view.e-timescale-disable .e-more-indicator {
   color: #8d8d8d;
   cursor: pointer;
-  font-size: 12px;
+  font-size: 11px;
   line-height: 11px;
   overflow: hidden;
   padding: 2px 4px;
@@ -1052,7 +1028,7 @@
 }
 
 .e-schedule .e-vertical-view .e-date-header-wrap.e-all-day-scroll {
-  border-bottom: 1px solid #248aff;
+  border-bottom: 1px solid #1a1a1a;
   overflow-y: auto;
 }
 
@@ -1093,8 +1069,8 @@
 
 .e-schedule .e-vertical-view .e-all-day-appointment-wrapper .e-appointment {
   background: #0070f0;
-  border: 1px solid #248aff;
-  border-radius: 2px;
+  border: 1px solid #1a1a1a;
+  border-radius: 4px;
   color: #fff;
   display: -ms-flexbox;
   display: flex;
@@ -1151,8 +1127,8 @@
 
 .e-schedule .e-vertical-view .e-day-wrapper .e-appointment {
   background: #0070f0;
-  border: 1px solid #248aff;
-  border-radius: 2px;
+  border: 1px solid #1a1a1a;
+  border-radius: 4px;
   color: #fff;
   overflow: hidden;
   position: absolute;
@@ -1442,8 +1418,8 @@
 
 .e-schedule .e-month-view .e-appointment {
   background: #0070f0;
-  border: 1px solid #248aff;
-  border-radius: 2px;
+  border: 1px solid #1a1a1a;
+  border-radius: 4px;
   color: #fff;
   cursor: default;
   display: -ms-flexbox;
@@ -1511,7 +1487,7 @@
 .e-schedule .e-month-view .e-more-indicator {
   color: #8d8d8d;
   cursor: pointer;
-  font-size: 12px;
+  font-size: 11px;
   line-height: 11px;
   overflow: hidden;
   padding: 2px 4px;
@@ -1741,6 +1717,7 @@
   border-style: solid;
   border-width: 0 1px 1px 0;
   color: #f0f0f0;
+  padding: 0;
 }
 
 .e-schedule .e-timeline-year-view .e-work-cells:hover:not(.e-other-month) {
@@ -1844,7 +1821,7 @@
 
 .e-schedule .e-timeline-year-view .e-month-header,
 .e-schedule .e-timeline-year-view .e-work-cells {
-  height: 70px;
+  height: 75px;
 }
 
 .e-schedule .e-timeline-year-view .e-header-cells,
@@ -1885,8 +1862,8 @@
 
 .e-schedule .e-timeline-year-view .e-event-table .e-appointment {
   background: #0070f0;
-  border: 1px solid #248aff;
-  border-radius: 2px;
+  border: 1px solid #1a1a1a;
+  border-radius: 4px;
   color: #fff;
   cursor: default;
   display: -ms-flexbox;
@@ -1964,7 +1941,7 @@
 .e-schedule .e-timeline-year-view .e-event-table .e-more-indicator {
   color: #8d8d8d;
   cursor: pointer;
-  font-size: 12px;
+  font-size: 11px;
   line-height: 11px;
   overflow: hidden;
   padding: 2px 4px;
@@ -2095,13 +2072,6 @@
   background-color: #393939;
 }
 
-.e-schedule .e-timeline-view .e-resource-cells:focus .e-resource-tree-icon,
-.e-schedule .e-timeline-month-view .e-resource-cells:focus .e-resource-tree-icon {
-  background-color: #484848;
-  border-radius: 50%;
-  color: #fff;
-}
-
 .e-schedule .e-timeline-view .e-resource-column-wrap,
 .e-schedule .e-timeline-month-view .e-resource-column-wrap {
   overflow: hidden;
@@ -2125,6 +2095,12 @@
   height: 42px;
 }
 
+.e-schedule .e-timeline-view.e-virtual-mask .e-work-cells,
+.e-schedule .e-timeline-month-view.e-virtual-mask .e-work-cells {
+  background-color: rgba(0, 0, 0, 0.08);
+  box-shadow: inset 0 0 0 8px #2a2a2a;
+}
+
 .e-schedule .e-timeline-view .e-resource-tree-icon,
 .e-schedule .e-timeline-month-view .e-resource-tree-icon {
   color: #fff;
@@ -2158,8 +2134,8 @@
 .e-schedule .e-timeline-view .e-appointment,
 .e-schedule .e-timeline-month-view .e-appointment {
   background: #0070f0;
-  border: 1px solid #248aff;
-  border-radius: 2px;
+  border: 1px solid #1a1a1a;
+  border-radius: 4px;
   color: #fff;
   cursor: default;
   display: -ms-flexbox;
@@ -2211,6 +2187,7 @@
 .e-schedule .e-timeline-view .e-appointment .e-time,
 .e-schedule .e-timeline-month-view .e-appointment .e-time {
   display: block;
+  line-height: 1.4;
 }
 
 .e-schedule .e-timeline-view .e-appointment .e-disable,
@@ -2261,7 +2238,7 @@
 .e-schedule .e-timeline-month-view .e-more-indicator {
   color: #8d8d8d;
   cursor: pointer;
-  font-size: 12px;
+  font-size: 11px;
   line-height: 11px;
   overflow: hidden;
   padding: 2px 4px;
@@ -2387,6 +2364,7 @@
 
 .e-schedule .e-month-agenda-view .e-week-number-wrapper .e-week-number {
   border-right: 1px solid #505050;
+  height: 40px;
   padding-top: 8px;
 }
 
@@ -2542,7 +2520,7 @@
   padding: 0;
 }
 
-.e-schedule .e-month-agenda-view .e-appointment-indicator {
+.e-schedule .e-month-agenda-view .e-work-cells .e-appointment-indicator {
   background: #0070f0;
   border-radius: 50%;
   height: 6px;
@@ -3876,7 +3854,7 @@
 
 .e-appointment.e-schedule-event-clone {
   background: #0070f0;
-  border-radius: 2px;
+  border-radius: 4px;
   box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2);
   color: #fff;
   display: -ms-flexbox;
@@ -4053,7 +4031,7 @@
 
 .e-more-popup-wrapper .e-appointment {
   background: #0070f0;
-  border-radius: 2px;
+  border-radius: 4px;
   color: #fff;
   display: -ms-flexbox;
   display: flex;
@@ -4201,6 +4179,7 @@
   border-color: #505050;
   border-style: solid;
   border-width: 0 0 1px 1px;
+  padding: 0;
 }
 
 .e-schedule .e-vertical-view .e-work-cells:hover {
@@ -4286,6 +4265,7 @@
   border-style: solid;
   border-width: 0 0 1px 1px;
   color: #f0f0f0;
+  padding: 0;
 }
 
 .e-schedule .e-month-view .e-work-cells:hover,
@@ -4374,6 +4354,7 @@
   border-style: solid;
   border-width: 0 0 1px 1px;
   color: #f0f0f0;
+  padding: 0;
 }
 
 .e-schedule .e-timeline-view .e-work-cells:hover:not(.e-resource-group-cells),
@@ -4382,6 +4363,11 @@
   color: #fff;
 }
 
+.e-schedule .e-timeline-view.e-virtual-mask .e-work-cells:hover,
+.e-schedule .e-timeline-month-view.e-virtual-mask .e-work-cells:hover {
+  background-color: rgba(0, 0, 0, 0.08);
+}
+
 .e-schedule .e-timeline-view .e-work-days,
 .e-schedule .e-timeline-month-view .e-work-days {
   background-color: #1a1a1a;
@@ -4581,10 +4567,6 @@
   padding-left: 10px;
 }
 
-.e-recurrenceeditor .e-icons {
-  height: 0;
-}
-
 .e-recurrenceeditor .e-input-wrapper-side.e-form-left {
   padding: 0 8px 10px 0;
 }