@spark-ui/components/dist/slider/index.d.mts

Spark (Leboncoin design system) components.

import * as react_jsx_runtime from 'react/jsx-runtime';
import { Slider as Slider$2 } from 'radix-ui';
import { PropsWithChildren, Ref } from 'react';
import * as class_variance_authority_types from 'class-variance-authority/types';
import { VariantProps } from 'class-variance-authority';

declare const rangeVariants: (props?: ({
    intent?: "main" | "alert" | "support" | "accent" | "basic" | "info" | "neutral" | "success" | "error" | null | undefined;
    shape?: "rounded" | "square" | null | undefined;
} & class_variance_authority_types.ClassProp) | undefined) => string;
type SliderRangeVariantsProps = VariantProps<typeof rangeVariants>;

interface SliderProps extends Omit<Slider$2.SliderProps, 'dir' | 'orientation' | 'inverted' | 'minStepsBetweenThumbs'>, PropsWithChildren<SliderRangeVariantsProps> {
    /**
     * Change the default rendered element for the one passed as a child, merging their props and behavior.
     * @default false
     */
    asChild?: boolean;
    /**
     * The value of the slider when initially rendered. Use when you do not need to control the state of the slider.
     */
    defaultValue?: number[];
    /**
     * The controlled value of the slider. Must be used in conjunction with `onValueChange`.
     */
    value?: number[];
    /**
     * Event handler called when the value changes.
     */
    onValueChange?: (value: number[]) => void;
    /**
     * Event handler called when the value changes at the end of an interaction. Useful when you only need to capture a final value e.g. to update a backend service.
     */
    onValueCommit?: (value: number[]) => void;
    /**
     * The name of the slider. Submitted with its owning form as part of a name/value pair.
     */
    name?: string;
    /**
     * When `true`, prevents the user from interacting with the slider.
     * @default false
     */
    disabled?: boolean;
    /**
     * The minimum value for the range.
     * @default 0
     */
    min?: number;
    /**
     * The maximum value for the range.
     * @default 100
     */
    max?: number;
    /**
     * The stepping interval.
     * @default 1
     */
    step?: number;
    ref?: Ref<HTMLDivElement>;
}
declare const Slider$1: {
    ({ asChild, intent, shape, children, className, ref, ...rest }: SliderProps): react_jsx_runtime.JSX.Element;
    displayName: string;
};

interface SliderThumbProps extends Slider$2.SliderThumbProps {
    /**
     * Change the default rendered element for the one passed as a child, merging their props and behavior.
     * @default false
     */
    asChild?: boolean;
    ref?: Ref<HTMLSpanElement>;
}
declare const SliderThumb: {
    ({ asChild, className, onPointerDown, onKeyDown, onBlur, ref: forwardedRef, ...rest }: SliderThumbProps): react_jsx_runtime.JSX.Element;
    displayName: string;
};

interface SliderTrackProps extends Slider$2.SliderTrackProps, Slider$2.SliderRangeProps {
    /**
     * Change the default rendered element for the one passed as a child, merging their props and behavior.
     * @default false
     */
    asChild?: boolean;
    ref?: Ref<HTMLDivElement>;
}
declare const SliderTrack: {
    ({ asChild, className, ref, ...rest }: SliderTrackProps): react_jsx_runtime.JSX.Element;
    displayName: string;
};

declare const Slider: typeof Slider$1 & {
    Thumb: typeof SliderThumb;
    Track: typeof SliderTrack;
};

export { Slider, type SliderProps, type SliderThumbProps, type SliderTrackProps };