@syncfusion/ej2-angular-schedule 31.1.21 → 31.2.2

package/CHANGELOG.md

@@ -6,7 +6,17 @@
 
 #### Bug fixes
 
+- `#I757470` - An issue where cells were misaligned and events were added to the wrong cell when using the `enableLazyLoading` property has been fixed.
+- `#I770447` - The issue where the tooltip displayed incorrect content in the `Year` view has been fixed.
+
+## 31.1.21 (2025-09-23)
+
+### Schedule
+
+#### Bug fixes
+
 - `#I746117`, `#I754057` - An issue where an empty content area was rendered during virtual scrolling when using `rowAutoHeight` in combination with `overscanCount` has been resolved.
+- `#F197352` - An issue that caused appointments to overlap in the `TimelineYear` view has been fixed.
 
 ## 31.1.20 (2025-09-10)
 

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@syncfusion/ej2-angular-schedule",
-  "version": "31.1.21",
+  "version": "31.2.2",
   "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 Angular",
   "author": "Syncfusion Inc.",
   "license": "SEE LICENSE IN license",
   "schematics": "./schematics/collection.json",
   "dependencies": {
-    "@syncfusion/ej2-base": "~31.1.20",
-    "@syncfusion/ej2-angular-base": "~31.1.17",
-    "@syncfusion/ej2-schedule": "31.1.21"
+    "@syncfusion/ej2-base": "~31.2.2",
+    "@syncfusion/ej2-angular-base": "~31.2.2",
+    "@syncfusion/ej2-schedule": "31.2.2"
   },
   "keywords": [
     "angular",

package/schematics/collection.json

@@ -1,40 +1,11 @@
 {
-  "$schema": "./node_modules/@angular-devkit/schematics/collection-schema.json",
-  "schematics": {
-    "ng-add": {
-      "description": "Adds Essential JS 2 specific Angular package to an application",
-      "factory": "./ng-add",
-      "schema": "./ng-add/schema.json"
-    },
-    "schedule-agenda-views": {
-      "description": "Creates an Angular Scheduler component with agenda and month-agenda views.",
-      "factory": "./generators/schedule-agenda-views",
-      "schema": "./generators/schedule-agenda-views/schema.json"
-    },
-    "schedule-calendar-views": {
-      "description": "Creates an Angular Scheduler component with calendar views.",
-      "factory": "./generators/schedule-calendar-views",
-      "schema": "./generators/schedule-calendar-views/schema.json"
-    },
-    "schedule-horizontal-grouping": {
-      "description": "Creates an Angular Scheduler component with horizontal grouping of resources.",
-      "factory": "./generators/schedule-horizontal-grouping",
-      "schema": "./generators/schedule-horizontal-grouping/schema.json"
-    },
-    "schedule-time-scale": {
-      "description": "Creates an Angular Scheduler component with modified timescale options.",
-      "factory": "./generators/schedule-time-scale",
-      "schema": "./generators/schedule-time-scale/schema.json"
-    },
-    "schedule-timeline-grouping": {
-      "description": "Creates an Angular Scheduler component with grouping of resources in timeline views.",
-      "factory": "./generators/schedule-timeline-grouping",
-      "schema": "./generators/schedule-timeline-grouping/schema.json"
-    },
-    "schedule-timeline-views": {
-      "description": "Creates an Angular Scheduler component with timeline views",
-      "factory": "./generators/schedule-timeline-views",
-      "schema": "./generators/schedule-timeline-views/schema.json"
-    }
-  }
-}
+                "$schema": "./node_modules/@angular-devkit/schematics/collection-schema.json",
+                "schematics": {
+                  "ng-add": {
+                    "description": "Adds Essential JS 2 specific Angular package to an application",
+                    "factory": "./ng-add",
+                    "schema": "./ng-add/schema.json"
+                  }
+                }
+              }
+              

package/schematics/ng-add/index.ts

@@ -1,10 +1,10 @@
-import { pkgName, pkgVer, moduleName, themeVer } from './../utils/lib-details';
-import { install } from '@syncfusion/ej2-angular-base/schematics';
-import { OptionsSchema, LibOptionsSchema } from './schema';
-import { Rule } from '@angular-devkit/schematics';
-
-export default function (options: OptionsSchema): Rule {
-	const libOptions: LibOptionsSchema = Object.assign({},
-		{ 'pkgName': pkgName, 'pkgVer': pkgVer, 'moduleName': moduleName, 'themeVer': themeVer });
-	return install(options, libOptions);
-}
+import { pkgName, pkgVer, moduleName, themeVer } from './../utils/lib-details';
+import { install } from '@syncfusion/ej2-angular-base/schematics';
+import { OptionsSchema, LibOptionsSchema } from './schema';
+import { Rule } from '@angular-devkit/schematics';
+
+export default function (options: OptionsSchema): Rule {
+	const libOptions: LibOptionsSchema = Object.assign({},
+		{ 'pkgName': pkgName, 'pkgVer': pkgVer, 'moduleName': moduleName, 'themeVer': themeVer });
+	return install(options, libOptions);
+}

