{
  "$schema": "https://ai.syncfusion.com/schema/registry-item.json",
  "name": "gantt-holidays",
  "framework": "angular",
  "type": "registry:component",
  "component": "Gantt",
  "variant": "holidays",
  "dependencies": [
    "@syncfusion/ej2-angular-gantt"
  ],
  "description": "Gantt chart sample displaying holidays and non-working days on the project timeline.",
  "meta": {
    "essentialStudioRelease": "2026 Volume 2 (v34.1.29)",
    "license": "commercial-or-community",
    "licenseNote": "The Syncfusion package is licensed. The composition in this file is source you own and edit. See https://ai.syncfusion.com/licensing.md",
    "requiresLicenseKey": true,
    "requiresServerEndpoint": false,
    "platformIndex": "https://ai.syncfusion.com/angular/llms.txt",
    "skillPack": "syncfusion/angular-ui-components-skills",
    "docs": "https://ai.syncfusion.com/gallery/angular/gantt-holidays.md"
  },
  "files": [
    {
      "target": "src/components/gantt-holidays/holidays.component.ts",
      "content": "import { Component, OnInit} from '@angular/core';\nimport { projectNewData } from '../data';\nimport { DayMarkersService, GanttModule, SelectionService } from '@syncfusion/ej2-angular-gantt';\n@Component({\n    selector: 'ej2-ganttholiday',\n    templateUrl: 'holidays.html',\n    standalone: true,\n    providers: [SelectionService, DayMarkersService],\n    imports: [ GanttModule]\n})\nexport class GanttHolidaysComponent implements OnInit {\n    public data!: object[];\n    public taskSettings!: object;\n    public columns!: object[];\n    public labelSettings!: object;\n    public projectStartDate!: Date;\n    public projectEndDate!: Date;\n    public splitterSettings!: object;\n    public holidays!: object[];\n    public ngOnInit(): void {\n        this.data = projectNewData;\n        this.taskSettings = {\n            id: 'TaskID',\n            name: 'TaskName',\n            startDate: 'StartDate',\n            endDate: 'EndDate',\n            duration: 'Duration',\n            progress: 'Progress',\n            dependency: 'Predecessor',\n            parentID: 'ParentID'\n        };\n        this.splitterSettings = {\n            columnIndex: 1\n        },\n        this.columns = [\n            { field: 'TaskID', visible: false, width: 80 },\n            { field: 'TaskName', width: 280 },\n            { field: 'StartDate' },\n            { field: 'EndDate' },\n            { field: 'Duration' },\n            { field: 'Predecessor' },\n            { field: 'Progress' }\n        ];\n        this.projectStartDate = new Date('03/25/2025');\n        this.projectEndDate = new Date('07/20/2025');\n        this.labelSettings = {\n            leftLabel: 'TaskName',\n        };\n        this.holidays = [\n            {\n                from: new Date('03/28/2025'),\n                to: new Date('03/28/2025'),\n                label: 'Good Friday'\n            },\n            {\n                from: new Date('03/30/2025'),\n                to: new Date('03/30/2025'),\n                label: 'Easter Sunday'\n            },\n            {\n                from: new Date('05/26/2025'),\n                to: new Date('05/26/2025'),\n                label: 'Memorial Day'\n            },\n            {\n                from: new Date('07/04/2025'),\n                to: new Date('07/04/2025'),\n                label: 'Independence Day'\n            }\n        ];\n    }\n}\n"
    },
    {
      "target": "src/components/gantt-holidays/holidays.html",
      "content": "<div class=\"control-section\">\n    <ejs-gantt id=\"holidays\" height=\"650px\" rowHeight=\"46\" taskbarHeight=\"25\" [dataSource]=\"data\" [taskFields]=\"taskSettings\" [allowSelection]=\"true\"\n        [labelSettings]=\"labelSettings\" [columns]=\"columns\" [treeColumnIndex]=\"1\" [projectStartDate]=\"projectStartDate\" [projectEndDate]=\"projectEndDate\"\n        [highlightWeekends]=\"true\" [holidays]=\"holidays\" [splitterSettings]=\"splitterSettings\">\n    </ejs-gantt>\n</div>"
    }
  ]
}