import { IInvalidable } from '../../../Behaviors/Invalidable';
import { AutoToolTipPlacement } from '../../../Types/AutoToolTipPlacement';
import { TickPlacement } from '../../../Types/TickPlacement';
import { RangeBaseElement } from '../Abstracts/RangeBaseElement';
import type { ISliderElementProps } from './ISliderElementProps';
declare const SliderElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Orientable").IOrientableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Appearanceable").IAppearanceableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Focusable").IFocusableProps) & (abstract new (...args: Array<any>) => IInvalidable & import("../../../Behaviors/Invalidable").IInvalidableProps<unknown>) & typeof RangeBaseElement & import("../../../Behaviors/Themeable").IThemeableCtor;
/**
 * Slider - An interactive range input for selecting numeric values by dragging a handle along a track.
 *
 * @description
 * The Slider component provides precise value selection within defined ranges through intuitive
 * mouse, touch, and keyboard interaction. Supports both horizontal and vertical orientations,
 * customizable tick marks with labels, value tooltips during interaction, and comprehensive
 * accessibility. Features smooth animations, keyboard navigation (arrow keys, Home, End, Page Up/Down),
 * and flexible styling options. Essential for settings controls, filters, volume controls, and any
 * numeric input requiring visual feedback and range constraints.
 *
 * @name Slider
 * @element mosaik-slider
 * @category Ranges
 *
 * @slot prefix - Content displayed before the slider track (e.g., minimum value label or icon)
 * @slot suffix - Content displayed after the slider track (e.g., maximum value label or icon)
 *
 * @csspart root - Root container for the slider component
 * @csspart input - Native HTML range input element for slider functionality
 * @csspart tickBar - Tick mark container element for value indicators
 * @csspart tooltip - Value tooltip displayed during slider interaction
 * @csspart text - Text content within the tooltip
 *
 * @cssprop {String} --slider-background-color - Background color of the slider container
 * @cssprop {String} --slider-border-color - Border color for slider elements
 * @cssprop {String} --slider-border-radius - Border radius for rounded slider styling
 * @cssprop {String} --slider-border-style - Border style for slider elements
 * @cssprop {String} --slider-border-width - Border width for slider styling
 * @cssprop {String} --slider-font-family - Font family for slider text labels
 * @cssprop {String} --slider-font-letter-spacing - Letter spacing for slider text
 * @cssprop {String} --slider-font-line-height - Line height for slider text
 * @cssprop {String} --slider-font-size - Font size for slider labels and tooltip
 * @cssprop {String} --slider-font-text-decoration - Text decoration style for slider text
 * @cssprop {String} --slider-font-text-transform - Text transformation for slider labels
 * @cssprop {String} --slider-font-weight - Font weight for slider text
 * @cssprop {String} --slider-foreground-color - Foreground color for text and icons
 * @cssprop {String} --slider-gap - Spacing between slider elements
 * @cssprop {String} --slider-padding-top - Top padding for slider container
 * @cssprop {String} --slider-padding-right - Right padding for slider container
 * @cssprop {String} --slider-padding-bottom - Bottom padding for slider container
 * @cssprop {String} --slider-padding-left - Left padding for slider container
 * @cssprop {String} --slider-shadow - Drop shadow or elevation effect
 * @cssprop {String} --slider-thumb-background-color - Background color of the draggable thumb
 * @cssprop {String} --slider-thumb-border-color - Border color of the thumb handle
 * @cssprop {String} --slider-thumb-border-radius - Border radius for thumb styling
 * @cssprop {String} --slider-thumb-border-style - Border style for thumb element
 * @cssprop {String} --slider-thumb-border-width - Border width for thumb outline
 * @cssprop {String} --slider-thumb-foreground-color - Foreground/fill color of the thumb
 * @cssprop {String} --slider-thumb-size - Size dimensions of the draggable thumb handle
 * @cssprop {String} --slider-tick-gap - Spacing between tick marks
 * @cssprop {String} --slider-tooltip-background-color - Background color of value tooltip
 * @cssprop {String} --slider-tooltip-border-color - Border color of tooltip
 * @cssprop {String} --slider-tooltip-border-radius - Border radius for tooltip styling
 * @cssprop {String} --slider-tooltip-border-style - Border style for tooltip
 * @cssprop {String} --slider-tooltip-border-width - Border width for tooltip outline
 * @cssprop {String} --slider-tooltip-font-family - Font family for tooltip text
 * @cssprop {String} --slider-tooltip-font-letter-spacing - Letter spacing for tooltip text
 * @cssprop {String} --slider-tooltip-font-line-height - Line height for tooltip text
 * @cssprop {String} --slider-tooltip-font-size - Font size for tooltip value display
 * @cssprop {String} --slider-tooltip-font-text-decoration - Text decoration for tooltip
 * @cssprop {String} --slider-tooltip-font-text-transform - Text transformation for tooltip
 * @cssprop {String} --slider-tooltip-font-weight - Font weight for tooltip text
 * @cssprop {String} --slider-tooltip-foreground-color - Foreground color for tooltip text
 * @cssprop {String} --slider-tooltip-gap - Spacing within tooltip elements
 * @cssprop {String} --slider-tooltip-padding-top - Top padding for tooltip content
 * @cssprop {String} --slider-tooltip-padding-right - Right padding for tooltip content
 * @cssprop {String} --slider-tooltip-padding-bottom - Bottom padding for tooltip content
 * @cssprop {String} --slider-tooltip-padding-left - Left padding for tooltip content
 * @cssprop {String} --slider-tooltip-shadow - Drop shadow effect for tooltip
 * @cssprop {String} --slider-tooltip-transition-duration - Animation duration for tooltip appearance
 * @cssprop {String} --slider-tooltip-transition-mode - Animation easing for tooltip transitions
 * @cssprop {String} --slider-tooltip-transition-property - CSS properties to animate on tooltip
 * @cssprop {String} --slider-track-size - Height (horizontal) or width (vertical) of slider track
 * @cssprop {String} --slider-transition-duration - Animation duration for slider interactions
 * @cssprop {String} --slider-transition-mode - Animation easing mode for slider transitions
 * @cssprop {String} --slider-transition-property - CSS properties to animate during interactions
 *
 * @dependency {TextElement} - For rendering labels and tooltip text
 * @dependency {TickBarElement} - For displaying tick marks and value indicators
 *
 * @fires rangeValueChanged {RangeValueChangedEvent} - Fired when the slider value changes
 *
 * @example
 * Basic horizontal slider:
 * ```html
 * <mosaik-slider min="0" max="100" value="50"></mosaik-slider>
 * ```
 *
 * @example
 * Volume slider with icons:
 * ```html
 * <mosaik-slider min="0" max="100" value="75">
 *   <mosaik-icon slot="prefix" data="volume-off"></mosaik-icon>
 *   <mosaik-icon slot="suffix" data="volume-up"></mosaik-icon>
 * </mosaik-slider>
 * ```
 *
 * @example
 * Slider with tick marks and tooltip:
 * ```html
 * <mosaik-slider
 *   min="0"
 *   max="10"
 *   value="5"
 *   step="1"
 *   ticks="1"
 *   tick-placement="both"
 *   tooltip-placement="top"
 *   show-tick-labels>
 * </mosaik-slider>
 * ```
 *
 * @example
 * Vertical brightness slider:
 * ```html
 * <mosaik-slider
 *   min="0"
 *   max="255"
 *   value="128"
 *   orientation="vertical"
 *   variant="primary"
 *   tooltip-placement="right">
 * </mosaik-slider>
 * ```
 *
 * @example
 * Price range filter with custom labels:
 * ```html
 * <div class="price-filter">
 *   <label>Price Range</label>
 *   <mosaik-slider
 *     min="0"
 *     max="1000"
 *     value="250"
 *     step="10"
 *     tooltip-placement="top">
 *     <span slot="prefix">$0</span>
 *     <span slot="suffix">$1000</span>
 *   </mosaik-slider>
 * </div>
 * ```
 *
 * @example
 * Temperature control with custom tooltip:
 * ```html
 * <mosaik-slider
 *   id="tempSlider"
 *   min="16"
 *   max="30"
 *   value="22"
 *   step="0.5"
 *   ticks="1"
 *   tick-placement="after"
 *   tooltip-placement="top">
 * </mosaik-slider>
 * <script>
 *   document.getElementById('tempSlider').tooltipAccessor = (v) => `${v}°C`;
 * </script>
 * ```
 *
 * @public
 */
