1 | /**
|
---|
2 | * @license
|
---|
3 | * Copyright Google LLC All Rights Reserved.
|
---|
4 | *
|
---|
5 | * Use of this source code is governed by an MIT-style license that can be
|
---|
6 | * found in the LICENSE file at https://angular.io/license
|
---|
7 | */
|
---|
8 | import { FocusMonitor } from '@angular/cdk/a11y';
|
---|
9 | import { Directionality } from '@angular/cdk/bidi';
|
---|
10 | import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
|
---|
11 | import { ChangeDetectorRef, ElementRef, EventEmitter, OnDestroy, NgZone, AfterViewInit } from '@angular/core';
|
---|
12 | import { ControlValueAccessor } from '@angular/forms';
|
---|
13 | import { CanColor, CanDisable, HasTabIndex } from '@angular/material/core';
|
---|
14 | /**
|
---|
15 | * Provider Expression that allows mat-slider to register as a ControlValueAccessor.
|
---|
16 | * This allows it to support [(ngModel)] and [formControl].
|
---|
17 | * @docs-private
|
---|
18 | */
|
---|
19 | export declare const MAT_SLIDER_VALUE_ACCESSOR: any;
|
---|
20 | /** A simple change event emitted by the MatSlider component. */
|
---|
21 | export declare class MatSliderChange {
|
---|
22 | /** The MatSlider that changed. */
|
---|
23 | source: MatSlider;
|
---|
24 | /** The new value of the source slider. */
|
---|
25 | value: number | null;
|
---|
26 | }
|
---|
27 | /** @docs-private */
|
---|
28 | declare const _MatSliderBase: import("@angular/material/core/common-behaviors/constructor").Constructor<HasTabIndex> & import("@angular/material/core/common-behaviors/constructor").AbstractConstructor<HasTabIndex> & import("@angular/material/core/common-behaviors/constructor").Constructor<CanColor> & import("@angular/material/core/common-behaviors/constructor").AbstractConstructor<CanColor> & import("@angular/material/core/common-behaviors/constructor").Constructor<CanDisable> & import("@angular/material/core/common-behaviors/constructor").AbstractConstructor<CanDisable> & {
|
---|
29 | new (_elementRef: ElementRef): {
|
---|
30 | _elementRef: ElementRef;
|
---|
31 | };
|
---|
32 | };
|
---|
33 | /**
|
---|
34 | * Allows users to select from a range of values by moving the slider thumb. It is similar in
|
---|
35 | * behavior to the native `<input type="range">` element.
|
---|
36 | */
|
---|
37 | export declare class MatSlider extends _MatSliderBase implements ControlValueAccessor, OnDestroy, CanDisable, CanColor, AfterViewInit, HasTabIndex {
|
---|
38 | private _focusMonitor;
|
---|
39 | private _changeDetectorRef;
|
---|
40 | private _dir;
|
---|
41 | private _ngZone;
|
---|
42 | _animationMode?: string | undefined;
|
---|
43 | /** Whether the slider is inverted. */
|
---|
44 | get invert(): boolean;
|
---|
45 | set invert(value: boolean);
|
---|
46 | private _invert;
|
---|
47 | /** The maximum value that the slider can have. */
|
---|
48 | get max(): number;
|
---|
49 | set max(v: number);
|
---|
50 | private _max;
|
---|
51 | /** The minimum value that the slider can have. */
|
---|
52 | get min(): number;
|
---|
53 | set min(v: number);
|
---|
54 | private _min;
|
---|
55 | /** The values at which the thumb will snap. */
|
---|
56 | get step(): number;
|
---|
57 | set step(v: number);
|
---|
58 | private _step;
|
---|
59 | /** Whether or not to show the thumb label. */
|
---|
60 | get thumbLabel(): boolean;
|
---|
61 | set thumbLabel(value: boolean);
|
---|
62 | private _thumbLabel;
|
---|
63 | /**
|
---|
64 | * How often to show ticks. Relative to the step so that a tick always appears on a step.
|
---|
65 | * Ex: Tick interval of 4 with a step of 3 will draw a tick every 4 steps (every 12 values).
|
---|
66 | */
|
---|
67 | get tickInterval(): 'auto' | number;
|
---|
68 | set tickInterval(value: 'auto' | number);
|
---|
69 | private _tickInterval;
|
---|
70 | /** Value of the slider. */
|
---|
71 | get value(): number;
|
---|
72 | set value(v: number);
|
---|
73 | private _value;
|
---|
74 | /**
|
---|
75 | * Function that will be used to format the value before it is displayed
|
---|
76 | * in the thumb label. Can be used to format very large number in order
|
---|
77 | * for them to fit into the slider thumb.
|
---|
78 | */
|
---|
79 | displayWith: (value: number) => string | number;
|
---|
80 | /** Text corresponding to the slider's value. Used primarily for improved accessibility. */
|
---|
81 | valueText: string;
|
---|
82 | /** Whether the slider is vertical. */
|
---|
83 | get vertical(): boolean;
|
---|
84 | set vertical(value: boolean);
|
---|
85 | private _vertical;
|
---|
86 | /** Event emitted when the slider value has changed. */
|
---|
87 | readonly change: EventEmitter<MatSliderChange>;
|
---|
88 | /** Event emitted when the slider thumb moves. */
|
---|
89 | readonly input: EventEmitter<MatSliderChange>;
|
---|
90 | /**
|
---|
91 | * Emits when the raw value of the slider changes. This is here primarily
|
---|
92 | * to facilitate the two-way binding for the `value` input.
|
---|
93 | * @docs-private
|
---|
94 | */
|
---|
95 | readonly valueChange: EventEmitter<number | null>;
|
---|
96 | /** The value to be used for display purposes. */
|
---|
97 | get displayValue(): string | number;
|
---|
98 | /** set focus to the host element */
|
---|
99 | focus(options?: FocusOptions): void;
|
---|
100 | /** blur the host element */
|
---|
101 | blur(): void;
|
---|
102 | /** onTouch function registered via registerOnTouch (ControlValueAccessor). */
|
---|
103 | onTouched: () => any;
|
---|
104 | /** The percentage of the slider that coincides with the value. */
|
---|
105 | get percent(): number;
|
---|
106 | private _percent;
|
---|
107 | /**
|
---|
108 | * Whether or not the thumb is sliding and what the user is using to slide it with.
|
---|
109 | * Used to determine if there should be a transition for the thumb and fill track.
|
---|
110 | */
|
---|
111 | _isSliding: 'keyboard' | 'pointer' | null;
|
---|
112 | /**
|
---|
113 | * Whether or not the slider is active (clicked or sliding).
|
---|
114 | * Used to shrink and grow the thumb as according to the Material Design spec.
|
---|
115 | */
|
---|
116 | _isActive: boolean;
|
---|
117 | /**
|
---|
118 | * Whether the axis of the slider is inverted.
|
---|
119 | * (i.e. whether moving the thumb in the positive x or y direction decreases the slider's value).
|
---|
120 | */
|
---|
121 | _shouldInvertAxis(): boolean;
|
---|
122 | /** Whether the slider is at its minimum value. */
|
---|
123 | _isMinValue(): boolean;
|
---|
124 | /**
|
---|
125 | * The amount of space to leave between the slider thumb and the track fill & track background
|
---|
126 | * elements.
|
---|
127 | */
|
---|
128 | _getThumbGap(): 7 | 10 | 0;
|
---|
129 | /** CSS styles for the track background element. */
|
---|
130 | _getTrackBackgroundStyles(): {
|
---|
131 | [key: string]: string;
|
---|
132 | };
|
---|
133 | /** CSS styles for the track fill element. */
|
---|
134 | _getTrackFillStyles(): {
|
---|
135 | [key: string]: string;
|
---|
136 | };
|
---|
137 | /** CSS styles for the ticks container element. */
|
---|
138 | _getTicksContainerStyles(): {
|
---|
139 | [key: string]: string;
|
---|
140 | };
|
---|
141 | /** CSS styles for the ticks element. */
|
---|
142 | _getTicksStyles(): {
|
---|
143 | [key: string]: string;
|
---|
144 | };
|
---|
145 | _getThumbContainerStyles(): {
|
---|
146 | [key: string]: string;
|
---|
147 | };
|
---|
148 | /** The size of a tick interval as a percentage of the size of the track. */
|
---|
149 | private _tickIntervalPercent;
|
---|
150 | /** The dimensions of the slider. */
|
---|
151 | private _sliderDimensions;
|
---|
152 | private _controlValueAccessorChangeFn;
|
---|
153 | /** Decimal places to round to, based on the step amount. */
|
---|
154 | private _roundToDecimal;
|
---|
155 | /** Subscription to the Directionality change EventEmitter. */
|
---|
156 | private _dirChangeSubscription;
|
---|
157 | /** The value of the slider when the slide start event fires. */
|
---|
158 | private _valueOnSlideStart;
|
---|
159 | /** Reference to the inner slider wrapper element. */
|
---|
160 | private _sliderWrapper;
|
---|
161 | /**
|
---|
162 | * Whether mouse events should be converted to a slider position by calculating their distance
|
---|
163 | * from the right or bottom edge of the slider as opposed to the top or left.
|
---|
164 | */
|
---|
165 | _shouldInvertMouseCoords(): boolean;
|
---|
166 | /** The language direction for this slider element. */
|
---|
167 | private _getDirection;
|
---|
168 | /** Keeps track of the last pointer event that was captured by the slider. */
|
---|
169 | private _lastPointerEvent;
|
---|
170 | /** Used to subscribe to global move and end events */
|
---|
171 | protected _document: Document;
|
---|
172 | /**
|
---|
173 | * Identifier used to attribute a touch event to a particular slider.
|
---|
174 | * Will be undefined if one of the following conditions is true:
|
---|
175 | * - The user isn't dragging using a touch device.
|
---|
176 | * - The browser doesn't support `Touch.identifier`.
|
---|
177 | * - Dragging hasn't started yet.
|
---|
178 | */
|
---|
179 | private _touchId;
|
---|
180 | constructor(elementRef: ElementRef, _focusMonitor: FocusMonitor, _changeDetectorRef: ChangeDetectorRef, _dir: Directionality, tabIndex: string, _ngZone: NgZone, _document: any, _animationMode?: string | undefined);
|
---|
181 | ngAfterViewInit(): void;
|
---|
182 | ngOnDestroy(): void;
|
---|
183 | _onMouseenter(): void;
|
---|
184 | _onFocus(): void;
|
---|
185 | _onBlur(): void;
|
---|
186 | _onKeydown(event: KeyboardEvent): void;
|
---|
187 | _onKeyup(): void;
|
---|
188 | /** Called when the user has put their pointer down on the slider. */
|
---|
189 | private _pointerDown;
|
---|
190 | /**
|
---|
191 | * Called when the user has moved their pointer after
|
---|
192 | * starting to drag. Bound on the document level.
|
---|
193 | */
|
---|
194 | private _pointerMove;
|
---|
195 | /** Called when the user has lifted their pointer. Bound on the document level. */
|
---|
196 | private _pointerUp;
|
---|
197 | /** Called when the window has lost focus. */
|
---|
198 | private _windowBlur;
|
---|
199 | /** Use defaultView of injected document if available or fallback to global window reference */
|
---|
200 | private _getWindow;
|
---|
201 | /**
|
---|
202 | * Binds our global move and end events. They're bound at the document level and only while
|
---|
203 | * dragging so that the user doesn't have to keep their pointer exactly over the slider
|
---|
204 | * as they're swiping across the screen.
|
---|
205 | */
|
---|
206 | private _bindGlobalEvents;
|
---|
207 | /** Removes any global event listeners that we may have added. */
|
---|
208 | private _removeGlobalEvents;
|
---|
209 | /** Increments the slider by the given number of steps (negative number decrements). */
|
---|
210 | private _increment;
|
---|
211 | /** Calculate the new value from the new physical location. The value will always be snapped. */
|
---|
212 | private _updateValueFromPosition;
|
---|
213 | /** Emits a change event if the current value is different from the last emitted value. */
|
---|
214 | private _emitChangeEvent;
|
---|
215 | /** Emits an input event when the current value is different from the last emitted value. */
|
---|
216 | private _emitInputEvent;
|
---|
217 | /** Updates the amount of space between ticks as a percentage of the width of the slider. */
|
---|
218 | private _updateTickIntervalPercent;
|
---|
219 | /** Creates a slider change object from the specified value. */
|
---|
220 | private _createChangeEvent;
|
---|
221 | /** Calculates the percentage of the slider that a value is. */
|
---|
222 | private _calculatePercentage;
|
---|
223 | /** Calculates the value a percentage of the slider corresponds to. */
|
---|
224 | private _calculateValue;
|
---|
225 | /** Return a number between two numbers. */
|
---|
226 | private _clamp;
|
---|
227 | /**
|
---|
228 | * Get the bounding client rect of the slider track element.
|
---|
229 | * The track is used rather than the native element to ignore the extra space that the thumb can
|
---|
230 | * take up.
|
---|
231 | */
|
---|
232 | private _getSliderDimensions;
|
---|
233 | /**
|
---|
234 | * Focuses the native element.
|
---|
235 | * Currently only used to allow a blur event to fire but will be used with keyboard input later.
|
---|
236 | */
|
---|
237 | private _focusHostElement;
|
---|
238 | /** Blurs the native element. */
|
---|
239 | private _blurHostElement;
|
---|
240 | /**
|
---|
241 | * Sets the model value. Implemented as part of ControlValueAccessor.
|
---|
242 | * @param value
|
---|
243 | */
|
---|
244 | writeValue(value: any): void;
|
---|
245 | /**
|
---|
246 | * Registers a callback to be triggered when the value has changed.
|
---|
247 | * Implemented as part of ControlValueAccessor.
|
---|
248 | * @param fn Callback to be registered.
|
---|
249 | */
|
---|
250 | registerOnChange(fn: (value: any) => void): void;
|
---|
251 | /**
|
---|
252 | * Registers a callback to be triggered when the component is touched.
|
---|
253 | * Implemented as part of ControlValueAccessor.
|
---|
254 | * @param fn Callback to be registered.
|
---|
255 | */
|
---|
256 | registerOnTouched(fn: any): void;
|
---|
257 | /**
|
---|
258 | * Sets whether the component should be disabled.
|
---|
259 | * Implemented as part of ControlValueAccessor.
|
---|
260 | * @param isDisabled
|
---|
261 | */
|
---|
262 | setDisabledState(isDisabled: boolean): void;
|
---|
263 | static ngAcceptInputType_invert: BooleanInput;
|
---|
264 | static ngAcceptInputType_max: NumberInput;
|
---|
265 | static ngAcceptInputType_min: NumberInput;
|
---|
266 | static ngAcceptInputType_step: NumberInput;
|
---|
267 | static ngAcceptInputType_thumbLabel: BooleanInput;
|
---|
268 | static ngAcceptInputType_tickInterval: NumberInput;
|
---|
269 | static ngAcceptInputType_value: NumberInput;
|
---|
270 | static ngAcceptInputType_vertical: BooleanInput;
|
---|
271 | static ngAcceptInputType_disabled: BooleanInput;
|
---|
272 | static ngAcceptInputType_tabIndex: NumberInput;
|
---|
273 | }
|
---|
274 | export {};
|
---|