beta-parity-react/ui/Slider/index.d.ts

Beta Parity React Components

import React from 'react';
import './index.css';
import './variables.css';
/**
 * Represents a mark on the slider.
 */
interface Mark {
    /**
     * The value of the mark.
     */
    value: number;
    /**
     * The label for the mark (optional).
     */
    label?: string;
}
/**
 * Props for the Slider component.
 *
 * Extends properties from the `div` element.
 */
interface SliderProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'defaultValue'> {
    /**
     * The mode of the slider, either 'single' or 'range'.
     *
     * @default 'single'
     */
    mode?: 'single' | 'range';
    /**
     * The minimum value of the slider.
     *
     * @default 0
     */
    min?: number;
    /**
     * The maximum value of the slider.
     *
     * @default 100
     */
    max?: number;
    /**
     * The step value for the slider.
     *
     * @default 1
     */
    step?: number;
    /**
     * The default value of the slider.
     *
     * @default 0 (single mode) or [0, 50] (range mode)
     */
    defaultValue?: number | [number, number];
    /**
     * The marks to display on the slider.
     */
    marks?: Mark[];
    /**
     * The color of the slider.
     *
     * @default 'neutral'
     */
    color?: 'neutral' | 'accent';
    /**
     * The orientation of the slider.
     *
     * @default 'horizontal'
     */
    orientation?: 'horizontal' | 'vertical';
    /**
     * The type of indicator to display.
     *
     * @default 'normal'
     */
    indicator?: 'normal' | 'tooltip';
    /**
     * The side of the indicator.
     *
     * @default 'normal'
     */
    indicatorSide?: 'normal' | 'reverse';
    /**
     * The disabled state of the slider.
     *
     * @default false
     */
    disabled?: boolean;
    /**
     * Callback function triggered when the slider value changes.
     *
     * @param value The new value of the slider.
     */
    onValueChange?: (value: number | [number, number]) => void;
}
/**
 * **Parity Slider**.
 *
 * A customizable slider component supporting single and range modes.
 *
 * @see {@link https://beta-parity-react.vercel.app/slider Parity Slider}
 */
export declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLDivElement>>;
/**
 * Renders the marks on the slider.
 */
export declare const Marks: ({ marks, min, max, minValue, maxValue, isVertical }: Record<string, any>) => import("react/jsx-runtime").JSX.Element;
/**
 * Renders the slider track and progress bar.
 */
export declare const SliderTrack: ({ isVertical, isRange, minValue, min, max, maxValue, color }: Record<string, any>) => import("react/jsx-runtime").JSX.Element;
/**
 * Renders the input range elements and indicators.
 */
export declare const RangeInputs: ({ isVertical, minValue, maxValue, min, max, step, handleMinChange, handleMaxChange, isRange, indicatorSide, indicator, disabled }: Record<string, any>) => import("react/jsx-runtime").JSX.Element;
export {};
//# sourceMappingURL=index.d.ts.map