package/schematics/ng-add/schema.json

@@ -1,34 +1,34 @@
-{
-  "$schema": "http://json-schema.org/schema",
-  "$id": "ngAdd",
-  "title": "Add Essential JS 2 Angular packages",
-  "type": "object",
-  "properties": {
-    "skipPackageJson": {
-      "type": "boolean",
-      "default": false,
-      "description": "Do not add add Essential JS 2 Angular packages dependencies to package.json (e.g., --skipPackageJson)"
-    },
-    "modules": {
-      "type": "string",
-      "default": "",
-      "description": "Add only specific Essential JS 2 modules to the app.module file (eg: --modules=slider, grid)"
-    },
-    "modulePath": {
-      "type": "string",
-      "default": "",
-      "description": "Used to specify the path of the module file where the EJ2 module needs to be imported"
-    },
-    "theme": {
-      "enum": [
-        "material",
-        "fabric",
-        "bootstrap",
-        "highcontrast"
-      ],
-      "default": "material",
-      "description": "Used to change the theme that needs to be imported"
-    }
-  },
-  "required": []
-}
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "ngAdd",
+  "title": "Add Essential JS 2 Angular packages",
+  "type": "object",
+  "properties": {
+    "skipPackageJson": {
+      "type": "boolean",
+      "default": false,
+      "description": "Do not add add Essential JS 2 Angular packages dependencies to package.json (e.g., --skipPackageJson)"
+    },
+    "modules": {
+      "type": "string",
+      "default": "",
+      "description": "Add only specific Essential JS 2 modules to the app.module file (eg: --modules=slider, grid)"
+    },
+    "modulePath": {
+      "type": "string",
+      "default": "",
+      "description": "Used to specify the path of the module file where the EJ2 module needs to be imported"
+    },
+    "theme": {
+      "enum": [
+        "material",
+        "fabric",
+        "bootstrap",
+        "highcontrast"
+      ],
+      "default": "material",
+      "description": "Used to change the theme that needs to be imported"
+    }
+  },
+  "required": []
+}

package/schematics/ng-add/schema.ts

@@ -1,30 +1,30 @@
-export interface OptionsSchema {
-    // Whether to skip package.json install.
-    skipPackageJson: boolean;
-
-    // Used to specify required module names
-    modules: string;
-
-    // Used to specify custom module path
-    modulePath: string;
-
-    // Used to specify theme name
-    theme:  'material' | 'fabric' | 'bootstrap' | 'highcontrast';
-
-    // Name of the project to target.
-    project?: string;
-}
-
-export interface LibOptionsSchema {
-    // Package name
-    pkgName: string;
-
-    // Package version
-    pkgVer: string;
-
-    // Library base module name
-    moduleName: string;
-
-    // Theme version
-    themeVer: string;
-}
+export interface OptionsSchema {
+    // Whether to skip package.json install.
+    skipPackageJson: boolean;
+
+    // Used to specify required module names
+    modules: string;
+
+    // Used to specify custom module path
+    modulePath: string;
+
+    // Used to specify theme name
+    theme:  'material' | 'fabric' | 'bootstrap' | 'highcontrast';
+
+    // Name of the project to target.
+    project?: string;
+}
+
+export interface LibOptionsSchema {
+    // Package name
+    pkgName: string;
+
+    // Package version
+    pkgVer: string;
+
+    // Library base module name
+    moduleName: string;
+
+    // Theme version
+    themeVer: string;
+}

package/schematics/tsconfig.json

