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 content - The content of the event (timeGrid and agenda layouts) * @slot footer - Footer content (timeGrid layout only) * @slot title - The title content of the event (all layouts) * * @csspart content - The content wrapper * @csspart focusRing - The focus indicator ring * @csspart footer - The footer slot container (timeGrid only) * @csspart popup - The popup element (timeGrid only) * @csspart ripple - The ripple effect container * @csspart subtitle - The content/subtitle slot container * @csspart title - The title slot container * * @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 {String} --scheduler-event-focus-ring-active-width - The event focus ring active width CSS custom property. * @cssprop {Color} --scheduler-event-focus-ring-color - Color of the focus ring * @cssprop {String} --scheduler-event-focus-ring-inward-offset - The event focus ring inward offset CSS custom property. * @cssprop {String} --scheduler-event-focus-ring-outward-offset - The event focus ring outward offset CSS custom property. * @cssprop {String} --scheduler-event-font-family - Font family * @cssprop {String} --scheduler-event-font-letter-spacing - The event font letter spacing CSS custom property. * @cssprop {String} --scheduler-event-font-line-height - Line height * @cssprop {String} --scheduler-event-font-size - Font size * @cssprop {String} --scheduler-event-font-text-decoration - The event font text decoration CSS custom property. * @cssprop {String} --scheduler-event-font-text-transform - The event font text transform CSS custom property. * @cssprop {String} --scheduler-event-font-weight - Font weight * @cssprop {Color} --scheduler-event-foreground-color - Foreground/text color * @cssprop {String} --scheduler-event-gap - The event gap CSS custom property. * @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-padding-bottom - The event padding bottom CSS custom property. * @cssprop {String} --scheduler-event-padding-left - The event padding left CSS custom property. * @cssprop {String} --scheduler-event-padding-right - The event padding right CSS custom property. * @cssprop {String} --scheduler-event-padding-top - The event padding top CSS custom property. * @cssprop {Color} --scheduler-event-ripple-color - The event ripple color CSS custom property. * @cssprop {String} --scheduler-event-ripple-duration - The event ripple duration CSS custom property. * @cssprop {String} --scheduler-event-shadow - The event shadow CSS custom property. * @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 * @cssprop {String} --scheduler-event-translate - The event translate CSS custom property. * * @dependency mosaik-dot - The Dot element. * @dependency mosaik-focus-ring - The Focus Ring element. * @dependency mosaik-popup - The Popup element. * @dependency mosaik-ripple - The Ripple element. * @dependency mosaik-stack - The Stack element. * @dependency mosaik-text - The Text element. * * @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