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 { Platform } from '@angular/cdk/platform';
|
---|
9 | import { ElementRef, InjectionToken, NgZone, OnDestroy, OnInit } from '@angular/core';
|
---|
10 | import { RippleAnimationConfig, RippleConfig, RippleRef } from './ripple-ref';
|
---|
11 | import { RippleTarget } from './ripple-renderer';
|
---|
12 | /** Configurable options for `matRipple`. */
|
---|
13 | export interface RippleGlobalOptions {
|
---|
14 | /**
|
---|
15 | * Whether ripples should be disabled. Ripples can be still launched manually by using
|
---|
16 | * the `launch()` method. Therefore focus indicators will still show up.
|
---|
17 | */
|
---|
18 | disabled?: boolean;
|
---|
19 | /**
|
---|
20 | * Default configuration for the animation duration of the ripples. There are two phases with
|
---|
21 | * different durations for the ripples: `enter` and `leave`. The durations will be overwritten
|
---|
22 | * by the value of `matRippleAnimation` or if the `NoopAnimationsModule` is included.
|
---|
23 | */
|
---|
24 | animation?: RippleAnimationConfig;
|
---|
25 | /**
|
---|
26 | * Whether ripples should start fading out immediately after the mouse or touch is released. By
|
---|
27 | * default, ripples will wait for the enter animation to complete and for mouse or touch release.
|
---|
28 | */
|
---|
29 | terminateOnPointerUp?: boolean;
|
---|
30 | }
|
---|
31 | /** Injection token that can be used to specify the global ripple options. */
|
---|
32 | export declare const MAT_RIPPLE_GLOBAL_OPTIONS: InjectionToken<RippleGlobalOptions>;
|
---|
33 | export declare class MatRipple implements OnInit, OnDestroy, RippleTarget {
|
---|
34 | private _elementRef;
|
---|
35 | private _animationMode?;
|
---|
36 | /** Custom color for all ripples. */
|
---|
37 | color: string;
|
---|
38 | /** Whether the ripples should be visible outside the component's bounds. */
|
---|
39 | unbounded: boolean;
|
---|
40 | /**
|
---|
41 | * Whether the ripple always originates from the center of the host element's bounds, rather
|
---|
42 | * than originating from the location of the click event.
|
---|
43 | */
|
---|
44 | centered: boolean;
|
---|
45 | /**
|
---|
46 | * If set, the radius in pixels of foreground ripples when fully expanded. If unset, the radius
|
---|
47 | * will be the distance from the center of the ripple to the furthest corner of the host element's
|
---|
48 | * bounding rectangle.
|
---|
49 | */
|
---|
50 | radius: number;
|
---|
51 | /**
|
---|
52 | * Configuration for the ripple animation. Allows modifying the enter and exit animation
|
---|
53 | * duration of the ripples. The animation durations will be overwritten if the
|
---|
54 | * `NoopAnimationsModule` is being used.
|
---|
55 | */
|
---|
56 | animation: RippleAnimationConfig;
|
---|
57 | /**
|
---|
58 | * Whether click events will not trigger the ripple. Ripples can be still launched manually
|
---|
59 | * by using the `launch()` method.
|
---|
60 | */
|
---|
61 | get disabled(): boolean;
|
---|
62 | set disabled(value: boolean);
|
---|
63 | private _disabled;
|
---|
64 | /**
|
---|
65 | * The element that triggers the ripple when click events are received.
|
---|
66 | * Defaults to the directive's host element.
|
---|
67 | */
|
---|
68 | get trigger(): HTMLElement;
|
---|
69 | set trigger(trigger: HTMLElement);
|
---|
70 | private _trigger;
|
---|
71 | /** Renderer for the ripple DOM manipulations. */
|
---|
72 | private _rippleRenderer;
|
---|
73 | /** Options that are set globally for all ripples. */
|
---|
74 | private _globalOptions;
|
---|
75 | /** Whether ripple directive is initialized and the input bindings are set. */
|
---|
76 | private _isInitialized;
|
---|
77 | constructor(_elementRef: ElementRef<HTMLElement>, ngZone: NgZone, platform: Platform, globalOptions?: RippleGlobalOptions, _animationMode?: string | undefined);
|
---|
78 | ngOnInit(): void;
|
---|
79 | ngOnDestroy(): void;
|
---|
80 | /** Fades out all currently showing ripple elements. */
|
---|
81 | fadeOutAll(): void;
|
---|
82 | /** Fades out all currently showing non-persistent ripple elements. */
|
---|
83 | fadeOutAllNonPersistent(): void;
|
---|
84 | /**
|
---|
85 | * Ripple configuration from the directive's input values.
|
---|
86 | * @docs-private Implemented as part of RippleTarget
|
---|
87 | */
|
---|
88 | get rippleConfig(): RippleConfig;
|
---|
89 | /**
|
---|
90 | * Whether ripples on pointer-down are disabled or not.
|
---|
91 | * @docs-private Implemented as part of RippleTarget
|
---|
92 | */
|
---|
93 | get rippleDisabled(): boolean;
|
---|
94 | /** Sets up the trigger event listeners if ripples are enabled. */
|
---|
95 | private _setupTriggerEventsIfEnabled;
|
---|
96 | /**
|
---|
97 | * Launches a manual ripple using the specified ripple configuration.
|
---|
98 | * @param config Configuration for the manual ripple.
|
---|
99 | */
|
---|
100 | launch(config: RippleConfig): RippleRef;
|
---|
101 | /**
|
---|
102 | * Launches a manual ripple at the specified coordinates relative to the viewport.
|
---|
103 | * @param x Coordinate along the X axis at which to fade-in the ripple. Coordinate
|
---|
104 | * should be relative to the viewport.
|
---|
105 | * @param y Coordinate along the Y axis at which to fade-in the ripple. Coordinate
|
---|
106 | * should be relative to the viewport.
|
---|
107 | * @param config Optional ripple configuration for the manual ripple.
|
---|
108 | */
|
---|
109 | launch(x: number, y: number, config?: RippleConfig): RippleRef;
|
---|
110 | }
|
---|