@syncfusion/ej2-react-schedule
Version:
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 React
603 lines (602 loc) • 27.2 kB
JSON
{
"name": "Schedule",
"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.",
"eventInterfaces": ["CellClickEventArgs", "ActionEventArgs", "NavigatingEventArgs", "RenderCellEventArgs", "EventClickArgs", "EventRenderedArgs", "PopupOpenEventArgs", "DragEventArgs", "ResizeEventArgs", "SelectEventArgs", "RecurrenceEditorChangeEventArgs", "DataBoundEventArgs", "DataBindingEventArgs", "PopupCloseEventArgs", "MoreEventsClickArgs"],
"keywords": {
"common": [
"ej2",
"syncfusion",
"schedule",
"scheduler",
"events-calendar",
"events-scheduler",
"appointment-calendar",
"appointments-planner",
"resources-scheduler"
],
"angular": [
"angular",
"angular-schedule",
"angular-scheduler",
"ej2-angular-scheduler"
],
"react": [
"react",
"reactjs",
"react-schedule",
"react-scheduler",
"ej2-react-scheduler"
],
"vue": [
"vue",
"vuejs",
"vue-schedule",
"vue-scheduler",
"ej2-vue-scheduler"
]
},
"repository": {
"type": "git",
"url": "https://github.com/syncfusion/ej2-schedule"
},
"components": [
{
"baseClass": "Schedule",
"directoryName": "schedule",
"type": "simple",
"isGenericClass": true,
"blazorPlaceholder": "schedule",
"blazorType": "native",
"blazorDependency": [
"ej2-base",
"ej2-popups/popup",
"ej2-navigations/blazor/Toolbar",
"ej2-navigations/blazor/TreeView",
"ej2-navigations/blazor/Sidebar",
"ej2-inputs/blazor/NumericTextBox",
"ej2-inputs/blazor/TextBox",
"ej2-calendars/blazor/CalendarBase",
"ej2-calendars/blazor/DatePicker",
"ej2-calendars/blazor/DateTimePicker",
"ej2-dropdowns/blazor/DropDownList",
"ej2-dropdowns/MultiSelect",
"ej2-popups/blazor/Dialog",
"ej2-popups/blazor/Tooltip",
"ej2-popups/blazor/Spinner"
],
"defaultTag": "<schedule id='sample'></schedule>",
"twoWays": [
"currentView",
"selectedDate"
],
"dynamicModules": [
"Day",
"Week",
"WorkWeek",
"Month",
"Year",
"Agenda",
"MonthAgenda",
"TimelineViews",
"TimelineMonth",
"TimelineYear",
"Resize",
"DragAndDrop",
"ExcelExport",
"ICalendarExport",
"ICalendarImport",
"Print"
],
"diModuleFiles": [
{
"fileName": "day"
},
{
"fileName": "week"
},
{
"fileName": "work-week"
},
{
"fileName": "month"
},
{
"fileName": "year"
},
{
"fileName": "agenda"
},
{
"fileName": "month-agenda"
},
{
"fileName": "timeline-view"
},
{
"fileName": "timeline-month"
},
{
"fileName": "timeline-year"
},
{
"fileName": "resize"
},
{
"fileName": "drag"
},
{
"fileName": "excel-export"
},
{
"fileName": "calendar-export"
},
{
"fileName": "calendar-import"
},
{
"fileName": "print"
}
],
"comment": [
"/**",
" * `ej-schedule` represents the Angular Schedule Component.",
" * ```html",
" * <ejs-schedule></ejs-schedule>",
" * ```",
" */"
],
"reactComment": [
"/**",
" * `ScheduleComponent` represents the react Schedule.",
" * ```tsx",
" * <ScheduleComponent/>",
" * ```",
" */"
],
"vueComment": [
"/**",
" * `ej-schedule` represents the VueJS Schedule Component.",
" * ```vue",
" * <ejs-schedule></ejs-schedule>",
" * ```",
" */"
],
"complexDirective": [
{
"propertyName": "eventSettings",
"baseClass": "EventSettings",
"isGenericClass": true,
"blazorTemplates":["tooltipTemplate", "template"],
"complexDirective": [
{
"propertyName": "fields",
"baseClass": "Field",
"complexDirective": [
{
"propertyName": "subject",
"baseClass": "FieldOptions",
"isCommon": true,
"blazorCommonClassName": "EventSettingsField",
"blazorClassName": "FieldSubject"
},
{
"propertyName": "startTime",
"baseClass": "FieldOptions",
"isCommon": true,
"blazorCommonClassName": "EventSettingsField",
"blazorClassName": "FieldStartTime"
},
{
"propertyName": "endTime",
"baseClass": "FieldOptions",
"isCommon": true,
"blazorCommonClassName": "EventSettingsField",
"blazorClassName": "FieldEndTime"
},
{
"propertyName": "startTimezone",
"baseClass": "FieldOptions",
"isCommon": true,
"blazorCommonClassName": "EventSettingsField",
"blazorClassName": "FieldStartTimezone"
},
{
"propertyName": "endTimezone",
"baseClass": "FieldOptions",
"isCommon": true,
"blazorCommonClassName": "EventSettingsField",
"blazorClassName": "FieldEndTimezone"
},
{
"propertyName": "location",
"baseClass": "FieldOptions",
"isCommon": true,
"blazorCommonClassName": "EventSettingsField",
"blazorClassName": "FieldLocation"
},
{
"propertyName": "description",
"baseClass": "FieldOptions",
"isCommon": true,
"blazorCommonClassName": "EventSettingsField",
"blazorClassName": "FieldDescription"
},
{
"propertyName": "isAllDay",
"baseClass": "FieldOptions",
"isCommon": true,
"blazorCommonClassName": "EventSettingsField",
"blazorClassName": "FieldIsAllDay"
},
{
"propertyName": "recurrenceID",
"baseClass": "FieldOptions",
"isCommon": true,
"blazorCommonClassName": "EventSettingsField",
"blazorClassName": "FieldRecurrenceId"
},
{
"propertyName": "recurrenceRule",
"baseClass": "FieldOptions",
"isCommon": true,
"blazorCommonClassName": "EventSettingsField",
"blazorClassName": "FieldRecurrenceRule"
},
{
"propertyName": "recurrenceException",
"baseClass": "FieldOptions",
"isCommon": true,
"blazorCommonClassName": "EventSettingsField",
"blazorClassName": "FieldRecurrenceException"
}
]
}
]
},
{
"propertyName": "workHours",
"baseClass": "WorkHours"
},
{
"propertyName": "timeScale",
"baseClass": "TimeScale",
"blazorTemplates":["minorSlotTemplate", "majorSlotTemplate"],
"blazorTemplateModels": {
"minorSlotTemplate": "TemplateContext",
"majorSlotTemplate": "TemplateContext"
}
},
{
"propertyName": "group",
"baseClass": "Group",
"blazorTemplates":["headerTooltipTemplate"]
},
{
"propertyName": "quickInfoTemplates",
"baseClass": "QuickInfoTemplates",
"blazorTemplates": ["header:headerTemplate", "content:contentTemplate", "footer:footerTemplate"]
}
],
"tagDirective": [
{
"baseClass": "Views",
"propertyName": "views",
"directoryName": "schedule",
"arrayDirectiveClassName": "views",
"directiveClassName": "view",
"isPartialClass": true,
"complexDirective": [
{
"propertyName": "timeScale",
"baseClass": "TimeScale",
"blazorClassName": "ScheduleViewTimeScale",
"aspSelectorName": "e-schedule-view-timescale"
},
{
"propertyName": "group",
"baseClass": "Group",
"blazorClassName": "ScheduleViewGroup",
"aspSelectorName": "e-schedule-view-group"
}
],
"blazorTemplates":["dateHeaderTemplate", "cellHeaderTemplate", "cellTemplate", "eventTemplate", "resourceHeaderTemplate"],
"blazorTemplateModels": {
"dateHeaderTemplate": "TemplateContext",
"cellHeaderTemplate": "TemplateContext",
"cellTemplate": "TemplateContext"
},
"templateProperties": [
"dateHeaderTemplate",
"dateRangeTemplate",
"dayHeaderTemplate",
"cellHeaderTemplate",
"cellTemplate",
"eventTemplate",
"monthHeaderTemplate",
"resourceHeaderTemplate",
"headerIndentTemplate",
"timeScale.minorSlotTemplate",
"timeScale.majorSlotTemplate",
"group.headerTooltipTemplate"
],
"comment": [
"/**",
" * `e-views` directive represent a view of the Angular Schedule. ",
" * It must be contained in a Schedule component(`ejs-schedule`). ",
" * ```html",
" * <ejs-schedule>",
" * <e-views>",
" * <e-view option='day' dateFormat='dd MMM'></e-view>",
" * <e-view option='week'></e-view>",
" * </e-views>",
" * </ejs-schedule>",
" * ```",
" */"
],
"reactComment": [
"/**",
" * `ViewsDirective` represent a view of the react Schedule. ",
" * It must be contained in a Schedule component(`SchduleComponent`). ",
" * ```tsx",
" * <ScheduleComponent>",
" * <ViewsDirective>",
" * <ViewDirective option='day' dateFormat='dd MMM'></ViewDirective>",
" * <ViewDirective option='week'></ViewDirective>",
" * <ViewsDirective>",
" * </ScheduleComponent>",
" * ```",
" */"
],
"vueComment": [
"/**",
" * `e-views` directive represent a view of the VueJS Schedule. ",
" * It must be contained in a Schedule component(`ejs-schedule`). ",
" * ```vue",
" * <ejs-schedule>",
" * <e-views>",
" * <e-view option='day' dateFormat='dd MMM'></e-view>",
" * <e-view option='week'></e-view>",
" * </e-views>",
" * </ejs-schedule>",
" * ```",
" */"
]
},
{
"baseClass": "Resources",
"propertyName": "resources",
"directoryName": "schedule",
"isGenericClass": true,
"arrayDirectiveClassName": "resources",
"directiveClassName": "resource",
"isPartialClass": true,
"comment": [
"/**",
" * `e-resources` directive represent a resources of the Angular Schedule. ",
" * It must be contained in a Schedule component(`ejs-schedule`). ",
" * ```html",
" * <ejs-schedule>",
" * <e-resources>",
" * <e-resource field='RoomId' name='Rooms'></e-resource>",
" * <e-resource field='OwnerId' name='Owners'></e-resource>",
" * </e-resources>",
" * </ejs-schedule>",
" * ```",
" */"
],
"reactComment": [
"/**",
" * `ResourcesDirective` represent a resource of the react Schedule. ",
" * It must be contained in a Schedule component(`SchduleComponent`). ",
" * ```tsx",
" * <ScheduleComponent>",
" * <ResourcesDirective>",
" * <ResourceDirective field='RoomId' name='Rooms'></ResourceDirective>",
" * <ResourceDirective field='OwnerId' name='Owners'></ResourceDirective>",
" * <ResourcesDirective>",
" * </ScheduleComponent>",
" * ```",
" */"
],
"vueComment": [
"/**",
" * `e-resources` directive represent a resources of the VueJS Schedule. ",
" * It must be contained in a Schedule component(`ejs-schedule`). ",
" * ```vue",
" * <ejs-schedule>",
" * <e-resources>",
" * <e-resource field='RoomId' name='Rooms'></e-resource>",
" * <e-resource field='OwnerId' name='Owners'></e-resource>",
" * </e-resources>",
" * </ejs-schedule>",
" * ```",
" */"
]
},
{
"baseClass": "HeaderRows",
"propertyName": "headerRows",
"directoryName": "schedule",
"arrayDirectiveClassName": "HeaderRows",
"directiveClassName": "HeaderRow",
"arrayDirectiveSelector": "ejs-schedule>e-header-rows",
"directiveSelector": "e-header-rows>e-header-row",
"aspArrayDirectiveSelector": "e-schedule-header-rows",
"aspDirectiveSelector": "e-schedule-header-row",
"templateProperties": [
"template"
],
"blazorTemplates": ["template"],
"blazorTemplateModels": {
"template": "TemplateContext"
},
"comment": [
"/**",
" * `e-header-rows` directive represent a header rows of the Schedule. ",
" * It must be contained in a Schedule component(`ejs-schedule`). ",
" * ```html",
" * <ejs-schedule>",
" * <e-header-rows>",
" * <e-header-row option='Week'></e-header-row>",
" * <e-header-row option='Date'></e-header-row>",
" * </e-header-rows>",
" * </ejs-schedule>",
" * ```",
" */"
],
"reactComment": [
"/**",
" * `HeaderRowsDirective` represent a header rows of the react Schedule. ",
" * It must be contained in a Schedule component(`SchduleComponent`). ",
" * ```tsx",
" * <ScheduleComponent>",
" * <HeaderRowsDirective>",
" * <HeaderRowDirective option='Week'></HeaderRowDirective>",
" * <HeaderRowDirective option='Date'></HeaderRowDirective>",
" * <HeaderRowsDirective>",
" * </ScheduleComponent>",
" * ```",
" */"
],
"vueComment": [
"/**",
" * `e-header-rows` directive represent a header rows of the VueJS Schedule. ",
" * It must be contained in a Schedule component(`ejs-schedule`). ",
" * ```vue",
" * <ejs-schedule>",
" * <e-header-rows>",
" * <e-header-row option='Week'></e-header-row>",
" * <e-header-row option='Date'></e-header-row>",
" * </e-header-rows>",
" * </ejs-schedule>",
" * ```",
" */"
]
},
{
"baseClass": "ToolbarItem",
"propertyName": "toolbarItems",
"directoryName": "schedule",
"directiveClassName": "ToolbarItem",
"arrayDirectiveClassName": "ToolbarItems",
"arrayDirectiveSelector": "ejs-schedule>e-toolbaritems",
"directiveSelector": "e-toolbaritems>e-toolbaritem",
"aspArrayDirectiveSelector": "e-schedule-toolbaritems",
"aspDirectiveSelector": "e-schedule-toolbaritem",
"templateProperties": [
"template"
],
"comment": [
"/**",
" * `e-toolbaritems` directive represent a custom toolbar items of the Schedule. ",
" * It must be contained in a Schedule component(`ejs-schedule`). ",
" * ```html",
" * <ejs-schedule>",
" * <e-toolbaritems>",
" * <e-toolbaritem name='Today'></<e-toolbaritem>",
" * <e-toolbaritem name='DateRangeText'></e-toolbaritem>",
" * <e-toolbaritem prefixIcon='e-icons e-cut' text='Cut'></e-toolbaritem>",
" * <e-toolbaritems>",
" * </ejs-schedule>",
" * ```",
" */"
],
"reactComment": [
"/**",
" * `ToolbarItemsDirective` represent a custom toolbar items of the react Schedule. ",
" * It must be contained in a Schedule component(`SchduleComponent`). ",
" * ```tsx",
" * <ScheduleComponent>",
" * <ToolbarItemsDirective>",
" * <ToolbarItemDirective name= 'Today'></ToolbarItemDirective>",
" * <ToolbarItemDirective name= 'DateRangeText'></ToolbarItemDirective>",
" * <ToolbarItemDirective prefixIcon='e-icons e-cut' text='Cut'></ToolbarItemDirective>",
" * <ToolbarItemsDirective>",
" * </ScheduleComponent>",
" * ```",
" */"
],
"vueComment": [
"/**",
" * `e-toolbaritems` directive represent a custom toolbar items of the VueJS Schedule. ",
" * It must be contained in a Schedule component(`ejs-schedule`). ",
" * ```vue",
" * <ejs-schedule>",
" * <e-toolbaritems>",
" * <e-toolbaritem name='Today'></<e-toolbaritem>",
" * <e-toolbaritem name='DateRangeText'></e-toolbaritem>",
" * <e-toolbaritem prefixIcon='e-icons e-cut' text='Cut'></e-toolbaritem>",
" * <e-toolbaritems>",
" * </ejs-schedule>",
" * ```",
" */"
]
}
],
"templateProperties": [
"dateHeaderTemplate",
"dateRangeTemplate",
"dayHeaderTemplate",
"cellTemplate",
"cellHeaderTemplate",
"eventSettings.tooltipTemplate",
"eventSettings.template",
"editorTemplate",
"editorHeaderTemplate",
"editorFooterTemplate",
"monthHeaderTemplate",
"timeScale.minorSlotTemplate",
"timeScale.majorSlotTemplate",
"resourceHeaderTemplate",
"headerIndentTemplate",
"quickInfoTemplates.header",
"quickInfoTemplates.content",
"quickInfoTemplates.footer",
"group.headerTooltipTemplate"
],
"blazorTemplates":[
"dateHeaderTemplate",
"cellHeaderTemplate",
"cellTemplate",
"editorTemplate",
"resourceHeaderTemplate"
],
"blazorTemplateModels": {
"dateHeaderTemplate": "TemplateContext",
"cellHeaderTemplate": "TemplateContext",
"cellTemplate": "TemplateContext"
}
},
{
"baseClass": "RecurrenceEditor",
"directoryName": "recurrence-editor",
"type": "simple",
"isChildContent": true,
"defaultTag": "<recurrenceeditor id='sample'></recurrenceeditor>",
"comment": [
"/**",
" * `ejs-recurrenceeditor` represents the Angular RecurrenceEditor Component.",
" * ```html",
" * <ejs-recurrenceeditor></ejs-recurrenceeditor>",
" * ```",
" */"
],
"reactComment": [
"/**",
" * `RecurrenceEditorComponent` represents the react RecurrenceEditor.",
" * ```tsx",
" * <RecurrenceEditorComponent/>",
" * ```",
" */"
],
"vueComment": [
"/**",
" * `ejs-recurrenceeditor` represents the VueJS RecurrenceEditor Component.",
" * ```vue",
" * <ejs-recurrenceeditor></ejs-recurrenceeditor>",
" * ```",
" */"
]
}
]
}