@syncfusion/ej2-schedule 21.2.10 → 22.1.34

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 21.2.10
+*  version : 22.1.34
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-schedule@*",
-  "_id": "@syncfusion/ej2-schedule@21.2.9",
+  "_id": "@syncfusion/ej2-schedule@21.4.0",
   "_inBundle": false,
-  "_integrity": "sha512-w0xxAq2mqnZo3rKNxml0d2qPUTG89tD6ahom2fkOKLliJ3U+7xlIYzoHYvDenIzGYUgtqEVctIxrNQYJDAg+Qw==",
+  "_integrity": "sha512-EZAbpScHUedLn/uzkEFqw32MbJvnJZEH0HdWSwd5aamBAKQfk/bVvdFk/KFx+cNb6uRO/ME+NwpDrsVNYIdcGA==",
   "_location": "/@syncfusion/ej2-schedule",
   "_phantomChildren": {},
   "_requested": {
@@ -23,8 +23,8 @@
     "/@syncfusion/ej2-react-schedule",
     "/@syncfusion/ej2-vue-schedule"
   ],
-  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-schedule/-/ej2-schedule-21.2.9.tgz",
-  "_shasum": "337678dc579849fe4bf8c97031aee088ca111724",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-schedule/-/ej2-schedule-21.4.0.tgz",
+  "_shasum": "4b5dfc8fd8a5960fc918df9a8bd2ff69c5933424",
   "_spec": "@syncfusion/ej2-schedule@*",
   "_where": "/jenkins/workspace/elease-automation_release_21.1.1/packages/included",
   "author": {
@@ -35,16 +35,16 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~21.2.9",
-    "@syncfusion/ej2-buttons": "~21.2.10",
-    "@syncfusion/ej2-calendars": "~21.2.10",
-    "@syncfusion/ej2-data": "~21.2.9",
-    "@syncfusion/ej2-dropdowns": "~21.2.10",
-    "@syncfusion/ej2-excel-export": "~21.2.8",
-    "@syncfusion/ej2-inputs": "~21.2.9",
-    "@syncfusion/ej2-lists": "~21.2.9",
-    "@syncfusion/ej2-navigations": "~21.2.9",
-    "@syncfusion/ej2-popups": "~21.2.10"
+    "@syncfusion/ej2-base": "~22.1.34",
+    "@syncfusion/ej2-buttons": "~22.1.34",
+    "@syncfusion/ej2-calendars": "~22.1.34",
+    "@syncfusion/ej2-data": "~22.1.34",
+    "@syncfusion/ej2-dropdowns": "~22.1.34",
+    "@syncfusion/ej2-excel-export": "~22.1.34",
+    "@syncfusion/ej2-inputs": "~22.1.34",
+    "@syncfusion/ej2-lists": "~22.1.34",
+    "@syncfusion/ej2-navigations": "~22.1.34",
+    "@syncfusion/ej2-popups": "~22.1.34"
   },
   "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.",
@@ -73,6 +73,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "21.2.10",
+  "version": "22.1.34",
   "sideEffects": false
 }

package/src/recurrence-editor/recurrence-editor-model.d.ts

@@ -1,5 +1,5 @@
 import { Component, Property, NotifyPropertyChanges, INotifyPropertyChanged, Event, Browser, detach } from '@syncfusion/ej2-base';import { EmitType, getDefaultDateObject, getValue, cldrData, L10n, isNullOrUndefined, removeClass, addClass } from '@syncfusion/ej2-base';import { DropDownList, ChangeEventArgs } from '@syncfusion/ej2-dropdowns';import { NumericTextBox } from '@syncfusion/ej2-inputs';import { DatePicker, ChangedEventArgs } from '@syncfusion/ej2-calendars';import { Button, RadioButton } from '@syncfusion/ej2-buttons';import { EventHandler, MouseEventArgs, classList } from '@syncfusion/ej2-base';import { EJ2Instance } from '../schedule/base/interface';import { RecRule, extractObjectFromRule, generate, generateSummary, getRecurrenceStringFromDate, getCalendarUtil } from './date-generator';import { CalendarUtil, CalendarType } from '../common/calendar-util';import { capitalizeFirstWord } from '../schedule/base/util';
-import {RepeatType,RecurrenceEditorChangeEventArgs} from "./recurrence-editor";
+import {RepeatType,EndType,RecurrenceEditorChangeEventArgs} from "./recurrence-editor";
 import {ComponentModel} from '@syncfusion/ej2-base';
 
 /**
@@ -14,6 +14,13 @@ export interface RecurrenceEditorModel extends ComponentModel{
      */
     frequencies?: RepeatType[];
 
