import { IEventEmitter } from '@breadstone/mosaik-elements'; import { ISwipeLeftEventDetail, ISwipeRightEventDetail } from '../../../events'; import { CustomElement } from '../../Abstracts/CustomElement'; import { ISwipeElementProps } from './ISwipeElementProps'; declare const SwipeElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * Swipe - A gesture-based interaction for move content by swiping. * * @description * The Swipe component enables users to navigate through content by swiping left or right on a touch-enabled device or using mouse gestures. It is commonly used in carousel sliders, image galleries, and other interfaces where sequential or paginated navigation is required. Swiping gestures allow for intuitive and fluid interaction, enhancing the user experience. * * @element mosaik-swipe * @category Primitives * * @slot - The default content slot. * @slot after - The after swipe slot. * @slot before - The before swipe slot. * * @csspart after-panning-container - The after-panning-container part. * @csspart before-panning-container - The before-panning-container part. * @csspart content-container - The content-container part. * @csspart panable-container - The panable-container part. * * @cssprop {String} --swipe-font-family - The font family CSS custom property. * @cssprop {String} --swipe-font-letter-spacing - The font letter spacing CSS custom property. * @cssprop {String} --swipe-font-line-height - The font line height CSS custom property. * @cssprop {String} --swipe-font-size - The font size CSS custom property. * @cssprop {String} --swipe-font-text-decoration - The font text decoration CSS custom property. * @cssprop {String} --swipe-font-text-transform - The font text transform CSS custom property. * @cssprop {String} --swipe-font-weight - The font weight CSS custom property. * @cssprop {String} --swipe-gap - The gap CSS custom property. * @cssprop {String} --swipe-padding-bottom - The padding bottom CSS custom property. * @cssprop {String} --swipe-padding-left - The padding left CSS custom property. * @cssprop {String} --swipe-padding-right - The padding right CSS custom property. * @cssprop {String} --swipe-padding-top - The padding top CSS custom property. * @cssprop {String} --swipe-shadow - The shadow CSS custom property. * @cssprop {String} --swipe-shadow-blur - The shadow blur CSS custom property. * @cssprop {String} --swipe-shadow-color - The shadow color CSS custom property. * @cssprop {String} --swipe-shadow-offset-x - The shadow offset x CSS custom property. * @cssprop {String} --swipe-shadow-offset-y - The shadow offset y CSS custom property. * @cssprop {String} --swipe-shadow-spread - The shadow spread CSS custom property. * @cssprop {String} --swipe-transition-duration - The transition duration CSS custom property. * @cssprop {String} --swipe-transition-mode - The transition mode CSS custom property. * @cssprop {String} --swipe-transition-property - The transition property CSS custom property. * @cssprop {String} --swipe-translate - The translate CSS custom property. * * @fires swipeLeft {SwipeLeftEvent} - Called when the left swipe gesture is detected. * @fires swipeRight {SwipeRightEvent} - Called when the right swipe gesture is detected. * * @example * ```html * * * * ``` * * @public */ export declare class SwipeElement extends SwipeElement_base implements ISwipeElementProps { private readonly _swipeLeft; private readonly _swipeRight; private _panOffset; private _panState; private readonly _panController; private _beforePanningContainerElement; private _afterPanningContainerElement; private _contentContainerElement; private _panEndTriggeringThreshold; private _panLeftDisabled; private _panRightDisabled; /** * @public */ constructor(); /** * Returns the `is` property. * The `is` property represents natural name of this element. * * @public * @static * @readonly */ static get is(): string; /** * Gets or sets the `panEndTriggeringThreshold` property. * * @public * @attr */ get panEndTriggeringThreshold(): number; set panEndTriggeringThreshold(value: number); /** * Gets or sets the `panLeftDisabled` property. * * @public * @attr */ get panLeftDisabled(): boolean; set panLeftDisabled(value: boolean); /** * Gets or sets the `panRightDisabled` property. * * @public * @attr */ get panRightDisabled(): boolean; set panRightDisabled(value: boolean); /** * Called when the left swipe gesture is detected. * Provides reference to `ISwipeLeftEventDetail` as event detail. * * @public * @readonly * @eventProperty */ get swipeLeft(): IEventEmitter; /** * Called when the right swipe gesture is detected. * Provides reference to `ISwipeRightEventDetail` as event detail. * * @public * @readonly * @eventProperty */ get swipeRight(): IEventEmitter; /** * @public */ panLeft(): void; /** * @public */ panRight(): void; protected onApplyTemplate(): void; /** * @protected */ protected onPanStart(_event: Event): void; /** * @protected */ protected onPanMove(event: CustomEvent): void; /** * @protected */ protected onPanEnd(_event: Event): void; /** * @private */ private setContentElementTransform; } /** * @public */ export declare namespace SwipeElement { type Props = ISwipeElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-swipe': SwipeElement; } } export {}; //# sourceMappingURL=SwipeElement.d.ts.map