import { IEventDetail, IEventEmitter } from '@breadstone/mosaik-elements'; import { type IInvalidable } from '../../../Behaviors/Invalidable'; import type { ICalendarViewChangedEventDetail, IDateChangedEventDetail } from '../../../events'; import type { CalendarMarkerHandler } from '../../../Types/CalendarMarkerHandler'; import { CalendarView } from '../../../Types/CalendarView'; import { DayOfWeek } from '../../../Types/DayOfWeek'; import { RangeSelectionMode } from '../../../Types/RangeSelectionMode'; import { CustomElement } from '../../Abstracts/CustomElement'; import type { ICalendarElementProps } from './ICalendarElementProps'; import { CalendarElementIntl } from './Intl/CalendarElementIntl'; declare const CalendarElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Localeable").ILocaleableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Appearanceable").IAppearanceableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array) => IInvalidable & import("../../../Behaviors/Invalidable").IInvalidableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Valueable").IValueableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Orientable").IOrientableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Fitable").IFitableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * Calendar - A user interface component for displaying dates and events in a chronological order. * * @description * The Calendar component provides a visual representation of dates and events in a structured grid layout, * typically organized by months and days. It allows users to view and interact with events, appointments, * and other time-based information. Calendar components often support features like navigation between months, * week or day views, event creation, and event details. * * @name Calendar * @element mosaik-calendar * @category User Interface * * @slot footer - The footer slot. * * @csspart content - The content part. * @csspart daysView - The daysView part. * @csspart header - The header part. * @csspart monthView - The month view part. * @csspart navigation - The navigation part. * @csspart next - The navigation next button part. * @csspart previous - The navigation previous button part. * @csspart sheet - Individual calendar sheet. * @csspart sheets-container - The container for multiple calendar sheets. * @csspart today - The navigation today button part. * @csspart yearsView - The years view part. * * @cssprop {String} --calendar-background-color - The background color CSS custom property. * @cssprop {String} --calendar-border-color - The border color CSS custom property. * @cssprop {String} --calendar-border-radius - The border radius CSS custom property. * @cssprop {String} --calendar-border-style - The border style CSS custom property. * @cssprop {String} --calendar-border-width - The border width CSS custom property. * @cssprop {String} --calendar-divider-height - The divider height CSS custom property. * @cssprop {String} --calendar-font-family - The font family CSS custom property. * @cssprop {String} --calendar-font-letter-spacing - The font letter spacing CSS custom property. * @cssprop {String} --calendar-font-line-height - The font line height CSS custom property. * @cssprop {String} --calendar-font-size - The font size CSS custom property. * @cssprop {String} --calendar-font-text-decoration - The font text decoration CSS custom property. * @cssprop {String} --calendar-font-text-transform - The font text transform CSS custom property. * @cssprop {String} --calendar-font-weight - The font weight CSS custom property. * @cssprop {String} --calendar-foreground-color - The foreground color CSS custom property. * @cssprop {String} --calendar-gap - The gap CSS custom property. * @cssprop {String} --calendar-padding-bottom - The padding bottom CSS custom property. * @cssprop {String} --calendar-padding-left - The padding left CSS custom property. * @cssprop {String} --calendar-padding-right - The padding right CSS custom property. * @cssprop {String} --calendar-padding-top - The padding top CSS custom property. * @cssprop {String} --calendar-shadow - The shadow CSS custom property. * @cssprop {String} --calendar-shadow-blur - The shadow blur CSS custom property. * @cssprop {String} --calendar-shadow-color - The shadow color CSS custom property. * @cssprop {String} --calendar-shadow-offset-x - The shadow offset x CSS custom property. * @cssprop {String} --calendar-shadow-offset-y - The shadow offset y CSS custom property. * @cssprop {String} --calendar-shadow-spread - The shadow spread CSS custom property. * @cssprop {String} --calendar-transition-duration - The transition duration CSS custom property. * @cssprop {String} --calendar-transition-mode - The transition mode CSS custom property. * @cssprop {String} --calendar-transition-property - The transition property CSS custom property. * @cssprop {String} --calendar-translate - The translate CSS custom property. * * @fires dateChanged {DateChangedEvent} - Fired when the date has changed. * * @dependency mosaik-button - The Button element. * @dependency mosaik-button-group - The Button Group element. * @dependency mosaik-calendar-days-view - The Calendar Days View element. * @dependency mosaik-calendar-header - The Calendar Header element. * @dependency mosaik-calendar-months-view - The Calendar Months View element. * @dependency mosaik-calendar-sub-header - The Calendar Sub Header element. * @dependency mosaik-calendar-years-view - The Calendar Years View element. * @dependency mosaik-stack - The Stack element. * * @example * Basic calendar: * ```html * * ``` * * @example * Calendar with variant and appearance: * ```html * * ``` * * @example * Horizontal multi-sheet calendar: * ```html * * ``` * * @public */ export declare class CalendarElement extends CalendarElement_base implements ICalendarElementProps, IInvalidable { private readonly _dateChanged; private readonly _intl; private _displayDate; private _displayDateStart; private _displayDateEnd; private _header; private _value; private _values; private _view; private _selectionMode; private _blackoutDates; private _specialDates; private _minDate; private _maxDate; private _firstDayOfWeek; private _isTodayHighlighted; private _isWeekendHighlighted; private _showWeekNumbers; private _markerHandler; private _showAdjacent; private _sheets; /** * @public */ constructor(); /** * Returns the `is` property. * The `is` property represents natural name of this element. * * @public * @static * @readonly */ static get is(): string; /** * Returns the `displayDate` property. * The `displayDate` property represents the initial date to display in the calendar. * * @public * @attr */ get displayDate(): Date | null; set displayDate(value: Date | null); /** * Returns the `displayDateStart` property. * The `displayDateStart` property represents the start date to display in the calendar. * * @public * @attr */ get displayDateStart(): Date | null; set displayDateStart(value: Date | null); /** * Returns the `displayDateEnd` property. * The `displayDateEnd` property represents the end date to display in the calendar. * * @public * @attr */ get displayDateEnd(): Date | null; set displayDateEnd(value: Date | null); /** * Gets or sets the `header` property. * * @public * @attr */ get header(): string; set header(value: string); /** * Gets or sets the `value` property. * * @public * @override * @attr */ get value(): Date | null; set value(value: Date | null); /** * Gets or sets the `values` property. * * @public * @attr */ get values(): Array; set values(value: Array); /** * Gets or sets the `view` property. * * @public * @attr */ get view(): CalendarView; set view(value: CalendarView); /** * Gets or sets the `selectionMode` property. * * @public * @attr */ get selectionMode(): RangeSelectionMode; set selectionMode(value: RangeSelectionMode); /** * Gets or sets the `blackoutDates` property. * * @public * @attr */ get blackoutDates(): Array; set blackoutDates(value: Array); /** * Gets or sets the `specialDates` property. * * @public * @attr */ get specialDates(): Array; set specialDates(value: Array); /** * Gets or sets the `minDate` property. * * @public * @attr */ get minDate(): Date | null; set minDate(value: Date | null); /** * Gets or sets the `maxDate` property. * * @public * @attr */ get maxDate(): Date | null; set maxDate(value: Date | null); /** * Gets or sets the `firstDayOfWeek` property. * * @public * @attr */ get firstDayOfWeek(): DayOfWeek; set firstDayOfWeek(value: DayOfWeek); /** * Gets or sets the `isTodayHighlighted` property. * * @public * @attr */ get isTodayHighlighted(): boolean; set isTodayHighlighted(value: boolean); /** * Gets or sets the `isWeekendHighlighted` property. * * @public * @attr */ get isWeekendHighlighted(): boolean; set isWeekendHighlighted(value: boolean); /** * Gets or sets the `showWeekNumbers` property. * * @public * @attr */ get showWeekNumbers(): boolean; set showWeekNumbers(value: boolean); /** * A handler that gets date and returns null or a tuple with circled marker data. See `CalendarMarkerData`. * * @public * @attr */ get markerHandler(): CalendarMarkerHandler; set markerHandler(value: CalendarMarkerHandler); /** * Gets or sets the `showAdjacent` property. * * @public * @attr */ get showAdjacent(): boolean; set showAdjacent(value: boolean); /** * Gets or sets the `sheets` property. * The `sheets` property represents the number of calendar sheets to display simultaneously. * * @public * @attr */ get sheets(): number; set sheets(value: number); /** * Returns the `intl` property. * * @public * @readonly */ get intl(): CalendarElementIntl; /** * Called when the date is changed. * Provides reference to `IEventDetail` as event detail. * * @public * @readonly * @eventProperty */ get dateChanged(): IEventEmitter; /** * Resets the value, all kinds of validation and errors. * * @public */ reset(): void; /** * Checks the validity of the element and returns `true` if it is valid; otherwise, `false`. * * @public * @override */ checkValidity(): boolean; /** * @public */ navigatePrevious(): void; /** * @public */ navigateNext(): void; /** * @public */ navigateToday(): void; /** * @protected */ protected onLocalePropertyChanged(prev?: string, next?: string): void; protected onValuePropertyChanged(prev?: Date, next?: Date): void; /** * @protected * @template */ onValueChanged(detail: IDateChangedEventDetail): void; /** * @protected * @template */ onViewChanged(detail: ICalendarViewChangedEventDetail): void; /** * Emits the `dateChanged` event. * * @protected */ protected onDateChanged(args: IDateChangedEventDetail): void; } /** * @public */ export declare namespace CalendarElement { type Props = ICalendarElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-calendar': CalendarElement; } } export {}; //# sourceMappingURL=CalendarElement.d.ts.map