@syncfusion/ej2-angular-schedule 31.2.15 → 32.1.19

package/CHANGELOG.md

@@ -4,57 +4,6 @@
 
 ### Schedule
 
-#### Bug fixes
-
-- `#I779068` - Fixed an issue where the Scheduler toolbar displayed an incorrect date range instead of the date range based on the first visible appointment when virtual scrolling was enabled.
-
-## 31.2.10 (2025-11-13)
-
-### Schedule
-
-#### Bug fixes
-
-- `#I779062` - Fixed an issue where the Scheduler became unresponsive in agenda view when the data source was reset to empty.
-
-## 31.2.3 (2025-10-22)
-
-### Schedule
-
-#### Bug fixes
-
-- `#I746004` - Fixed an issue where appointments overlapped when a large number of them were rendered.
-- `#I738200` - Fixed an issue where the Scheduler became unresponsive when many appointments overlapped simultaneously.
-
-## 31.2.2 (2025-10-15)
-
-### Schedule
-
-#### 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)
-
-### Schedule
-
-#### Bug fixes
-
-- `#I760538` - The issue where the Edit Event popup was incorrectly displayed for recurring events when `allowEditing` property set to `false` has been resolved.
-
-## 31.1.17 (2025-09-05)
-
-### Schedule
-
 #### Features
 
 - `#I618429` - Added the `groupIndex` value to the `dateHeaderTemplate` when the date header is grouped by resource. This enables resource-specific customization of date headers. Applicable only for `Day`, `Week`, `WorkWeek`, and `Agenda` views when resource-specific date headers are rendered.

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@syncfusion/ej2-angular-schedule",
-  "version": "31.2.15",
+  "version": "32.1.19",
   "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.2.12",
-    "@syncfusion/ej2-angular-base": "~31.2.12",
-    "@syncfusion/ej2-schedule": "31.2.15"
+    "@syncfusion/ej2-base": "~32.1.19",
+    "@syncfusion/ej2-angular-base": "~32.1.19",
+    "@syncfusion/ej2-schedule": "32.1.19"
   },
   "keywords": [
     "angular",

package/schematics/collection.json

@@ -1,11 +1,40 @@
 {
-                "$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"
-                  }
-                }
-              }
-              
+  "$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"
+    }
+  }
+}

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

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

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

@@ -0,0 +1,8 @@
+"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

@@ -0,0 +1,8 @@
+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

@@ -0,0 +1,5 @@
+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

@@ -0,0 +1,7 @@
+"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

@@ -0,0 +1,5 @@
+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

@@ -0,0 +1,13 @@
+<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

@@ -0,0 +1,18 @@
+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

@@ -0,0 +1,29 @@
+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

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

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

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

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

@@ -0,0 +1,125 @@
+{
+  "$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

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

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

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

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

@@ -0,0 +1,8 @@
+"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

@@ -0,0 +1,8 @@
+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

@@ -0,0 +1,5 @@
+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

@@ -0,0 +1,7 @@
+"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

@@ -0,0 +1,5 @@
+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

@@ -0,0 +1,11 @@
+<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>

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

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

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

@@ -0,0 +1,92 @@
+export let scheduleData: Object[] = [
+    {
+        Id: 1,
+        Subject: 'Explosion of Betelgeuse Star',
+        StartTime: new Date(2018, 1, 11, 9, 30),
+        EndTime: new Date(2018, 1, 11, 11, 0),
+        CategoryColor: '#1aaa55'
+    }, {
+        Id: 2,
+        Subject: 'Thule Air Crash Report',
+        StartTime: new Date(2018, 1, 12, 12, 0),
+        EndTime: new Date(2018, 1, 12, 14, 0),
+        CategoryColor: '#357cd2'
+    }, {
+        Id: 3,
+        Subject: 'Blue Moon Eclipse',
+        StartTime: new Date(2018, 1, 13, 9, 30),
+        EndTime: new Date(2018, 1, 13, 11, 0),
+        CategoryColor: '#7fa900'
+    }, {
+        Id: 4,
+        Subject: 'Meteor Showers in 2018',
+        StartTime: new Date(2018, 1, 14, 13, 0),
+        EndTime: new Date(2018, 1, 14, 14, 30),
+        CategoryColor: '#ea7a57'
+    }, {
+        Id: 5,
+        Subject: 'Milky Way as Melting pot',
+        StartTime: new Date(2018, 1, 15, 12, 0),
+        EndTime: new Date(2018, 1, 15, 14, 0),
+        CategoryColor: '#00bdae'
+    }, {
+        Id: 6,
+        Subject: 'Mysteries of Bermuda Triangle',
+        StartTime: new Date(2018, 1, 15, 9, 30),
+        EndTime: new Date(2018, 1, 15, 11, 0),
+        CategoryColor: '#f57f17'
+    }, {
+        Id: 7,
+        Subject: 'Glaciers and Snowflakes',
+        StartTime: new Date(2018, 1, 16, 11, 0),
+        EndTime: new Date(2018, 1, 16, 12, 30),
+        CategoryColor: '#1aaa55'
+    }, {
+        Id: 8,
+        Subject: 'Life on Mars',
+        StartTime: new Date(2018, 1, 17, 9, 0),
+        EndTime: new Date(2018, 1, 17, 10, 0),
+        CategoryColor: '#357cd2'
+    }, {
+        Id: 9,
+        Subject: 'Alien Civilization',
+        StartTime: new Date(2018, 1, 19, 11, 0),
+        EndTime: new Date(2018, 1, 19, 13, 0),
+        CategoryColor: '#7fa900'
+    }, {
+        Id: 10,
+        Subject: 'Wildlife Galleries',
+        StartTime: new Date(2018, 1, 21, 11, 0),
+        EndTime: new Date(2018, 1, 21, 13, 0),
+        CategoryColor: '#ea7a57'
+    }, {
+        Id: 11,
+        Subject: 'Best Photography 2018',
+        StartTime: new Date(2018, 1, 22, 9, 30),
+        EndTime: new Date(2018, 1, 22, 11, 0),
+        CategoryColor: '#00bdae'
+    }, {
+        Id: 12,
+        Subject: 'Smarter Puppies',
+        StartTime: new Date(2018, 1, 9, 10, 0),
+        EndTime: new Date(2018, 1, 9, 11, 30),
+        CategoryColor: '#f57f17'
+    }, {
+        Id: 13,
+        Subject: 'Myths of Andromeda Galaxy',
+        StartTime: new Date(2018, 1, 7, 10, 30),
+        EndTime: new Date(2018, 1, 7, 12, 30),
+        CategoryColor: '#1aaa55'
+    }, {
+        Id: 14,
+        Subject: 'Aliens vs Humans',
+        StartTime: new Date(2018, 1, 5, 10, 0),
+        EndTime: new Date(2018, 1, 5, 11, 30),
+        CategoryColor: '#357cd2'
+    }, {
+        Id: 15,
+        Subject: 'Facts of Humming Birds',
+        StartTime: new Date(2018, 1, 20, 9, 30),
+        EndTime: new Date(2018, 1, 20, 11, 0),
+        CategoryColor: '#7fa900'
+    }];

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

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

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

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