import { TimelineAlignment } from '../../../Types/TimelineAlignment'; import { CustomElement } from '../../Abstracts/CustomElement'; import type { ITimelineElementProps } from './ITimelineElementProps'; declare const TimelineElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Orientable").IOrientableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * Timeline - A sequential visualization of events or steps along a line. * * @description * The Timeline component renders a list of `TimelineItemElement` children * along a connecting line. It supports vertical and horizontal orientations * as well as start, end, and alternating alignment modes. * * @name Timeline * @element mosaik-timeline * @category Layouts * * @slot - Default slot for `TimelineItemElement` children. * * @csspart line - The visual connector line running through the timeline. * * @cssprop {String} --timeline-content-gap - Gap between content areas * @cssprop {String} --timeline-font-family - Font family for timeline text * @cssprop {String} --timeline-font-size - Font size for timeline text * @cssprop {String} --timeline-font-weight - Font weight for timeline text * @cssprop {String} --timeline-font-line-height - Line height for timeline text * @cssprop {String} --timeline-font-letter-spacing - Letter spacing for timeline text * @cssprop {String} --timeline-font-text-decoration - Text decoration for timeline text * @cssprop {String} --timeline-font-text-transform - Text transform for timeline text * @cssprop {Color} --timeline-foreground-color - Text color of the timeline * @cssprop {String} --timeline-gap - Gap between timeline items * @cssprop {Color} --timeline-line-color - Color of the connecting line * @cssprop {String} --timeline-line-offset - Offset position of the timeline line * @cssprop {String} --timeline-line-thickness - Thickness of the connecting line * @cssprop {Color} --timeline-marker-border-color - Border color of the marker * @cssprop {String} --timeline-marker-border-width - Border width of the marker * @cssprop {Color} --timeline-marker-color - Background color of the marker * @cssprop {String} --timeline-marker-size - Size of the timeline marker * @cssprop {String} --timeline-padding-top - Top padding of the timeline * @cssprop {String} --timeline-padding-right - Right padding of the timeline * @cssprop {String} --timeline-padding-bottom - Bottom padding of the timeline * @cssprop {String} --timeline-padding-left - Left padding of the timeline * @cssprop {String} --timeline-transition-duration - Transition duration * @cssprop {String} --timeline-transition-mode - Transition timing function * @cssprop {String} --timeline-transition-property - Properties that transition * @cssprop {String} --timeline-translate - CSS translate offset * * @dependency {TimelineItemElement} - Individual timeline entry * @dependency {TimelineMarkerElement} - Visual marker for each item * @dependency {TimelineContentElement} - Content area of a timeline item * @dependency {TimelineOppositeElement} - Opposite content area of a timeline item * * @fires connected {ConnectedEvent} - Fired when connected to DOM * @fires changed {PropertyChangedEvent} - Fired when a property changes * * @example * Vertical timeline: * ```html * * * * Step one * * * ``` * * @public */ export declare class TimelineElement extends TimelineElement_base implements ITimelineElementProps { private _align; /** * Constructs a new instance of the `TimelineElement` class. * * @public */ constructor(); /** * Returns the `is` property. * * @public * @static * @readonly */ static get is(): string; /** * Gets or sets the `align` property. * * @public * @attr */ get align(): TimelineAlignment; set align(value: TimelineAlignment); } /** * @public */ export declare namespace TimelineElement { type Props = ITimelineElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-timeline': TimelineElement; } } export {}; //# sourceMappingURL=TimelineElement.d.ts.map