import { LitElement } from 'lit';
import '../icon-button/icon-button.js';
/**
 * Enum of slider visual and interaction variants.
 *
 * - `normal`: Standard slider appearance and interaction.
 * - `enhanced`: Visually prominent slider with increased track and thumb size for easier manipulation.
 * - `no-input`: Read-only display; disables user input and interaction.
 */
export declare enum ObcSliderVariant {
    Normal = "normal",
    Enhanced = "enhanced",
    NoInput = "no-input"
}
/**
 * Custom event type for slider value changes.
 * The event detail contains the new numeric value.
 */
export type ObcSliderValueEvent = CustomEvent<number>;
/**
 * `<obc-slider>` – A horizontal slider component for selecting a numeric value within a defined range.
 *
 * Provides a visual and interactive way for users to adjust values such as volume, brightness, or other continuous settings. The slider supports optional step increments, left/right icon buttons for quick adjustments, and can be configured for read-only display or enhanced visual prominence.
 *
 * Appears as a horizontal track with a draggable thumb, and may include optional icon buttons on either side for increment/decrement actions. The component can be used for both direct manipulation (dragging the thumb) and discrete changes (via buttons).
 *
 * ---
 *
 * ### Features
 * - **Variants:**
 *   - **Normal:** Standard slider with a slim track and thumb.
 *   - **Enhanced:** Larger track and thumb for improved accessibility and visual emphasis.
 *   - **No Input:** Read-only mode; disables all user interaction and presents the current value visually.
 * - **Value Range:** Supports configurable `min`, `max`, and `step` properties for precise control over allowed values.
 * - **Step Buttons:** Optional left and right icon buttons allow users to increment or decrement the value by a defined step (`stepClick`).
 * - **Icons:** Custom icons can be slotted into the left and right button positions for contextual meaning (e.g., `<obi-arrow></obi-arrow>, <obi-placeholder></obi-placeholder>`).
 * - **Seeking:** When `allowSeeking` is enabled, users can click or drag along the track to set the value, with smooth animated transitions based on `seekingSpeed`.
 * - **Hug Container:** The `hugcontainer` attribute removes spacing between the slider and its icon buttons, allowing for a compact layout.
 * - **Accessibility:** Underlying input is a native `<input type="range">` for keyboard and screen reader support.
 *
 * ---
 *
 * ### Usage Guidelines
 * Use `obc-slider` when you need users to select or adjust a value within a continuous or stepped range, such as for volume, brightness, or similar controls. The enhanced variant is suitable for scenarios where the slider is a primary control or needs to be more visually prominent. The no-input variant is ideal for displaying a value without allowing user changes.
 *
 * - For discrete, step-based changes, provide `step` and/or `stepClick` values.
 * - Use left/right icons to clarify the meaning of the adjustment (e.g., low/high, decrease/increase).
 * - Enable `allowSeeking` for scenarios where users should be able to jump to a specific value by clicking the track.
 * - Use `hugcontainer` when the slider should visually connect tightly with its icon buttons.
 *
 * **TODO(designer):** Clarify recommended use cases for each variant and when to use `allowSeeking` vs. standard interaction.
 *
 * ---
 *
 * ### Slots
 *
 * | Slot Name   | Renders When...            | Purpose                                    |
 * |-------------|---------------------------|--------------------------------------------|
 * | icon-left   | `hasLeftIcon` is true     | Icon/button for decrement action            |
 * | icon-right  | `hasRightIcon` is true    | Icon/button for increment action            |
 *
 * ---
 *
 * ### Properties and Attributes
 * - `value` (number): Current slider value. Updates as the user interacts.
 * - `min` (number): Minimum allowed value (default: 0).
 * - `max` (number): Maximum allowed value (default: 100).
 * - `step` (number): Step granularity for value changes (optional).
 * - `stepClick` (number): Amount to increment/decrement when clicking icon buttons (default: 10).
 * - `variant` (ObcSliderVariant): Visual/interaction style (`normal`, `enhanced`, `no-input`). Default: `normal`.
 * - `hasLeftIcon`/`hasRightIcon` (boolean): Show icon button on left/right.
 * - `allowSeeking` (boolean): Enables animated seeking to clicked value on the track.
 * - `seekingSpeed` (number): Animation speed for seeking (default: 1/3; higher is faster).
 * - `hugcontainer` (attribute): Removes spacing between slider and icon buttons for a compact layout.
 *
 * ---
 *
 * ### Events
 * - `value` – Fired when the slider value changes, either by user interaction or programmatically. The event detail contains the new value as a number.
 *
 * ---
 *
 * ### Best Practices & Constraints
 * - Only use `no-input` variant for read-only display; interactive controls should use `normal` or `enhanced`.
 * - For accessibility, ensure the slider has a visible label or context.
 * - Use step values that make sense for the range (e.g., avoid step=0.01 for a 0–10 range unless fine granularity is needed).
 * - When using icon buttons, provide icons that clearly indicate their function.
 * - The slider is horizontal only; for vertical sliders, use a different component.
 *
 * ---
 *
 * ### Example
 *
 * ```html
 * <obc-slider
 *   value="40"
 *   min="0"
 *   max="100"
 *   step="10"
 *   haslefticon
 *   hasrighticon
 *   variant="enhanced"
 * >
 *   <obi-arrow slot="icon-left"></obi-arrow>
 *   <obi-arrow slot="icon-right"></obi-arrow>
 * </obc-slider>
 * ```
 *
 * In this example, the slider allows selection from 0 to 100 in steps of 10, with left/right arrow icons for quick adjustments.
 *
 * @slot icon-left - Slot for the left icon button (shown when `hasLeftIcon` is true)
 * @slot icon-right - Slot for the right icon button (shown when `hasRightIcon` is true)
 * @attr hugcontainer - If set, the slider will not have any spacing between the slider icons and the container
 * @fires value {ObcSliderValueEvent} - Fired when the value is changed
 */
