Events Service Plugin
The Events Service plugin provides advanced event management capabilities, including validation, filtering, and complex querying.
Installation
The Events Service plugin is currently part of the @dayflow/core package.
import { createEventsPlugin } from '@dayflow/core';Usage
import {
useCalendarApp,
DayFlowCalendar,
createEventsPlugin,
} from '@dayflow/react';
function MyCalendar() {
const eventsPlugin = createEventsPlugin({
enableValidation: true,
maxEventsPerDay: 50,
});
const calendar = useCalendarApp({
views: [
/* your views */
],
plugins: [eventsPlugin],
});
return <DayFlowCalendar calendar={calendar} />;
}<template>
<DayFlowCalendar :calendar="calendar" />
</template>
<script setup>
import { DayFlowCalendar, useCalendarApp } from '@dayflow/vue';
import { createEventsPlugin } from '@dayflow/core';
const eventsPlugin = createEventsPlugin({
enableValidation: true,
maxEventsPerDay: 50,
});
const calendar = useCalendarApp({
views: [
/* your views */
],
plugins: [eventsPlugin],
});
</script>import { Component } from '@angular/core';
import { DayFlowCalendarModule } from '@dayflow/angular';
import { createEventsPlugin } from '@dayflow/core';
@Component({
selector: 'app-root',
standalone: true,
imports: [DayFlowCalendarModule],
template: `<dayflow-calendar [calendar]="calendar"></dayflow-calendar>`
})
export class AppComponent {
eventsPlugin = createEventsPlugin({
enableValidation: true,
maxEventsPerDay: 50,
});
calendar = {
views: [
/* your views */
],
plugins: [this.eventsPlugin]
};
}<script>
import { DayFlowCalendar, useCalendarApp } from '@dayflow/svelte';
import { createEventsPlugin } from '@dayflow/core';
const eventsPlugin = createEventsPlugin({
enableValidation: true,
maxEventsPerDay: 50,
});
const calendar = useCalendarApp({
views: [
/* your views */
],
plugins: [eventsPlugin],
});
</script>
<DayFlowCalendar {calendar} />Configuration
| Property | Type | Default | Description |
|---|---|---|---|
enableAutoRecalculate | boolean | true | Automatically recalculate event segments when dates change. |
enableValidation | boolean | true | Validate event objects before adding or updating. |
maxEventsPerDay | number | 50 | Maximum number of events allowed per day. |
Plugin API
Access the EventsService to perform advanced queries:
const eventsService = calendar.app.getPlugin<EventsService>('events');
// Get events for a specific day
const events = eventsService.getByDate(new Date());
// Filter events
const workEvents = eventsService.filterEvents(
allEvents,
e => e.calendarId === 'work'
);Available Methods
getAll(): Get all events.getById(id): Find a specific event.getByDate(date): Get events occurring on a specific date.getByDateRange(start, end): Get events within a range.validateEvent(event): Returns an array of validation errors.