export declare class SliderElement extends SliderElement_base implements ISliderElementProps, IInvalidable {
    private _inputElement;
    private _step;
    private _ticks;
    private _tickPlacement;
    private _tooltipPlacement;
    private _tooltipAccessor;
    private _track;
    private _showTickLabels;
    private _tickLabelAccessor;
    /**
     * @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 `step` property.
     *
     * @public
     * @attr
     */
    get step(): number;
    set step(value: number);
    /**
     * Gets or sets the `ticks` property.
     *
     * @public
     * @attr
     */
    get ticks(): number;
    set ticks(value: number);
    /**
     * Gets or sets the `tickPlacement` property.
     *
     * @public
     * @attr
     */
    get tickPlacement(): TickPlacement;
    set tickPlacement(value: TickPlacement);
    /**
     * Gets or sets the `tooltipPlacement` property.
     *
     * @public
     * @attr
     */
    get tooltipPlacement(): AutoToolTipPlacement;
    set tooltipPlacement(value: AutoToolTipPlacement);
    /**
     * Gets or sets the `tooltipAccessor` property.
     *
     * @public
     */
    get tooltipAccessor(): (value: number) => string;
    set tooltipAccessor(value: (value: number) => string);
    /**
     * Gets or sets the `track` property.
     *
     * @public
     * @attr
     */
    get track(): boolean;
    set track(value: boolean);
    /**
     * Gets or sets the `showTickLabels` property.
     *
     * @public
     * @attr
     */
    get showTickLabels(): boolean;
    set showTickLabels(value: boolean);
    /**
     * Gets or sets the `tickLabelAccessor` property.
     *
     * @public
     */
    get tickLabelAccessor(): (value: number) => string;
    set tickLabelAccessor(value: (value: number) => string);
    /**
     * Decrements the value by the value given by the `Step` property.
     * If the optional parameter is used, it will decrement the step value multiplied by the parameter's value.
     *
     * @public
     * @param value - Value to decrement the value by.
     */
    stepDown(value?: number): void;
    /**
     * Increments the value by the value given by the `Step` property.
     * If the optional parameter is used, will increment the step value by that value.
     *
     * @public
     * @param value - Value to increment the value by.
     */
    stepUp(value?: number): void;
    /**
     * Checks the validity of the element and returns `true` if it is valid; otherwise, `false`.
     *
     * @public
     * @override
     */
    checkValidity(): boolean;
    /**
     * @protected
     */
    protected onApplyTemplate(): void;
}
/**
 * @public
 */
export declare namespace SliderElement {
    type Props = ISliderElementProps;
}
/**
 * @public
 */
declare global {
    interface HTMLElementTagNameMap {
        'mosaik-slider': SliderElement;
    }
}
export {};
//# sourceMappingURL=SliderElement.d.ts.map