Event calendar

import { EventCalendar, EventCalendarAgendaView, EventCalendarContent, EventCalendarDatePicker, EventCalendarDayView, EventCalendarDaysView, EventCalendarEvent, EventCalendarMonthView, EventCalendarMoreIndicator, EventCalendarNav, EventCalendarNavNext, EventCalendarNavPrev, EventCalendarNavToday, EventCalendarNowIndicator, EventCalendarResourceView, EventCalendarTimeGrid, EventCalendarTimeGutter, EventCalendarTitle, EventCalendarToolbar, EventCalendarViewSwitcher, EventCalendarWeekView, EventCalendarContext, EventCalendarViewConfigContext, EventCalendarViewContext, EventCalendarRecurrenceError } from '@pharen/ui';

<script setup lang="ts">
import { EventCalendar, EventCalendarContent, EventCalendarNav } from '@pharen/ui';
const events = [{
  id: 'kickoff',
  title: 'Project kickoff',
  start: new Date(2026, 7, 12, 10),
  end: new Date(2026, 7, 12, 11),
}];
</script>

<template>
  <EventCalendar :events="events" default-view="month">
    <EventCalendarNav />
    <EventCalendarContent />
  </EventCalendar>
</template>