+    /**
+     * Sets the type of recurrence end for the recurrence pattern on the editor.
+     *
+     * @default ['never', 'until', 'count']
+     */
+    endTypes?: EndType[];
+
     /**
      * Sets the first day of the week.
      *

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

@@ -21,6 +21,12 @@ export declare class RecurrenceEditor extends Component<HTMLElement> implements
      * @default ['none', 'daily', 'weekly', 'monthly', 'yearly']
      */
     frequencies: RepeatType[];
+    /**
+     * Sets the type of recurrence end for the recurrence pattern on the editor.
+     *
+     * @default ['never', 'until', 'count']
+     */
+    endTypes: EndType[];
     /**
      * Sets the first day of the week.
      *
@@ -214,3 +220,14 @@ export interface RecurrenceEditorChangeEventArgs {
  * ```
  */
 export declare type RepeatType = 'none' | 'daily' | 'weekly' | 'monthly' | 'yearly';
+/**
+* Defines the available types of recurrence end for the recurrence editor.
+* ```props
+* The following options are available:
+*
+* never :- Denotes that the recurrence has no end date and continues indefinitely.
+* until :- Denotes that the recurrence ends on a specified date.
+* count :- Denotes that the recurrence ends after a specified number of occurrences.
+* ```
+*/
+export declare type EndType = 'never' | 'until' | 'count';

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

