UNPKG

4.67 kBTypeScriptView Raw
1import * as React from "react";
2import { AbstractPureComponent2, Intent } from "../../common";
3import { IntentProps, Props } from "../../common/props";
4export interface ISliderBaseProps extends Props, IntentProps {
5 children?: React.ReactNode;
6 /**
7 * Whether the slider is non-interactive.
8 *
9 * @default false
10 */
11 disabled?: boolean;
12 /**
13 * Increment between successive labels. Must be greater than zero.
14 *
15 * @default inferred (if labelStepSize is undefined)
16 */
17 labelStepSize?: number;
18 /**
19 * Array of specific values for the label placement. This prop is mutually exclusive with
20 * `labelStepSize`.
21 */
22 labelValues?: readonly number[];
23 /**
24 * Number of decimal places to use when rendering label value. Default value is the number of
25 * decimals used in the `stepSize` prop. This prop has _no effect_ if you supply a custom
26 * `labelRenderer` callback.
27 *
28 * @default inferred from stepSize
29 */
30 labelPrecision?: number;
31 /**
32 * Maximum value of the slider. Value must be a finite number.
33 *
34 * @default 10
35 */
36 max?: number;
37 /**
38 * Minimum value of the slider. Value must be a finite number.
39 *
40 * @default 0
41 */
42 min?: number;
43 /**
44 * Whether a solid bar should be rendered on the track between current and initial values,
45 * or between handles for `RangeSlider`.
46 *
47 * @default true
48 */
49 showTrackFill?: boolean;
50 /**
51 * Increment between successive values; amount by which the handle moves. Must be greater than zero.
52 *
53 * @default 1
54 */
55 stepSize?: number;
56 /**
57 * Callback to render a single label. Useful for formatting numbers as currency or percentages.
58 * If `true`, labels will use number value formatted to `labelPrecision` decimal places.
59 * If `false`, labels will not be shown.
60 *
61 * The callback is provided a numeric value and optional rendering options, which include:
62 * - isHandleTooltip: whether this label is being rendered within a handle tooltip
63 *
64 * @default true
65 */
66 labelRenderer?: boolean | ((value: number, opts?: {
67 isHandleTooltip: boolean;
68 }) => string | JSX.Element);
69 /**
70 * Whether to show the slider in a vertical orientation.
71 *
72 * @default false
73 */
74 vertical?: boolean;
75}
76export declare type MultiSliderProps = IMultiSliderProps;
77/** @deprecated use MultiSliderProps */
78export interface IMultiSliderProps extends ISliderBaseProps {
79 /** Default intent of a track segment, used only if no handle specifies `intentBefore/After`. */
80 defaultTrackIntent?: Intent;
81 /** Callback invoked when a handle value changes. Receives handle values in sorted order. */
82 onChange?(values: number[]): void;
83 /** Callback invoked when a handle is released. Receives handle values in sorted order. */
84 onRelease?(values: number[]): void;
85}
86export interface ISliderState {
87 labelPrecision: number;
88 /** the client size, in pixels, of one tick */
89 tickSize: number;
90 /** the size of one tick as a ratio of the component's client size */
91 tickSizeRatio: number;
92}
93/**
94 * Multi slider component.
95 *
96 * @see https://blueprintjs.com/docs/#core/components/sliders.multi-slider
97 */
98export declare class MultiSlider extends AbstractPureComponent2<MultiSliderProps, ISliderState> {
99 static defaultSliderProps: ISliderBaseProps;
100 static defaultProps: MultiSliderProps;
101 static displayName: string;
102 static Handle: React.FC<import("./handleProps").IHandleProps>;
103 static getDerivedStateFromProps(props: MultiSliderProps): {
104 labelPrecision: number;
105 };
106 private static getLabelPrecision;
107 state: ISliderState;
108 private handleElements;
109 private trackElement;
110 getSnapshotBeforeUpdate(prevProps: MultiSliderProps): null;
111 render(): JSX.Element;
112 componentDidMount(): void;
113 componentDidUpdate(prevProps: MultiSliderProps, prevState: ISliderState): void;
114 protected validateProps(props: React.PropsWithChildren<MultiSliderProps>): void;
115 private formatLabel;
116 private renderLabels;
117 private renderTracks;
118 private renderTrackFill;
119 private renderHandles;
120 private addHandleRef;
121 private maybeHandleTrackClick;
122 private maybeHandleTrackTouch;
123 private canHandleTrackEvent;
124 private nearestHandleForValue;
125 private getHandlerForIndex;
126 private getNewHandleValues;
127 private findFirstLockedHandleIndex;
128 private handleChange;
129 private handleRelease;
130 private getLabelValues;
131 private getOffsetRatio;
132 private getTrackIntent;
133 private updateTickSize;
134}