[6a3a178] | 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 {};
|
---|