@@ -232,7 +232,7 @@ var RecurrenceEditor = /** @class */ (function (_super) {
         }
         else {
             if (!isNullOrUndefined(this.repeatType.value)) {
-                this.startState(this.repeatType.value.toString().toUpperCase(), NEVER, this.startDate);
+                this.startState(this.repeatType.value.toString().toUpperCase(), this.endTypes[0], this.startDate);
                 this.updateForm(this.repeatType.value.toString());
             }
             if (this.selectedType > 0) {
@@ -621,11 +621,10 @@ var RecurrenceEditor = /** @class */ (function (_super) {
         }
     };
     RecurrenceEditor.prototype.getEndData = function () {
-        var endData = [NEVER, UNTIL, COUNT];
         // eslint-disable-next-line @typescript-eslint/no-this-alias
         var self = this;
         var dataSource = [];
-        endData.forEach(function (data) {
+        this.endTypes.forEach(function (data) {
             dataSource.push({ text: self.localeObj.getConstant(data), value: data });
         });
         return dataSource;
@@ -925,7 +924,7 @@ var RecurrenceEditor = /** @class */ (function (_super) {
         this.monthButtons = [];
     };
     RecurrenceEditor.prototype.resetFields = function () {
-        this.startState(NONE, NEVER, this.startDate);
+        this.startState(NONE, this.endTypes[0], this.startDate);
         this.setDefaultValue();
     };
     RecurrenceEditor.prototype.updateRuleUntilDate = function (startDate) {
@@ -1110,6 +1109,7 @@ var RecurrenceEditor = /** @class */ (function (_super) {
                 case 'locale':
                 case 'frequencies':
                 case 'firstDayOfWeek':
+                case 'endTypes':
                     this.refresh();
                     break;
                 case 'dateFormat':
@@ -1121,6 +1121,9 @@ var RecurrenceEditor = /** @class */ (function (_super) {
     __decorate([
         Property(['none', 'daily', 'weekly', 'monthly', 'yearly'])
     ], RecurrenceEditor.prototype, "frequencies", void 0);
+    __decorate([
+        Property(['never', 'until', 'count'])
+    ], RecurrenceEditor.prototype, "endTypes", void 0);
     __decorate([
         Property(0)
     ], RecurrenceEditor.prototype, "firstDayOfWeek", void 0);

package/src/schedule/actions/keyboard.js

@@ -606,6 +606,7 @@ var KeyboardInteraction = /** @class */ (function () {
                         return;
                     }
                 }
+                e.preventDefault();
                 this.selectCells(isMultiple, targetCell);
             }
         }
@@ -653,6 +654,7 @@ var KeyboardInteraction = /** @class */ (function () {
                         return;
                     }
                 }
+                e.preventDefault();
                 this.selectCells(isMultiple, targetCell);
             }
         }

package/src/schedule/base/schedule-model.d.ts

@@ -325,15 +325,17 @@ export interface ScheduleModel extends ComponentModel{
      * {% codeBlock src='schedule/dateHeaderTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    dateHeaderTemplate?: string;
+    dateHeaderTemplate?: string | Function;
 
     /**
      * It accepts either the string or HTMLElement as template design content and parse it appropriately before displaying it onto the header date range.
      *
      * @default null
+     * @aspType string
      */
-    dateRangeTemplate?: string;
+    dateRangeTemplate?: string | Function;
 
     /**
      * It accepts either the string or HTMLElement as template design content and parse it appropriately before displaying it onto
@@ -342,8 +344,9 @@ export interface ScheduleModel extends ComponentModel{
      * {% codeBlock src='schedule/cellHeaderTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    cellHeaderTemplate?: string;
+    cellHeaderTemplate?: string | Function;
 
     /**
      * It accepts either the string or HTMLElement as template design content and parse it appropriately before displaying it onto
@@ -352,8 +355,9 @@ export interface ScheduleModel extends ComponentModel{
      * {% codeBlock src='schedule/dayHeaderTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    dayHeaderTemplate?: string;
+    dayHeaderTemplate?: string | Function;
 
     /**
      * It accepts either the string or HTMLElement as template design content and parse it appropriately before displaying it onto
@@ -362,8 +366,9 @@ export interface ScheduleModel extends ComponentModel{
      * {% codeBlock src='schedule/monthHeaderTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    monthHeaderTemplate?: string;
+    monthHeaderTemplate?: string | Function;
 
     /**
      * The template option which is used to render the customized work cells on the Schedule. Here, the template accepts either
@@ -378,8 +383,9 @@ export interface ScheduleModel extends ComponentModel{
      * {% codeBlock src='schedule/cellTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    cellTemplate?: string;
+    cellTemplate?: string | Function;
 
     /**
      * When set to `true`, makes the Schedule to render in a read only mode. No CRUD actions will be allowed at this time.
@@ -480,8 +486,9 @@ export interface ScheduleModel extends ComponentModel{
      * {% codeBlock src='schedule/editorTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    editorTemplate?: string;
+    editorTemplate?: string | Function;
 
     /**
      * The template option to customize the quick window. The three sections of the quick popup whereas the header, content,
@@ -566,8 +573,9 @@ export interface ScheduleModel extends ComponentModel{
      * {% codeBlock src='schedule/resourceHeaderTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    resourceHeaderTemplate?: string;
+    resourceHeaderTemplate?: string | Function;
 
     /**
      * Template option to customize the header indent bar. Here, the template accepts either
@@ -578,8 +586,9 @@ export interface ScheduleModel extends ComponentModel{
      * {% codeBlock src='schedule/headerIndentTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    headerIndentTemplate?: string;
+    headerIndentTemplate?: string | Function;
 
     /**
      * Allows defining the group related settings of multiple resources. When this property is non-empty, it means

package/src/schedule/base/schedule.d.ts

@@ -426,14 +426,16 @@ export declare class Schedule extends Component<HTMLElement> implements INotifyP
      * {% codeBlock src='schedule/dateHeaderTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    dateHeaderTemplate: string;
+    dateHeaderTemplate: string | Function;
     /**
      * It accepts either the string or HTMLElement as template design content and parse it appropriately before displaying it onto the header date range.
      *
      * @default null
+     * @aspType string
      */
-    dateRangeTemplate: string;
+    dateRangeTemplate: string | Function;
     /**
      * It accepts either the string or HTMLElement as template design content and parse it appropriately before displaying it onto
      * the month date cells. This template is only applicable for month view day cells.
@@ -441,8 +443,9 @@ export declare class Schedule extends Component<HTMLElement> implements INotifyP
      * {% codeBlock src='schedule/cellHeaderTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    cellHeaderTemplate: string;
+    cellHeaderTemplate: string | Function;
     /**
      * It accepts either the string or HTMLElement as template design content and parse it appropriately before displaying it onto
      * the day header cells. This template is only applicable for year view header cells.
@@ -450,8 +453,9 @@ export declare class Schedule extends Component<HTMLElement> implements INotifyP
      * {% codeBlock src='schedule/dayHeaderTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    dayHeaderTemplate: string;
+    dayHeaderTemplate: string | Function;
     /**
      * It accepts either the string or HTMLElement as template design content and parse it appropriately before displaying it onto
      * the month header cells. This template is only applicable for year view header cells.
@@ -459,8 +463,9 @@ export declare class Schedule extends Component<HTMLElement> implements INotifyP
      * {% codeBlock src='schedule/monthHeaderTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    monthHeaderTemplate: string;
+    monthHeaderTemplate: string | Function;
     /**
      * The template option which is used to render the customized work cells on the Schedule. Here, the template accepts either
      *  the string or HTMLElement as template design and then the parsed design is displayed onto the work cells.
@@ -474,8 +479,9 @@ export declare class Schedule extends Component<HTMLElement> implements INotifyP
      * {% codeBlock src='schedule/cellTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    cellTemplate: string;
+    cellTemplate: string | Function;
     /**
      * When set to `true`, makes the Schedule to render in a read only mode. No CRUD actions will be allowed at this time.
      *
@@ -565,8 +571,9 @@ export declare class Schedule extends Component<HTMLElement> implements INotifyP
      * {% codeBlock src='schedule/editorTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    editorTemplate: string;
+    editorTemplate: string | Function;
     /**
      * The template option to customize the quick window. The three sections of the quick popup whereas the header, content,
      * and footer can be easily customized with individual template option.
@@ -643,8 +650,9 @@ export declare class Schedule extends Component<HTMLElement> implements INotifyP
      * {% codeBlock src='schedule/resourceHeaderTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    resourceHeaderTemplate: string;
+    resourceHeaderTemplate: string | Function;
     /**
      * Template option to customize the header indent bar. Here, the template accepts either
      *  the string or HTMLElement as template design and then the parsed design is displayed onto the header indent cell.
@@ -654,8 +662,9 @@ export declare class Schedule extends Component<HTMLElement> implements INotifyP
      * {% codeBlock src='schedule/headerIndentTemplate/index.md' %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    headerIndentTemplate: string;
+    headerIndentTemplate: string | Function;
     /**
      * Allows defining the group related settings of multiple resources. When this property is non-empty, it means
      * that the resources will be grouped on the schedule layout based on the provided resource names.
@@ -1271,11 +1280,11 @@ export declare class Schedule extends Component<HTMLElement> implements INotifyP
     /**
      * Method to process the templates
      *
-     * @param {string} template Accepts the template in string
+     * @param {string | Function} template Accepts the template in string
      * @returns {CallbackFunction} Returns the callback function
      * @private
      */
-    templateParser(template: string): CallbackFunction;
+    templateParser(template: string | Function): CallbackFunction;
     /**
      * Retrieves the selected cells.
      *

package/src/schedule/base/schedule.js

@@ -696,7 +696,11 @@ var Schedule = /** @class */ (function (_super) {
             };
         }
         this.currentTimezoneDate = this.getCurrentTime();
-        this.activeCellsData = { startTime: new Date(this.currentTimezoneDate), endTime: new Date(this.currentTimezoneDate), isAllDay: false };
+        this.activeCellsData = {
+            startTime: new Date(this.currentTimezoneDate),
+            endTime: new Date(this.currentTimezoneDate),
+            isAllDay: false
+        };
         this.activeEventData = { event: undefined, element: undefined };
         this.getDefaultLocale();
         this.localeObj = new L10n(this.getModuleName(), this.defaultLocale, this.locale);
@@ -1182,18 +1186,23 @@ var Schedule = /** @class */ (function (_super) {
     /**
      * Method to process the templates
      *
-     * @param {string} template Accepts the template in string
+     * @param {string | Function} template Accepts the template in string
      * @returns {CallbackFunction} Returns the callback function
      * @private
      */
     Schedule.prototype.templateParser = function (template) {
         if (template) {
             try {
-                if (document.querySelectorAll(template).length) {
-                    return compile(document.querySelector(template).innerHTML.trim());
+                if (typeof template === 'function') {
+                    return compile(template);
                 }
                 else {
-                    return compile(template);
+                    if (document.querySelectorAll(template).length) {
+                        return compile(document.querySelector(template).innerHTML.trim());
+                    }
+                    else {
+                        return compile(template);
+                    }
                 }
             }
             catch (error) {

package/src/schedule/models/event-settings-model.d.ts

@@ -11,8 +11,9 @@ export interface EventSettingsModel {
      * {% codeBlock src="schedule/event-template-api/index.ts" %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    template?: string;
+    template?: string | Function;
 
     /**
      * With this property, the event data will be bound to Schedule.
@@ -73,8 +74,9 @@ export interface EventSettingsModel {
      * {% codeBlock src="schedule/tooltip-template-api/index.ts" %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    tooltipTemplate?: string;
+    tooltipTemplate?: string | Function;
 
     /**
      * Defines the resource name, to decides the color of which particular resource level is to be applied on appointments, when

package/src/schedule/models/event-settings.d.ts

@@ -13,8 +13,9 @@ export declare class EventSettings extends ChildProperty<EventSettings> {
      * {% codeBlock src="schedule/event-template-api/index.ts" %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    template: string;
+    template: string | Function;
     /**
      * With this property, the event data will be bound to Schedule.
      * The event data can be passed either as an array of JavaScript objects,
@@ -68,8 +69,9 @@ export declare class EventSettings extends ChildProperty<EventSettings> {
      * {% codeBlock src="schedule/tooltip-template-api/index.ts" %}{% endcodeBlock %}
      *
      * @default null
+     * @aspType string
      */
-    tooltipTemplate: string;
+    tooltipTemplate: string | Function;
     /**
      * Defines the resource name, to decides the color of which particular resource level is to be applied on appointments, when
      *  grouping is enabled on scheduler.

package/src/schedule/models/group-model.d.ts

@@ -51,8 +51,9 @@ export interface GroupModel {
      *  can be accessed within this template code.
      *
      * @default null
+     * @aspType string
      */
-    headerTooltipTemplate?: string;
+    headerTooltipTemplate?: string | Function;
 
     /**
      * Decides whether to show/hide the non-working days. It is set to `false` by default and when set to `true`, it hides the non-working days.

package/src/schedule/models/group.d.ts

@@ -44,8 +44,9 @@ export declare class Group extends ChildProperty<Group> {
      *  can be accessed within this template code.
      *
      * @default null
+     * @aspType string
      */
-    headerTooltipTemplate: string;
+    headerTooltipTemplate: string | Function;
     /**
      * Decides whether to show/hide the non-working days. It is set to `false` by default and when set to `true`, it hides the non-working days.
      * This property is applicable for `Day`, `Week`, `WorkWeek` and `month` views, which are grouped under date.

package/src/schedule/models/header-rows-model.d.ts

@@ -23,7 +23,8 @@ export interface HeaderRowsModel {
      *  can be accessed via this template is `date`.
      *
      * @default null
+     * @aspType string
      */
-    template?: string;
+    template?: string | Function;
 
 }

package/src/schedule/models/header-rows.d.ts

@@ -21,6 +21,7 @@ export declare class HeaderRows extends ChildProperty<HeaderRows> {
      *  can be accessed via this template is `date`.
      *
      * @default null
+     * @aspType string
      */
-    template: string;
+    template: string | Function;
 }

package/src/schedule/models/quick-info-templates-model.d.ts

@@ -20,21 +20,24 @@ export interface QuickInfoTemplatesModel {
      * Template option to customize the header section of quick popup.
      *
      *  @default null
+     *  @aspType string
      */
-    header?: string;
+    header?: string | Function;
 
     /**
      * Template option to customize the content area of the quick popup.
      *
      *  @default null
+     *  @aspType string
      */
-    content?: string;
+    content?: string | Function;
 
     /**
      * Template option to customize the footer section of quick popup.
      *
      *  @default null
+     *  @aspType string
      */
-    footer?: string;
+    footer?: string | Function;
 
 }

package/src/schedule/models/quick-info-templates.d.ts

@@ -18,18 +18,21 @@ export declare class QuickInfoTemplates extends ChildProperty<QuickInfoTemplates
      * Template option to customize the header section of quick popup.
      *
      *  @default null
+     *  @aspType string
      */
-    header: string;
+    header: string | Function;
     /**
      * Template option to customize the content area of the quick popup.
      *
      *  @default null
+     *  @aspType string
      */
-    content: string;
+    content: string | Function;
     /**
      * Template option to customize the footer section of quick popup.
      *
      *  @default null
+     *  @aspType string
      */
-    footer: string;
+    footer: string | Function;
 }

package/src/schedule/models/time-scale-model.d.ts

@@ -34,8 +34,9 @@ export interface TimeScaleModel {
      *  onto the time cells. The time details can be accessed within this template.
      *
      *  @default null
+     *  @aspType string
      */
-    minorSlotTemplate?: string;
+    minorSlotTemplate?: string | Function;
 
     /**
      * The template option to be applied for major time slot. Here, the
@@ -43,7 +44,8 @@ export interface TimeScaleModel {
      *  onto the time cells. The time details can be accessed within this template.
      *
      * @default null
+     * @aspType string
      */
-    majorSlotTemplate?: string;
+    majorSlotTemplate?: string | Function;
 
 }

package/src/schedule/models/time-scale.d.ts

@@ -29,14 +29,16 @@ export declare class TimeScale extends ChildProperty<TimeScale> {
      *  onto the time cells. The time details can be accessed within this template.
      *
      *  @default null
+     *  @aspType string
      */
-    minorSlotTemplate: string;
+    minorSlotTemplate: string | Function;
     /**
      * The template option to be applied for major time slot. Here, the
      *  template accepts either the string or HTMLElement as template design and then the parsed design is displayed
      *  onto the time cells. The time details can be accessed within this template.
      *
      * @default null
+     * @aspType string
      */
-    majorSlotTemplate: string;
+    majorSlotTemplate: string | Function;
 }