@@ -1,25 +1,25 @@
-{
-    "compilerOptions": {
-        "lib": ["es2017", "dom"],
-        "module": "commonjs",
-        "moduleResolution": "node",
-        "noEmitOnError": false,
-        "skipDefaultLibCheck": true,
-        "skipLibCheck": true,
-        "sourceMap": true,
-        "target": "es6",
-        "declaration": true,
-        "types": [
-            "jasmine",
-            "node"
-        ]
-    },
-    "exclude": [
-        "node_modules",
-        "src",
-        "src/**/*.ts",
-        "spec",
-        "spec/**/*.ts",
-        "@typings"
-    ]
-}
+{
+    "compilerOptions": {
+        "lib": ["es2017", "dom"],
+        "module": "commonjs",
+        "moduleResolution": "node",
+        "noEmitOnError": false,
+        "skipDefaultLibCheck": true,
+        "skipLibCheck": true,
+        "sourceMap": true,
+        "target": "es6",
+        "declaration": true,
+        "types": [
+            "jasmine",
+            "node"
+        ]
+    },
+    "exclude": [
+        "node_modules",
+        "src",
+        "src/**/*.ts",
+        "spec",
+        "spec/**/*.ts",
+        "@typings"
+    ]
+}

package/schematics/utils/lib-details.d.ts

@@ -1,4 +1,4 @@
 export declare const pkgName = "@syncfusion/ej2-angular-schedule";
-export declare const pkgVer = "^25.1.37";
+export declare const pkgVer = "^31.1.21";
 export declare const moduleName = "ScheduleModule, RecurrenceEditorModule";
-export declare const themeVer = "~25.1.37";
+export declare const themeVer = "~31.1.21";

package/schematics/utils/lib-details.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.pkgName = '@syncfusion/ej2-angular-schedule';
-exports.pkgVer = '^31.1.21';
+exports.pkgVer = '^31.2.2';
 exports.moduleName = 'ScheduleModule, RecurrenceEditorModule';
-exports.themeVer = '~31.1.21';
+exports.themeVer = '~31.2.2';

package/schematics/utils/lib-details.ts

@@ -1,4 +1,4 @@
-export const pkgName = '@syncfusion/ej2-angular-schedule';
-export const pkgVer = '^31.1.21';
-export const moduleName = 'ScheduleModule, RecurrenceEditorModule';
-export const themeVer = '~31.1.21';
+export const pkgName = '@syncfusion/ej2-angular-schedule';
+export const pkgVer = '^31.2.2';
+export const moduleName = 'ScheduleModule, RecurrenceEditorModule';
+export const themeVer = '~31.2.2';

package/schematics/generators/schedule-agenda-views/index.d.ts

@@ -1,3 +0,0 @@
-import { Rule } from '@angular-devkit/schematics';
-import { Schema } from './schema';
-export default function (options: Schema): Rule;

package/schematics/generators/schedule-agenda-views/index.js

@@ -1,8 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const schematics_1 = require("@syncfusion/ej2-angular-base/schematics");
-const sampleDetails = require("./sample-details");
-function default_1(options) {
-    return schematics_1.componentBuilder(options, sampleDetails);
-}
-exports.default = default_1;

package/schematics/generators/schedule-agenda-views/index.ts

@@ -1,8 +0,0 @@
-import { Rule } from '@angular-devkit/schematics';
-import { componentBuilder } from "@syncfusion/ej2-angular-base/schematics";
-import { Schema } from './schema';
-import * as sampleDetails from './sample-details';
-
-export default function (options: Schema): Rule {
-  return componentBuilder(options, sampleDetails);
-}

package/schematics/generators/schedule-agenda-views/sample-details.d.ts

@@ -1,5 +0,0 @@
-export declare const componentName: string;
-export declare const sampleName: string;
-export declare const diModules: string;
-export declare const packageName: string;
-export declare const libModules: string;

package/schematics/generators/schedule-agenda-views/sample-details.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.componentName = 'schedule';
-exports.sampleName = 'agenda-views';
-exports.diModules = 'ResizeService,DragAndDropService,AgendaService,MonthAgendaService';
-exports.packageName = '@syncfusion/ej2-angular-schedule';
-exports.libModules = 'ScheduleModule';

package/schematics/generators/schedule-agenda-views/sample-details.ts

@@ -1,5 +0,0 @@
-export const componentName: string = 'schedule';
-export const sampleName: string = 'agenda-views';
-export const diModules: string =  'ResizeService,DragAndDropService,AgendaService,MonthAgendaService';
-export const packageName: string = '@syncfusion/ej2-angular-schedule';
-export const libModules: string = 'ScheduleModule';

package/schematics/generators/schedule-agenda-views/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html

@@ -1,13 +0,0 @@
-<div class="control-section">
-    <div class="col-lg-9 content-wrapper">
-        <ejs-schedule #scheduleObj width='100%' height='650px' [selectedDate]="selectedDate" [eventSettings]="eventSettings"
-            [currentView]="currentView">
-            <e-views>
-                <e-view option="Agenda"></e-view>
-                <e-view option="MonthAgenda"></e-view>
-            </e-views>
-        </ejs-schedule>
-    </div>
-  </div>
-  
-  

