1 | import { AST } from '../../expression_parser/ast';
|
---|
2 | import * as o from '../../output/output_ast';
|
---|
3 | import { ParseSourceSpan } from '../../parse_util';
|
---|
4 | import * as t from '../r3_ast';
|
---|
5 | import { ValueConverter } from './template';
|
---|
6 | import { DefinitionMap } from './util';
|
---|
7 | /**
|
---|
8 | * Minimum amount of binding slots required in the runtime for style/class bindings.
|
---|
9 | *
|
---|
10 | * Styling in Angular uses up two slots in the runtime LView/TData data structures to
|
---|
11 | * record binding data, property information and metadata.
|
---|
12 | *
|
---|
13 | * When a binding is registered it will place the following information in the `LView`:
|
---|
14 | *
|
---|
15 | * slot 1) binding value
|
---|
16 | * slot 2) cached value (all other values collected before it in string form)
|
---|
17 | *
|
---|
18 | * When a binding is registered it will place the following information in the `TData`:
|
---|
19 | *
|
---|
20 | * slot 1) prop name
|
---|
21 | * slot 2) binding index that points to the previous style/class binding (and some extra config
|
---|
22 | * values)
|
---|
23 | *
|
---|
24 | * Let's imagine we have a binding that looks like so:
|
---|
25 | *
|
---|
26 | * ```
|
---|
27 | * <div [style.width]="x" [style.height]="y">
|
---|
28 | * ```
|
---|
29 | *
|
---|
30 | * Our `LView` and `TData` data-structures look like so:
|
---|
31 | *
|
---|
32 | * ```typescript
|
---|
33 | * LView = [
|
---|
34 | * // ...
|
---|
35 | * x, // value of x
|
---|
36 | * "width: x",
|
---|
37 | *
|
---|
38 | * y, // value of y
|
---|
39 | * "width: x; height: y",
|
---|
40 | * // ...
|
---|
41 | * ];
|
---|
42 | *
|
---|
43 | * TData = [
|
---|
44 | * // ...
|
---|
45 | * "width", // binding slot 20
|
---|
46 | * 0,
|
---|
47 | *
|
---|
48 | * "height",
|
---|
49 | * 20,
|
---|
50 | * // ...
|
---|
51 | * ];
|
---|
52 | * ```
|
---|
53 | *
|
---|
54 | * */
|
---|
55 | export declare const MIN_STYLING_BINDING_SLOTS_REQUIRED = 2;
|
---|
56 | /**
|
---|
57 | * A styling expression summary that is to be processed by the compiler
|
---|
58 | */
|
---|
59 | export interface StylingInstruction {
|
---|
60 | reference: o.ExternalReference;
|
---|
61 | /** Calls to individual styling instructions. Used when chaining calls to the same instruction. */
|
---|
62 | calls: StylingInstructionCall[];
|
---|
63 | }
|
---|
64 | export interface StylingInstructionCall {
|
---|
65 | sourceSpan: ParseSourceSpan | null;
|
---|
66 | supportsInterpolation: boolean;
|
---|
67 | allocateBindingSlots: number;
|
---|
68 | params: ((convertFn: (value: any) => o.Expression | o.Expression[]) => o.Expression[]);
|
---|
69 | }
|
---|
70 | /**
|
---|
71 | * An internal record of the input data for a styling binding
|
---|
72 | */
|
---|
73 | interface BoundStylingEntry {
|
---|
74 | hasOverrideFlag: boolean;
|
---|
75 | name: string | null;
|
---|
76 | suffix: string | null;
|
---|
77 | sourceSpan: ParseSourceSpan;
|
---|
78 | value: AST;
|
---|
79 | }
|
---|
80 | /**
|
---|
81 | * Produces creation/update instructions for all styling bindings (class and style)
|
---|
82 | *
|
---|
83 | * It also produces the creation instruction to register all initial styling values
|
---|
84 | * (which are all the static class="..." and style="..." attribute values that exist
|
---|
85 | * on an element within a template).
|
---|
86 | *
|
---|
87 | * The builder class below handles producing instructions for the following cases:
|
---|
88 | *
|
---|
89 | * - Static style/class attributes (style="..." and class="...")
|
---|
90 | * - Dynamic style/class map bindings ([style]="map" and [class]="map|string")
|
---|
91 | * - Dynamic style/class property bindings ([style.prop]="exp" and [class.name]="exp")
|
---|
92 | *
|
---|
93 | * Due to the complex relationship of all of these cases, the instructions generated
|
---|
94 | * for these attributes/properties/bindings must be done so in the correct order. The
|
---|
95 | * order which these must be generated is as follows:
|
---|
96 | *
|
---|
97 | * if (createMode) {
|
---|
98 | * styling(...)
|
---|
99 | * }
|
---|
100 | * if (updateMode) {
|
---|
101 | * styleMap(...)
|
---|
102 | * classMap(...)
|
---|
103 | * styleProp(...)
|
---|
104 | * classProp(...)
|
---|
105 | * }
|
---|
106 | *
|
---|
107 | * The creation/update methods within the builder class produce these instructions.
|
---|
108 | */
|
---|
109 | export declare class StylingBuilder {
|
---|
110 | private _directiveExpr;
|
---|
111 | /** Whether or not there are any static styling values present */
|
---|
112 | private _hasInitialValues;
|
---|
113 | /**
|
---|
114 | * Whether or not there are any styling bindings present
|
---|
115 | * (i.e. `[style]`, `[class]`, `[style.prop]` or `[class.name]`)
|
---|
116 | */
|
---|
117 | hasBindings: boolean;
|
---|
118 | hasBindingsWithPipes: boolean;
|
---|
119 | /** the input for [class] (if it exists) */
|
---|
120 | private _classMapInput;
|
---|
121 | /** the input for [style] (if it exists) */
|
---|
122 | private _styleMapInput;
|
---|
123 | /** an array of each [style.prop] input */
|
---|
124 | private _singleStyleInputs;
|
---|
125 | /** an array of each [class.name] input */
|
---|
126 | private _singleClassInputs;
|
---|
127 | private _lastStylingInput;
|
---|
128 | private _firstStylingInput;
|
---|
129 | /**
|
---|
130 | * Represents the location of each style binding in the template
|
---|
131 | * (e.g. `<div [style.width]="w" [style.height]="h">` implies
|
---|
132 | * that `width=0` and `height=1`)
|
---|
133 | */
|
---|
134 | private _stylesIndex;
|
---|
135 | /**
|
---|
136 | * Represents the location of each class binding in the template
|
---|
137 | * (e.g. `<div [class.big]="b" [class.hidden]="h">` implies
|
---|
138 | * that `big=0` and `hidden=1`)
|
---|
139 | */
|
---|
140 | private _classesIndex;
|
---|
141 | private _initialStyleValues;
|
---|
142 | private _initialClassValues;
|
---|
143 | constructor(_directiveExpr: o.Expression | null);
|
---|
144 | /**
|
---|
145 | * Registers a given input to the styling builder to be later used when producing AOT code.
|
---|
146 | *
|
---|
147 | * The code below will only accept the input if it is somehow tied to styling (whether it be
|
---|
148 | * style/class bindings or static style/class attributes).
|
---|
149 | */
|
---|
150 | registerBoundInput(input: t.BoundAttribute): boolean;
|
---|
151 | registerInputBasedOnName(name: string, expression: AST, sourceSpan: ParseSourceSpan): BoundStylingEntry | null;
|
---|
152 | registerStyleInput(name: string, isMapBased: boolean, value: AST, sourceSpan: ParseSourceSpan, suffix?: string | null): BoundStylingEntry | null;
|
---|
153 | registerClassInput(name: string, isMapBased: boolean, value: AST, sourceSpan: ParseSourceSpan): BoundStylingEntry | null;
|
---|
154 | private _checkForPipes;
|
---|
155 | /**
|
---|
156 | * Registers the element's static style string value to the builder.
|
---|
157 | *
|
---|
158 | * @param value the style string (e.g. `width:100px; height:200px;`)
|
---|
159 | */
|
---|
160 | registerStyleAttr(value: string): void;
|
---|
161 | /**
|
---|
162 | * Registers the element's static class string value to the builder.
|
---|
163 | *
|
---|
164 | * @param value the className string (e.g. `disabled gold zoom`)
|
---|
165 | */
|
---|
166 | registerClassAttr(value: string): void;
|
---|
167 | /**
|
---|
168 | * Appends all styling-related expressions to the provided attrs array.
|
---|
169 | *
|
---|
170 | * @param attrs an existing array where each of the styling expressions
|
---|
171 | * will be inserted into.
|
---|
172 | */
|
---|
173 | populateInitialStylingAttrs(attrs: o.Expression[]): void;
|
---|
174 | /**
|
---|
175 | * Builds an instruction with all the expressions and parameters for `elementHostAttrs`.
|
---|
176 | *
|
---|
177 | * The instruction generation code below is used for producing the AOT statement code which is
|
---|
178 | * responsible for registering initial styles (within a directive hostBindings' creation block),
|
---|
179 | * as well as any of the provided attribute values, to the directive host element.
|
---|
180 | */
|
---|
181 | assignHostAttrs(attrs: o.Expression[], definitionMap: DefinitionMap): void;
|
---|
182 | /**
|
---|
183 | * Builds an instruction with all the expressions and parameters for `classMap`.
|
---|
184 | *
|
---|
185 | * The instruction data will contain all expressions for `classMap` to function
|
---|
186 | * which includes the `[class]` expression params.
|
---|
187 | */
|
---|
188 | buildClassMapInstruction(valueConverter: ValueConverter): StylingInstruction | null;
|
---|
189 | /**
|
---|
190 | * Builds an instruction with all the expressions and parameters for `styleMap`.
|
---|
191 | *
|
---|
192 | * The instruction data will contain all expressions for `styleMap` to function
|
---|
193 | * which includes the `[style]` expression params.
|
---|
194 | */
|
---|
195 | buildStyleMapInstruction(valueConverter: ValueConverter): StylingInstruction | null;
|
---|
196 | private _buildMapBasedInstruction;
|
---|
197 | private _buildSingleInputs;
|
---|
198 | private _buildClassInputs;
|
---|
199 | private _buildStyleInputs;
|
---|
200 | /**
|
---|
201 | * Constructs all instructions which contain the expressions that will be placed
|
---|
202 | * into the update block of a template function or a directive hostBindings function.
|
---|
203 | */
|
---|
204 | buildUpdateLevelInstructions(valueConverter: ValueConverter): StylingInstruction[];
|
---|
205 | }
|
---|
206 | export declare function parseProperty(name: string): {
|
---|
207 | property: string;
|
---|
208 | suffix: string | null;
|
---|
209 | hasOverrideFlag: boolean;
|
---|
210 | };
|
---|
211 | export {};
|
---|