UNPKG

4.47 kBTypeScriptView Raw
1import { Observable } from 'rxjs';
2import { BreakPoint } from '../breakpoints/break-point';
3import { BreakPointRegistry } from '../breakpoints/break-point-registry';
4import { MatchMedia } from '../match-media/match-media';
5import { MediaChange } from '../media-change';
6import { PrintHook } from './print-hook';
7import * as i0 from "@angular/core";
8declare type ClearCallback = () => void;
9declare type UpdateCallback = (val: any) => void;
10export interface ElementMatcher {
11 element: HTMLElement;
12 key: string;
13 value: any;
14}
15/**
16 * MediaMarshaller - register responsive values from directives and
17 * trigger them based on media query events
18 */
19export declare class MediaMarshaller {
20 protected matchMedia: MatchMedia;
21 protected breakpoints: BreakPointRegistry;
22 protected hook: PrintHook;
23 private _useFallbacks;
24 private _activatedBreakpoints;
25 private elementMap;
26 private elementKeyMap;
27 private watcherMap;
28 private updateMap;
29 private clearMap;
30 private subject;
31 get activatedAlias(): string;
32 set activatedBreakpoints(bps: BreakPoint[]);
33 get activatedBreakpoints(): BreakPoint[];
34 set useFallbacks(value: boolean);
35 constructor(matchMedia: MatchMedia, breakpoints: BreakPointRegistry, hook: PrintHook);
36 /**
37 * Update styles on breakpoint activates or deactivates
38 * @param mc
39 */
40 onMediaChange(mc: MediaChange): void;
41 /**
42 * initialize the marshaller with necessary elements for delegation on an element
43 * @param element
44 * @param key
45 * @param updateFn optional callback so that custom bp directives don't have to re-provide this
46 * @param clearFn optional callback so that custom bp directives don't have to re-provide this
47 * @param extraTriggers other triggers to force style updates (e.g. layout, directionality, etc)
48 */
49 init(element: HTMLElement, key: string, updateFn?: UpdateCallback, clearFn?: ClearCallback, extraTriggers?: Observable<any>[]): void;
50 /**
51 * get the value for an element and key and optionally a given breakpoint
52 * @param element
53 * @param key
54 * @param bp
55 */
56 getValue(element: HTMLElement, key: string, bp?: string): any;
57 /**
58 * whether the element has values for a given key
59 * @param element
60 * @param key
61 */
62 hasValue(element: HTMLElement, key: string): boolean;
63 /**
64 * Set the value for an input on a directive
65 * @param element the element in question
66 * @param key the type of the directive (e.g. flex, layout-gap, etc)
67 * @param bp the breakpoint suffix (empty string = default)
68 * @param val the value for the breakpoint
69 */
70 setValue(element: HTMLElement, key: string, val: any, bp: string): void;
71 /** Track element value changes for a specific key */
72 trackValue(element: HTMLElement, key: string): Observable<ElementMatcher>;
73 /** update all styles for all elements on the current breakpoint */
74 updateStyles(): void;
75 /**
76 * clear the styles for a given element
77 * @param element
78 * @param key
79 */
80 clearElement(element: HTMLElement, key: string): void;
81 /**
82 * update a given element with the activated values for a given key
83 * @param element
84 * @param key
85 * @param value
86 */
87 updateElement(element: HTMLElement, key: string, value: any): void;
88 /**
89 * release all references to a given element
90 * @param element
91 */
92 releaseElement(element: HTMLElement): void;
93 /**
94 * trigger an update for a given element and key (e.g. layout)
95 * @param element
96 * @param key
97 */
98 triggerUpdate(element: HTMLElement, key?: string): void;
99 /** Cross-reference for HTMLElement with directive key */
100 private buildElementKeyMap;
101 /**
102 * Other triggers that should force style updates:
103 * - directionality
104 * - layout changes
105 * - mutationobserver updates
106 */
107 private watchExtraTriggers;
108 /** Breakpoint locator by mediaQuery */
109 private findByQuery;
110 /**
111 * get the fallback breakpoint for a given element, starting with the current breakpoint
112 * @param bpMap
113 * @param key
114 */
115 private getActivatedValues;
116 /**
117 * Watch for mediaQuery breakpoint activations
118 */
119 private observeActivations;
120 static ɵfac: i0.ɵɵFactoryDeclaration<MediaMarshaller, never>;
121 static ɵprov: i0.ɵɵInjectableDeclaration<MediaMarshaller>;
122}
123export {};