import * as i0 from '@angular/core'; import { Type, InjectionToken } from '@angular/core'; import { MnButtonTypes } from 'mn-angular-lib/button'; import { Observable } from 'rxjs'; /** * Colour scheme applied to calendar events. * * `primaryColor` is used for the left border accent; `secondaryColor` for the * background fill. Both should be valid CSS colour values. */ type ColorPreset = { /** Unique identifier. */ id: string; /** Human-readable colour name (e.g. "Blue"). */ colorName: string; /** Accent / border colour (e.g. "#3b82f6"). */ primaryColor: string; /** Background fill colour (e.g. "#dbeafe"). */ secondaryColor: string; }; /** * Represents a single calendar event. * * Consumer-facing properties (`id` through `data`) are set by the application. * Layout properties (`column`, `width`, `continued`, `continuedEnd`) are * computed by {@link CalendarEventLayoutService} and should not be set manually. */ type CalendarEvent = { /** Unique identifier for the event. */ id: string; /** Display title. */ title: string; /** Optional description shown below the title. */ description: string; /** Event start date/time. */ startTime: Date; /** Event end date/time. */ endTime: Date; /** Colour scheme used for rendering. */ color: ColorPreset; /** Optional custom component type to render this event (overrides the default renderer). */ component?: Type; /** Arbitrary payload attached to the event (passed through to custom renderers). */ data?: unknown; /** Zero-based column index within overlapping event groups. */ column?: number; /** Number of sub-columns this event spans. */ width?: number; /** `true` when this segment is a continuation from a previous day (multi-day events). */ continued?: boolean; /** `true` when this segment continues into the next day (multi-day events). */ continuedEnd?: boolean; }; /** * Represents a button displayed in the calendar toolbar's top-right area. */ type CalendarButton = { /** Display label for the button. */ label: string; /** Button styling configuration passed to the mnButton directive. */ buttonData?: Partial; /** Callback invoked when the button is clicked. */ onClick: () => void; }; /** * Represents the "current time" indicator rendered as a line in week/day views. */ type CurrentTimeCalendarEvent = { id: 'current-time'; title: string; startTime: Date; endTime: Date; column: number; width: number; }; /** * Contract for pluggable event renderer components. * * Any component that implements this interface can be used as a custom * event template inside the calendar. Pass the component type via * `[CalendarEventComponent]` on ``. * * The calendar will set the `event` property after creating the component * dynamically via `ViewContainerRef.createComponent()`. */ type CalendarEventData = { /** The calendar event to render. Set by the calendar after component creation. */ event: CalendarEvent; }; /** * Available calendar view modes. */ declare enum CalendarView { MONTH = "MONTH", WEEK = "WEEK", DAY = "DAY" } /** * Configuration for the calendar component. * All properties are optional — sensible defaults are provided. * Can be supplied via the `CALENDAR_CONFIG` injection token or through * the `provideMnComponentConfig` helper using component name `'mn-calendar'`. */ type CalendarConfig = { /** First visible hour in week/day views (0–23). Default: `7`. */ startHour: number; /** Last visible hour in week/day views (1–24, exclusive). Default: `22`. */ endHour: number; /** BCP 47 locale tag used for date/time formatting (e.g. `'en-US'`, `'nl-NL'`). Default: `'en-US'`. */ locale: string; /** Label for the "Today" navigation button. Default: `'Today'`. */ todayLabel: string; /** Placeholder for the toolbar's date picker. Default: `'Pick a date'`. */ pickDateLabel: string; /** Accessible name for the toolbar's back arrow. Default: `'Previous'`. */ previousLabel: string; /** Accessible name for the toolbar's forward arrow. Default: `'Next'`. */ nextLabel: string; /** Title shown above the upcoming-events sidebar. Default: `'Upcoming events'`. */ upcomingEventsTitle: string; /** Message shown when there are no upcoming events. Default: `'No upcoming events'`. */ noUpcomingEvents: string; /** Word after the "+N" overflow count in a month cell — "+3 more". Default: `'more'`. */ moreEventsLabel: string; /** Display labels for each calendar view mode. */ viewLabels: Record; /** Abbreviated day names starting from Monday (length 7). Derived from `locale` when not set. */ shortDayNames: string[]; /** Full day names starting from Monday (length 7). Derived from `locale` when not set. */ longDayNames: string[]; /** Screen-width breakpoint (px) below which only day view is shown. Default: `768`. */ mobileBreakpoint: number; }; /** Default calendar configuration values. */ declare const DEFAULT_CALENDAR_CONFIG: CalendarConfig; /** * Injection token for the resolved calendar configuration. * * Prefer using {@link MN_CALENDAR_CONFIG} with `provideMnComponentConfig` * so that settings can be managed via `mn-config.json5`. This token is * kept for backward compatibility and manual `providers` usage. * * @example * ```ts * providers: [ * { provide: CALENDAR_CONFIG, useValue: { startHour: 8, endHour: 20, locale: 'nl-NL' } } * ] * ``` */ declare const CALENDAR_CONFIG: InjectionToken; /** * Injection token resolved via `MnConfigService` (the `mn-config.json5` system). * * Use the helper {@link provideMnCalendarConfig} in the component's `providers` * array so that calendar settings are read from the config file and support * `$translate` markers, section scoping, and instance-id overrides. * * Component name in the config file: `'mn-calendar'`. * * @example * ```json5 * // mn-config.json5 * { * defaults: { * "mn-calendar": { * startHour: 8, * endHour: 20, * locale: "nl-NL", * todayLabel: { $translate: "calendar.today" } * } * } * } * ``` */ declare const MN_CALENDAR_CONFIG: InjectionToken; /** Component name used to look up calendar settings in `mn-config.json5`. */ declare const MN_CALENDAR_COMPONENT_NAME = "mn-calendar"; /** * Provider helper that wires the calendar into the `mn-config` system. * * Add this to the `providers` array of the component (or module) that hosts * ``. It reads defaults and overrides from `mn-config.json5` * under the key `"mn-calendar"` and provides them via {@link MN_CALENDAR_CONFIG}. * * @param initial — optional partial defaults merged before config-file values. */ declare function provideMnCalendarConfig(initial?: Partial): i0.Provider; /** * Merges a partial config with defaults, re-deriving day names from locale when needed. */ declare function resolveCalendarConfig(partial?: Partial): CalendarConfig; /** * Represents a half-hour row in the week/day time grid. */ type HourRow = { /** The hour value (e.g. 7, 8, …). */ hour: number; /** CSS grid row start (1-based). */ topRow: number; /** CSS grid row end (1-based, exclusive). */ bottomRow: number; }; /** * Represents a single day column in the week view header. */ type ColumnDay = { /** The date this column represents. */ date: Date; /** Abbreviated day name (e.g. "Mon"). */ dayName: string; /** Day-of-month number (1–31). */ dayNumber: number; /** Whether this column is today. */ isToday: boolean; }; /** * Represents a single cell in the month grid. */ type MonthItem = { /** The date this cell represents. */ date: Date; /** Day-of-month number (1–31). */ dayNumber: number; /** Whether this date belongs to the currently focused month. */ isCurrentMonth: boolean; /** Whether this date is today. */ isToday: boolean; /** Events occurring on this date. */ events: CalendarEvent[]; }; /** * Abstraction for date/time formatting used by calendar components. * * The library ships a default implementation ({@link DefaultCalendarDateFormatter}) * that uses `Intl.DateTimeFormat`. Consumers can provide their own implementation * (e.g. wrapping `@ngx-translate`) via the {@link CALENDAR_DATE_FORMATTER} token. * * Locale-independent settings (day names, view labels, "Today" label) have been * moved to {@link CalendarConfig} so they can be configured declaratively. */ type CalendarDateFormatter = { /** Formats an hour + minute pair (e.g. `9, 0` → `"09:00 AM"`). */ formatTimeI(hour: number, minute: number): Promise; /** Formats the time portion of a Date. Returns `''` for `undefined`. */ formatTime(date: Date | undefined): Promise; /** Formats a full date-time string as an Observable. */ formatDateTime(date: Date): Observable; /** Formats a date-only string as an Observable. */ formatDate(date: Date): Observable; /** Formats a Date as `YYYY-MM-DD` for ``. */ formatDateForFormControl(date: Date): string; /** Returns `true` when both dates fall on the same calendar day. */ isSameDay(date1: Date, date2: Date): boolean; /** Formats a Date as "Month Year" (e.g. "January 2026"). */ formatMonthName(date: Date): Promise; }; /** * Injection token for the calendar date formatter. * * @example * ```ts * providers: [ * { provide: CALENDAR_DATE_FORMATTER, useClass: MyCustomFormatter } * ] * ``` */ declare const CALENDAR_DATE_FORMATTER: InjectionToken; /** * Default implementation of {@link CalendarDateFormatter} that uses the * browser's `Intl.DateTimeFormat` API for locale-aware formatting. * * The locale is read from the injected {@link CALENDAR_CONFIG}. If no config * is provided, `'en-US'` is used as the fallback. * * This service has no dependency on `@ngx-translate` or any other i18n library, * so the calendar library works out of the box. Consumers can replace it with * their own implementation via the `CALENDAR_DATE_FORMATTER` injection token. */ declare class DefaultCalendarDateFormatter implements CalendarDateFormatter { private readonly locale; constructor(); /** Formats an hour and minute pair into a locale time string (e.g. "09:00 AM"). */ formatTimeI(hour: number, minute: number): Promise; /** Formats the time portion of a Date (e.g. "2:30 PM"). Returns empty string for undefined. */ formatTime(date: Date | undefined): Promise; /** Formats a Date as a full date-time string (e.g. "May 15, 2026, 02:30 PM"). */ formatDateTime(date: Date): Observable; /** Formats a Date as a date-only string (e.g. "May 15, 2026"). */ formatDate(date: Date): Observable; /** Formats a Date as `YYYY-MM-DD` for use in `` controls. */ formatDateForFormControl(date: Date): string; /** Returns `true` if both dates fall on the same calendar day. */ isSameDay(date1: Date, date2: Date): boolean; /** Formats a Date as "Month Year" (e.g. "January 2026"). */ formatMonthName(date: Date): Promise; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * Service that computes the visual layout of calendar events within a * time-grid (week or day view). * * Responsibilities: * - Splitting multi-day events into per-day segments. * - Assigning non-overlapping column indices to concurrent events. * - Computing the width (column span) each event should occupy. * * This service is stateless — all state is passed via method parameters. * Provide it per-component (not root) so each view gets its own instance. */ declare class CalendarEventLayoutService { /** * Returns `true` when two time ranges overlap (exclusive boundaries). */ eventsOverlap(startA: Date, endA: Date, startB: Date, endB: Date): boolean; /** * Returns all events whose time range overlaps the given `[start, end)` window. */ getAllEventsOnSpecificTime(events: CalendarEvent[], start: Date, end: Date): CalendarEvent[]; /** * Splits multi-day events into per-day segments that fit within the * visible hour range (`startHour`–`endHour`) and date range. * * Single-day events are shallow-copied as-is. Multi-day events produce * one segment per day with `continued` / `continuedEnd` flags set. */ calculateMultiDayEvents(events: CalendarEvent[], startHour: number, endHour: number, rangeStart: Date, rangeEnd: Date): CalendarEvent[]; /** * Assigns a zero-based `column` index to each event so that overlapping * events occupy different columns. * * Events are processed in start-time order (longest duration first for ties). * Each event gets the earliest column not already occupied by an overlapping event. */ assignColumnsToEvents(events: CalendarEvent[]): void; /** * Assigns a `width` (column span) to each event, expanding it to fill * unused columns to its right within the overlapping group. */ assignWidthsToEvents(events: CalendarEvent[], scanStart: Date, scanEnd: Date): void; /** Finds the lowest column index not occupied by any overlapping event. */ private findEarliestPossibleColumn; /** Computes the maximum width an event can span without overlapping a neighbour to its right. */ private findBiggestPossibleWidth; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * Static utility methods for calendar grid positioning. */ declare class CalendarUtility { /** * Converts a weekday (from `Date.getDay()`) to a 1-based Monday-first column index. * Monday = 1, Tuesday = 2, …, Sunday = 7. */ static getCorrectColumn(date: Date): number; /** * Converts an hour + minute pair to a 1-based CSS grid row index * within a half-hour grid starting at `startHour`. * * Each hour occupies two rows (one per 30-minute slot). * Formula: `(hour - startHour) * 2 + (minute >= 30 ? 1 : 0) + 1` * * @returns Grid row number (minimum 1). */ static getCorrectRow(hour: number, minute: number, startHour: number): number; } export { CALENDAR_CONFIG, CALENDAR_DATE_FORMATTER, CalendarEventLayoutService, CalendarUtility, CalendarView, DEFAULT_CALENDAR_CONFIG, DefaultCalendarDateFormatter, MN_CALENDAR_COMPONENT_NAME, MN_CALENDAR_CONFIG, provideMnCalendarConfig, resolveCalendarConfig }; export type { CalendarButton, CalendarConfig, CalendarDateFormatter, CalendarEvent, CalendarEventData, ColorPreset, ColumnDay, CurrentTimeCalendarEvent, HourRow, MonthItem };