package/schematics/generators/schedule-agenda-views/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts

@@ -1,18 +0,0 @@
-import { Component, ViewChild } from '@angular/core';  
-import { EventSettingsModel, View} from '@syncfusion/ej2-angular-schedule';
-import { generateObject } from './assets/datasource';
-
-/**
- * Agenda views sample
- */
-
-@Component({
-    selector: '<%=dasherize(selector)%>',
-    templateUrl: '<%=dasherize(name)%>.component.html',	
-    styleUrls: ['<%=dasherize(name)%>.component.css'],
-})
-export class <%= classify(name) %>Component { 
-    public selectedDate: Date = new Date(2018, 1, 15);
-    public currentView: View = "Agenda";
-    public eventSettings: EventSettingsModel = { dataSource: generateObject() };  
-}

package/schematics/generators/schedule-agenda-views/samples/__path__/__name@dasherize@if-flat__/assets/datasource.ts

@@ -1,29 +0,0 @@
-export function generateObject(start: number = new Date(2017, 6, 1).getTime(), end: number = new Date(2018, 6, 31).getTime()): Object[] {
-    let data: Object[] = [];
-    let names: string[] = [
-        'Story Time for Kids', 'Camping with Turtles', 'Wildlife Warriors', 'Parrot Talk', 'Birds of Prey', 'Croco World',
-        'Venomous Snake Hunt', 'Face Painting & Drawing events', 'Pony Rides', 'Feed the Giants', 'Jungle Treasure Hunt',
-        'Endangered Species Program', 'Black Cockatoos Playtime', 'Walk with Jungle King', 'Trained Climbers', 'Playtime with Chimpanzees',
-        'Meet a small Mammal', 'Amazon Fish Feeding', 'Elephant Ride'
-    ];
-    let dayCount: number = 1000 * 60 * 60;
-    for (let a: number = start, id: number = 1; a < end; a += (dayCount * 24) * 2) {
-        let count: number = Math.floor((Math.random() * 9) + 1);
-        for (let b: number = 0; b < count; b++) {
-            let hour: number = Math.floor(Math.random() * 100) % 24;
-            let minutes: number = Math.round((Math.floor(Math.random() * 100) % 60) / 5) * 5;
-            let nCount: number = Math.floor(Math.random() * names.length);
-            let startDate: Date = new Date(new Date(a).setHours(hour, minutes));
-            let endDate: Date = new Date(startDate.getTime() + (dayCount * 2.5));
-            data.push({
-                Id: id,
-                Subject: names[nCount],
-                StartTime: startDate,
-                EndTime: endDate,
-                IsAllDay: (id % 10) ? false : true
-            });
-            id++;
-        }
-    }
-    return data;
-}

package/schematics/generators/schedule-agenda-views/schema.d.ts

@@ -1,3 +0,0 @@
-import { Schema as ComponentSchema } from '@schematics/angular/component/schema';
-export interface Schema extends ComponentSchema {
-}

package/schematics/generators/schedule-agenda-views/schema.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/schematics/generators/schedule-agenda-views/schema.json

