import { type IEventEmitter } from '@breadstone/mosaik-elements'; import type { ISchedulerEventChangeEventDetail } from '../../../events/SchedulerEvents'; import { SchedulerView } from '../../../Types/SchedulerView'; import { CustomElement } from '../../Abstracts/CustomElement'; import { ISchedulerEventElementProps, SchedulerEventStatus } from './ISchedulerEventElementProps'; declare const SchedulerEventElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Rippleable").IRippleableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Slottable").ISlottableProps & import("../../../Behaviors/Slottable").ISlottable) & (abstract new (...args: Array) => import("../../../Behaviors/Focusable").IFocusableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Valueable").IValueableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Appearanceable").IAppearanceableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Boundable").IBoundableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * SchedulerEvent - A public event definition element for the Scheduler. * * @description * The SchedulerEvent component represents an event in the scheduler. It serves as * a data host that the parent Scheduler reads to position and render events in the grid. * The element's slots provide content for the rendered event box. * The `layout` property controls which slots are rendered and how the event is styled, * allowing the same element to adapt to different scheduler views. * * @name SchedulerEvent * @element mosaik-scheduler-event * @category Inputs * * @slot title - The title content of the event (all layouts) * @slot content - The content of the event (timeGrid and agenda layouts) * @slot footer - Footer content (timeGrid layout only) * * @csspart container - The main container element * @csspart layout-time-grid - Applied when layout="timeGrid" * @csspart layout-month - Applied when layout="month" * @csspart layout-agenda - Applied when layout="agenda" * @csspart focusRing - The focus indicator ring * @csspart ripple - The ripple effect container * @csspart content - The content wrapper * @csspart title - The title slot container * @csspart subtitle - The content/subtitle slot container * @csspart footer - The footer slot container (timeGrid only) * @csspart popup - The popup element (timeGrid only) * * @cssprop {String} --scheduler-event-agenda-gap - Gap between elements in agenda layout * @cssprop {String} --scheduler-event-agenda-min-height - Minimum height in agenda layout * @cssprop {String} --scheduler-event-agenda-padding - Padding in agenda layout * @cssprop {Color} --scheduler-event-all-day-background-color - Background color for all-day events * @cssprop {Color} --scheduler-event-all-day-foreground-color - Foreground color for all-day events * @cssprop {Color} --scheduler-event-background-color - Default background color * @cssprop {Color} --scheduler-event-border-color - Border color * @cssprop {String} --scheduler-event-border-radius - Border radius * @cssprop {String} --scheduler-event-border-style - Border style * @cssprop {String} --scheduler-event-border-width - Border width * @cssprop {String} --scheduler-event-box-shadow - Box shadow * @cssprop {Color} --scheduler-event-focus-ring-color - Color of the focus ring * @cssprop {String} --scheduler-event-font-family - Font family * @cssprop {String} --scheduler-event-font-line-height - Line height * @cssprop {String} --scheduler-event-font-size - Font size * @cssprop {String} --scheduler-event-font-weight - Font weight * @cssprop {Color} --scheduler-event-foreground-color - Foreground/text color * @cssprop {Color} --scheduler-event-hover-background-color - Background color on hover * @cssprop {String} --scheduler-event-month-border-radius - Border radius in month layout * @cssprop {String} --scheduler-event-month-font-size - Font size in month layout * @cssprop {String} --scheduler-event-month-gap - Gap between elements in month layout * @cssprop {String} --scheduler-event-month-line-height - Line height in month layout * @cssprop {String} --scheduler-event-month-min-height - Minimum height in month layout * @cssprop {String} --scheduler-event-month-padding - Padding in month layout * @cssprop {String} --scheduler-event-padding - Default padding * @cssprop {String} --scheduler-event-shadow-blur - Shadow blur radius * @cssprop {Color} --scheduler-event-shadow-color - Shadow color * @cssprop {String} --scheduler-event-shadow-offset-x - Shadow horizontal offset * @cssprop {String} --scheduler-event-shadow-offset-y - Shadow vertical offset * @cssprop {String} --scheduler-event-shadow-spread - Shadow spread radius * @cssprop {String} --scheduler-event-transition-duration - Transition duration * @cssprop {String} --scheduler-event-transition-mode - Transition timing function * @cssprop {String} --scheduler-event-transition-property - CSS properties to transition * * @dependency {FocusRingElement} - Keyboard focus indicator component * @dependency {RippleElement} - Click/tap ripple effect component * @dependency {PopupElement} - Popup component for displaying additional information on hover/focus * * @example * Basic event definition: * ```html * * * Team Meeting * Discuss project progress * Microsoft Teams * * * ``` * * @public */ export declare class SchedulerEventElement extends SchedulerEventElement_base implements ISchedulerEventElementProps { private readonly _inheritance; private readonly _schedulerEventChange; private _eventKey; private _start; private _end; private _allDay; private _status; private _keyGenerated; constructor(); /** * Returns the `is` property. * * @public * @static * @readonly */ static get is(): string; /** * Gets or sets the unique key for the event. * If not provided, a key will be generated on connect. * * @public * @attr */ get eventKey(): string; set eventKey(value: string); /** * Gets or sets whether this is an all-day event. * * @public * @attr */ get allDay(): boolean; set allDay(value: boolean); /** * Gets or sets the status of the event. * * @public * @attr */ get status(): SchedulerEventStatus; set status(value: SchedulerEventStatus); /** * Gets the layout mode for rendering the event. * This value is inherited from the parent scheduler view. * * - `timeGrid` - Vertical card layout with title, content, footer (default) * - `month` - Compact chip layout with time and title only * - `agenda` - Horizontal row layout for list views * * @public * @attr * @readonly */ get view(): SchedulerView; /** * Called when the event data changes (start, end). * Provides reference to `ISchedulerEventChangeEventDetail` as event detail. * * @public * @readonly * @eventProperty */ get schedulerEventChange(): IEventEmitter; /** * @public * @override */ connectedCallback(): void; /** * Handles changes to the start property and notifies the parent scheduler. * * @protected */ protected onStartChanged(prev?: Date, next?: Date): void; /** * Handles changes to the end property and notifies the parent scheduler. * * @protected */ protected onEndChanged(prev?: Date, next?: Date): void; } /** * @public */ export declare namespace SchedulerEventElement { type Props = ISchedulerEventElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-scheduler-event': SchedulerEventElement; } } export {}; //# sourceMappingURL=SchedulerEventElement.d.ts.map