export declare class ObcSlider extends LitElement {
    /**
     * The current value of the slider.
     *
     * Updates as the user drags the thumb, clicks the track (if `allowSeeking`), or uses the increment/decrement buttons.
     */
    value: number;
    /**
     * The minimum allowed value for the slider.
     *
     * Default is 0.
     */
    min: number;
    /**
     * The maximum allowed value for the slider.
     *
     * Default is 100.
     */
    max: number;
    /**
     * The step granularity for slider value changes.
     *
     * If set, the slider will snap to multiples of this value between min and max.
     * Optional; if not set, the slider is continuous.
     */
    step: number | undefined;
    /**
     * The amount to increment or decrement the value when clicking the left/right icon buttons.
     *
     * Default is 10.
     */
    stepClick: number;
    /**
     * The visual and interaction style of the slider.
     *
     * - `normal`: Standard appearance.
     * - `enhanced`: Larger track and thumb for emphasis.
     * - `no-input`: Read-only; disables all user input.
     *
     * Default is `normal`.
     */
    variant: ObcSliderVariant;
    /**
     * Whether to display a left icon button for decrementing the value.
     *
     * When true, the `icon-left` slot is rendered as a button.
     */
    hasLeftIcon: boolean;
    /**
     * Whether to display a right icon button for incrementing the value.
     *
     * When true, the `icon-right` slot is rendered as a button.
     */
    hasRightIcon: boolean;
    /**
     * Enables animated seeking: clicking or dragging along the track will set the value to the clicked position, animating smoothly.
     *
     * Default is false.
     */
    allowSeeking: boolean;
    /**
     * The speed of animated seeking (when `allowSeeking` is true).
     *
     * Expressed as the inverse of seconds to go from min to max (e.g., 1/3 means 3 seconds for full range).
     * Default is 1/3.
     */
    seekingSpeed: number;
    disabled: boolean;
    private animationFrame;
    private isMouseDown;
    private isTouchActive;
    private targetValue;
    private isDragging;
    private animationStartTime;
    private animationStartValue;
    /**
     * Handles input changes from the slider or buttons.
     * Fires the `value` event with the new value.
     *
     * @param value - The new value to set.
     * @fires value
     */
    onInput(value: number): void;
    /**
     * Decrements the value by `stepClick` when the left icon button is clicked.
     */
    onReduceClick(): void;
    /**
     * Increments the value by `stepClick` when the right icon button is clicked.
     */
    onIncreaseClick(): void;
    private get slider();
    private isClickingThumb;
    private onMouseDown;
    private onTouchStart;
    private onWindowMouseMove;
    private onWindowMouseUp;
    private onWindowTouchMove;
    private onWindowTouchEnd;
    private onMouseMove;
    private onTouchMove;
    private onMouseUp;
    private onTouchEnd;
    private updateTargetValue;
    private startAnimation;
    private stopAnimation;
    render(): import('lit-html').TemplateResult<1>;
    static styles: import('lit').CSSResult;
}
declare global {
    interface HTMLElementTagNameMap {
        'obc-slider': ObcSlider;
    }
}
//# sourceMappingURL=slider.d.ts.map