@@ -1,125 +0,0 @@
-{
-  "$schema": "http://json-schema.org/schema",
-  "$id": "EJ2SchemaTemplateID",
-  "title": "schedule-agenda-views",
-  "type": "object",
-  "properties": {
-    "path": {
-      "type": "string",
-      "format": "path",
-      "description": "The path to create the component.",
-      "visible": false
-    },
-    "project": {
-      "type": "string",
-      "description": "The name of the project.",
-      "$default": {
-        "$source": "projectName"
-      }
-    },
-    "name": {
-      "type": "string",
-      "description": "The name of the component.",
-      "$default": {
-        "$source": "argv",
-        "index": 0
-      }
-    },
-    "inlineStyle": {
-      "description": "Specifies if the style will be in the ts file.",
-      "type": "boolean",
-      "default": false,
-      "alias": "s"
-    },
-    "inlineTemplate": {
-      "description": "Specifies if the template will be in the ts file.",
-      "type": "boolean",
-      "default": false,
-      "alias": "t"
-    },
-    "viewEncapsulation": {
-      "description": "Specifies the view encapsulation strategy.",
-      "enum": [
-        "Emulated",
-        "Native",
-        "None",
-        "ShadowDom"
-      ],
-      "type": "string",
-      "alias": "v"
-    },
-    "changeDetection": {
-      "description": "Specifies the change detection strategy.",
-      "enum": [
-        "Default",
-        "OnPush"
-      ],
-      "type": "string",
-      "default": "Default",
-      "alias": "c"
-    },
-    "prefix": {
-      "type": "string",
-      "description": "The prefix to apply to generated selectors.",
-      "alias": "p",
-      "oneOf": [
-        {
-          "maxLength": 0
-        },
-        {
-          "minLength": 1,
-          "format": "html-selector"
-        }
-      ]
-    },
-    "styleext": {
-      "description": "The file extension to be used for style files.",
-      "type": "string",
-      "default": "css"
-    },
-    "spec": {
-      "type": "boolean",
-      "description": "Specifies if a spec file is generated.",
-      "default": true
-    },
-    "flat": {
-      "type": "boolean",
-      "description": "Flag to indicate if a dir is created.",
-      "default": false
-    },
-    "skipImport": {
-      "type": "boolean",
-      "description": "Flag to skip the module import.",
-      "default": false
-    },
-    "selector": {
-      "type": "string",
-      "format": "html-selector",
-      "description": "The selector to use for the component."
-    },
-    "module": {
-      "type": "string",
-      "description": "Allows specification of the declaring module.",
-      "alias": "m"
-    },
-    "export": {
-      "type": "boolean",
-      "default": false,
-      "description": "Specifies if declaring module exports the component."
-    },
-    "entryComponent": {
-      "type": "boolean",
-      "default": false,
-      "description": "Specifies if the component is an entry component of declaring module."
-    },
-    "lintFix": {
-      "type": "boolean",
-      "default": false,
-      "description": "Specifies whether to apply lint fixes after generating the component."
-    }
-  },
-  "required": [
-    "name"
-  ],
-  "id": "schedule-agenda-views"
-}

package/schematics/generators/schedule-agenda-views/schema.ts

@@ -1,3 +0,0 @@
-import { Schema as ComponentSchema } from '@schematics/angular/component/schema';
-
-export interface Schema extends ComponentSchema { }

package/schematics/generators/schedule-calendar-views/index.d.ts

@@ -1,3 +0,0 @@
-import { Rule } from '@angular-devkit/schematics';
-import { Schema } from './schema';
-export default function (options: Schema): Rule;

package/schematics/generators/schedule-calendar-views/index.js

@@ -1,8 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const schematics_1 = require("@syncfusion/ej2-angular-base/schematics");
-const sampleDetails = require("./sample-details");
-function default_1(options) {
-    return schematics_1.componentBuilder(options, sampleDetails);
-}
-exports.default = default_1;

package/schematics/generators/schedule-calendar-views/index.ts

@@ -1,8 +0,0 @@
-import { Rule } from '@angular-devkit/schematics';
-import { componentBuilder } from "@syncfusion/ej2-angular-base/schematics";
-import { Schema } from './schema';
-import * as sampleDetails from './sample-details';
-
-export default function (options: Schema): Rule {
-  return componentBuilder(options, sampleDetails);
-}

package/schematics/generators/schedule-calendar-views/sample-details.d.ts

@@ -1,5 +0,0 @@
-export declare const componentName: string;
-export declare const sampleName: string;
-export declare const diModules: string;
-export declare const packageName: string;
-export declare const libModules: string;

package/schematics/generators/schedule-calendar-views/sample-details.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.componentName = 'schedule';
-exports.sampleName = 'calendar-views';
-exports.diModules = 'DayService,WeekService,WorkWeekService,MonthService,AgendaService,ResizeService,DragAndDropService';
-exports.packageName = '@syncfusion/ej2-angular-schedule';
-exports.libModules = 'ScheduleModule';

package/schematics/generators/schedule-calendar-views/sample-details.ts

@@ -1,5 +0,0 @@
-export const componentName: string = 'schedule';
-export const sampleName: string = 'calendar-views';
-export const diModules: string =  'DayService,WeekService,WorkWeekService,MonthService,AgendaService,ResizeService,DragAndDropService';
-export const packageName: string = '@syncfusion/ej2-angular-schedule';
-export const libModules: string = 'ScheduleModule';

package/schematics/generators/schedule-calendar-views/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html

@@ -1,11 +0,0 @@
-<div class="control-section">
-  <div class="content-wrapper"> 
-      <ejs-schedule [eventSettings]="eventSettings" height='550px' [selectedDate]="currentDate">       
-            <e-views>
-                    <e-view option="Day"></e-view>
-                    <e-view option="Week"></e-view>
-                    <e-view option="WorkWeek"></e-view>
-                    <e-view option="Month"></e-view>
-                </e-views> 
-      </ejs-schedule>
-  </div>