source: trip-planner-front/node_modules/@angular/material/bundles/material-grid-list.umd.js@ 59329aa

Last change on this file since 59329aa was 6a3a178, checked in by Ema <ema_spirova@…>, 3 years ago

initial commit
  • Property mode set to 100644
File size: 50.8 KB
Line 
1(function (global, factory) {
2 typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/material/core'), require('@angular/cdk/coercion'), require('@angular/cdk/bidi')) :
3 typeof define === 'function' && define.amd ? define('@angular/material/grid-list', ['exports', '@angular/core', '@angular/material/core', '@angular/cdk/coercion', '@angular/cdk/bidi'], factory) :
4 (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.ng = global.ng || {}, global.ng.material = global.ng.material || {}, global.ng.material.gridList = {}), global.ng.core, global.ng.material.core, global.ng.cdk.coercion, global.ng.cdk.bidi));
5}(this, (function (exports, core, core$1, coercion, bidi) { 'use strict';
6
7 /*! *****************************************************************************
8 Copyright (c) Microsoft Corporation.
9
10 Permission to use, copy, modify, and/or distribute this software for any
11 purpose with or without fee is hereby granted.
12
13 THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
14 REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
15 AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
16 INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
17 LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
18 OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
19 PERFORMANCE OF THIS SOFTWARE.
20 ***************************************************************************** */
21 /* global Reflect, Promise */
22 var extendStatics = function (d, b) {
23 extendStatics = Object.setPrototypeOf ||
24 ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
25 function (d, b) { for (var p in b)
26 if (Object.prototype.hasOwnProperty.call(b, p))
27 d[p] = b[p]; };
28 return extendStatics(d, b);
29 };
30 function __extends(d, b) {
31 if (typeof b !== "function" && b !== null)
32 throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
33 extendStatics(d, b);
34 function __() { this.constructor = d; }
35 d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
36 }
37 var __assign = function () {
38 __assign = Object.assign || function __assign(t) {
39 for (var s, i = 1, n = arguments.length; i < n; i++) {
40 s = arguments[i];
41 for (var p in s)
42 if (Object.prototype.hasOwnProperty.call(s, p))
43 t[p] = s[p];
44 }
45 return t;
46 };
47 return __assign.apply(this, arguments);
48 };
49 function __rest(s, e) {
50 var t = {};
51 for (var p in s)
52 if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
53 t[p] = s[p];
54 if (s != null && typeof Object.getOwnPropertySymbols === "function")
55 for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
56 if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
57 t[p[i]] = s[p[i]];
58 }
59 return t;
60 }
61 function __decorate(decorators, target, key, desc) {
62 var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
63 if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
64 r = Reflect.decorate(decorators, target, key, desc);
65 else
66 for (var i = decorators.length - 1; i >= 0; i--)
67 if (d = decorators[i])
68 r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
69 return c > 3 && r && Object.defineProperty(target, key, r), r;
70 }
71 function __param(paramIndex, decorator) {
72 return function (target, key) { decorator(target, key, paramIndex); };
73 }
74 function __metadata(metadataKey, metadataValue) {
75 if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
76 return Reflect.metadata(metadataKey, metadataValue);
77 }
78 function __awaiter(thisArg, _arguments, P, generator) {
79 function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
80 return new (P || (P = Promise))(function (resolve, reject) {
81 function fulfilled(value) { try {
82 step(generator.next(value));
83 }
84 catch (e) {
85 reject(e);
86 } }
87 function rejected(value) { try {
88 step(generator["throw"](value));
89 }
90 catch (e) {
91 reject(e);
92 } }
93 function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
94 step((generator = generator.apply(thisArg, _arguments || [])).next());
95 });
96 }
97 function __generator(thisArg, body) {
98 var _ = { label: 0, sent: function () { if (t[0] & 1)
99 throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
100 return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function () { return this; }), g;
101 function verb(n) { return function (v) { return step([n, v]); }; }
102 function step(op) {
103 if (f)
104 throw new TypeError("Generator is already executing.");
105 while (_)
106 try {
107 if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done)
108 return t;
109 if (y = 0, t)
110 op = [op[0] & 2, t.value];
111 switch (op[0]) {
112 case 0:
113 case 1:
114 t = op;
115 break;
116 case 4:
117 _.label++;
118 return { value: op[1], done: false };
119 case 5:
120 _.label++;
121 y = op[1];
122 op = [0];
123 continue;
124 case 7:
125 op = _.ops.pop();
126 _.trys.pop();
127 continue;
128 default:
129 if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
130 _ = 0;
131 continue;
132 }
133 if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) {
134 _.label = op[1];
135 break;
136 }
137 if (op[0] === 6 && _.label < t[1]) {
138 _.label = t[1];
139 t = op;
140 break;
141 }
142 if (t && _.label < t[2]) {
143 _.label = t[2];
144 _.ops.push(op);
145 break;
146 }
147 if (t[2])
148 _.ops.pop();
149 _.trys.pop();
150 continue;
151 }
152 op = body.call(thisArg, _);
153 }
154 catch (e) {
155 op = [6, e];
156 y = 0;
157 }
158 finally {
159 f = t = 0;
160 }
161 if (op[0] & 5)
162 throw op[1];
163 return { value: op[0] ? op[1] : void 0, done: true };
164 }
165 }
166 var __createBinding = Object.create ? (function (o, m, k, k2) {
167 if (k2 === undefined)
168 k2 = k;
169 Object.defineProperty(o, k2, { enumerable: true, get: function () { return m[k]; } });
170 }) : (function (o, m, k, k2) {
171 if (k2 === undefined)
172 k2 = k;
173 o[k2] = m[k];
174 });
175 function __exportStar(m, o) {
176 for (var p in m)
177 if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p))
178 __createBinding(o, m, p);
179 }
180 function __values(o) {
181 var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
182 if (m)
183 return m.call(o);
184 if (o && typeof o.length === "number")
185 return {
186 next: function () {
187 if (o && i >= o.length)
188 o = void 0;
189 return { value: o && o[i++], done: !o };
190 }
191 };
192 throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
193 }
194 function __read(o, n) {
195 var m = typeof Symbol === "function" && o[Symbol.iterator];
196 if (!m)
197 return o;
198 var i = m.call(o), r, ar = [], e;
199 try {
200 while ((n === void 0 || n-- > 0) && !(r = i.next()).done)
201 ar.push(r.value);
202 }
203 catch (error) {
204 e = { error: error };
205 }
206 finally {
207 try {
208 if (r && !r.done && (m = i["return"]))
209 m.call(i);
210 }
211 finally {
212 if (e)
213 throw e.error;
214 }
215 }
216 return ar;
217 }
218 /** @deprecated */
219 function __spread() {
220 for (var ar = [], i = 0; i < arguments.length; i++)
221 ar = ar.concat(__read(arguments[i]));
222 return ar;
223 }
224 /** @deprecated */
225 function __spreadArrays() {
226 for (var s = 0, i = 0, il = arguments.length; i < il; i++)
227 s += arguments[i].length;
228 for (var r = Array(s), k = 0, i = 0; i < il; i++)
229 for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
230 r[k] = a[j];
231 return r;
232 }
233 function __spreadArray(to, from, pack) {
234 if (pack || arguments.length === 2)
235 for (var i = 0, l = from.length, ar; i < l; i++) {
236 if (ar || !(i in from)) {
237 if (!ar)
238 ar = Array.prototype.slice.call(from, 0, i);
239 ar[i] = from[i];
240 }
241 }
242 return to.concat(ar || from);
243 }
244 function __await(v) {
245 return this instanceof __await ? (this.v = v, this) : new __await(v);
246 }
247 function __asyncGenerator(thisArg, _arguments, generator) {
248 if (!Symbol.asyncIterator)
249 throw new TypeError("Symbol.asyncIterator is not defined.");
250 var g = generator.apply(thisArg, _arguments || []), i, q = [];
251 return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
252 function verb(n) { if (g[n])
253 i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
254 function resume(n, v) { try {
255 step(g[n](v));
256 }
257 catch (e) {
258 settle(q[0][3], e);
259 } }
260 function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
261 function fulfill(value) { resume("next", value); }
262 function reject(value) { resume("throw", value); }
263 function settle(f, v) { if (f(v), q.shift(), q.length)
264 resume(q[0][0], q[0][1]); }
265 }
266 function __asyncDelegator(o) {
267 var i, p;
268 return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
269 function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === "return" } : f ? f(v) : v; } : f; }
270 }
271 function __asyncValues(o) {
272 if (!Symbol.asyncIterator)
273 throw new TypeError("Symbol.asyncIterator is not defined.");
274 var m = o[Symbol.asyncIterator], i;
275 return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
276 function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
277 function settle(resolve, reject, d, v) { Promise.resolve(v).then(function (v) { resolve({ value: v, done: d }); }, reject); }
278 }
279 function __makeTemplateObject(cooked, raw) {
280 if (Object.defineProperty) {
281 Object.defineProperty(cooked, "raw", { value: raw });
282 }
283 else {
284 cooked.raw = raw;
285 }
286 return cooked;
287 }
288 ;
289 var __setModuleDefault = Object.create ? (function (o, v) {
290 Object.defineProperty(o, "default", { enumerable: true, value: v });
291 }) : function (o, v) {
292 o["default"] = v;
293 };
294 function __importStar(mod) {
295 if (mod && mod.__esModule)
296 return mod;
297 var result = {};
298 if (mod != null)
299 for (var k in mod)
300 if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k))
301 __createBinding(result, mod, k);
302 __setModuleDefault(result, mod);
303 return result;
304 }
305 function __importDefault(mod) {
306 return (mod && mod.__esModule) ? mod : { default: mod };
307 }
308 function __classPrivateFieldGet(receiver, state, kind, f) {
309 if (kind === "a" && !f)
310 throw new TypeError("Private accessor was defined without a getter");
311 if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
312 throw new TypeError("Cannot read private member from an object whose class did not declare it");
313 return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
314 }
315 function __classPrivateFieldSet(receiver, state, value, kind, f) {
316 if (kind === "m")
317 throw new TypeError("Private method is not writable");
318 if (kind === "a" && !f)
319 throw new TypeError("Private accessor was defined without a setter");
320 if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
321 throw new TypeError("Cannot write private member to an object whose class did not declare it");
322 return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
323 }
324
325 /**
326 * @license
327 * Copyright Google LLC All Rights Reserved.
328 *
329 * Use of this source code is governed by an MIT-style license that can be
330 * found in the LICENSE file at https://angular.io/license
331 */
332 /**
333 * Class for determining, from a list of tiles, the (row, col) position of each of those tiles
334 * in the grid. This is necessary (rather than just rendering the tiles in normal document flow)
335 * because the tiles can have a rowspan.
336 *
337 * The positioning algorithm greedily places each tile as soon as it encounters a gap in the grid
338 * large enough to accommodate it so that the tiles still render in the same order in which they
339 * are given.
340 *
341 * The basis of the algorithm is the use of an array to track the already placed tiles. Each
342 * element of the array corresponds to a column, and the value indicates how many cells in that
343 * column are already occupied; zero indicates an empty cell. Moving "down" to the next row
344 * decrements each value in the tracking array (indicating that the column is one cell closer to
345 * being free).
346 *
347 * @docs-private
348 */
349 var TileCoordinator = /** @class */ (function () {
350 function TileCoordinator() {
351 /** Index at which the search for the next gap will start. */
352 this.columnIndex = 0;
353 /** The current row index. */
354 this.rowIndex = 0;
355 }
356 Object.defineProperty(TileCoordinator.prototype, "rowCount", {
357 /** Gets the total number of rows occupied by tiles */
358 get: function () { return this.rowIndex + 1; },
359 enumerable: false,
360 configurable: true
361 });
362 Object.defineProperty(TileCoordinator.prototype, "rowspan", {
363 /**
364 * Gets the total span of rows occupied by tiles.
365 * Ex: A list with 1 row that contains a tile with rowspan 2 will have a total rowspan of 2.
366 */
367 get: function () {
368 var lastRowMax = Math.max.apply(Math, __spreadArray([], __read(this.tracker)));
369 // if any of the tiles has a rowspan that pushes it beyond the total row count,
370 // add the difference to the rowcount
371 return lastRowMax > 1 ? this.rowCount + lastRowMax - 1 : this.rowCount;
372 },
373 enumerable: false,
374 configurable: true
375 });
376 /**
377 * Updates the tile positions.
378 * @param numColumns Amount of columns in the grid.
379 * @param tiles Tiles to be positioned.
380 */
381 TileCoordinator.prototype.update = function (numColumns, tiles) {
382 var _this = this;
383 this.columnIndex = 0;
384 this.rowIndex = 0;
385 this.tracker = new Array(numColumns);
386 this.tracker.fill(0, 0, this.tracker.length);
387 this.positions = tiles.map(function (tile) { return _this._trackTile(tile); });
388 };
389 /** Calculates the row and col position of a tile. */
390 TileCoordinator.prototype._trackTile = function (tile) {
391 // Find a gap large enough for this tile.
392 var gapStartIndex = this._findMatchingGap(tile.colspan);
393 // Place tile in the resulting gap.
394 this._markTilePosition(gapStartIndex, tile);
395 // The next time we look for a gap, the search will start at columnIndex, which should be
396 // immediately after the tile that has just been placed.
397 this.columnIndex = gapStartIndex + tile.colspan;
398 return new TilePosition(this.rowIndex, gapStartIndex);
399 };
400 /** Finds the next available space large enough to fit the tile. */
401 TileCoordinator.prototype._findMatchingGap = function (tileCols) {
402 if (tileCols > this.tracker.length && (typeof ngDevMode === 'undefined' || ngDevMode)) {
403 throw Error("mat-grid-list: tile with colspan " + tileCols + " is wider than " +
404 ("grid with cols=\"" + this.tracker.length + "\"."));
405 }
406 // Start index is inclusive, end index is exclusive.
407 var gapStartIndex = -1;
408 var gapEndIndex = -1;
409 // Look for a gap large enough to fit the given tile. Empty spaces are marked with a zero.
410 do {
411 // If we've reached the end of the row, go to the next row.
412 if (this.columnIndex + tileCols > this.tracker.length) {
413 this._nextRow();
414 gapStartIndex = this.tracker.indexOf(0, this.columnIndex);
415 gapEndIndex = this._findGapEndIndex(gapStartIndex);
416 continue;
417 }
418 gapStartIndex = this.tracker.indexOf(0, this.columnIndex);
419 // If there are no more empty spaces in this row at all, move on to the next row.
420 if (gapStartIndex == -1) {
421 this._nextRow();
422 gapStartIndex = this.tracker.indexOf(0, this.columnIndex);
423 gapEndIndex = this._findGapEndIndex(gapStartIndex);
424 continue;
425 }
426 gapEndIndex = this._findGapEndIndex(gapStartIndex);
427 // If a gap large enough isn't found, we want to start looking immediately after the current
428 // gap on the next iteration.
429 this.columnIndex = gapStartIndex + 1;
430 // Continue iterating until we find a gap wide enough for this tile. Since gapEndIndex is
431 // exclusive, gapEndIndex is 0 means we didn't find a gap and should continue.
432 } while ((gapEndIndex - gapStartIndex < tileCols) || (gapEndIndex == 0));
433 // If we still didn't manage to find a gap, ensure that the index is
434 // at least zero so the tile doesn't get pulled out of the grid.
435 return Math.max(gapStartIndex, 0);
436 };
437 /** Move "down" to the next row. */
438 TileCoordinator.prototype._nextRow = function () {
439 this.columnIndex = 0;
440 this.rowIndex++;
441 // Decrement all spaces by one to reflect moving down one row.
442 for (var i = 0; i < this.tracker.length; i++) {
443 this.tracker[i] = Math.max(0, this.tracker[i] - 1);
444 }
445 };
446 /**
447 * Finds the end index (exclusive) of a gap given the index from which to start looking.
448 * The gap ends when a non-zero value is found.
449 */
450 TileCoordinator.prototype._findGapEndIndex = function (gapStartIndex) {
451 for (var i = gapStartIndex + 1; i < this.tracker.length; i++) {
452 if (this.tracker[i] != 0) {
453 return i;
454 }
455 }
456 // The gap ends with the end of the row.
457 return this.tracker.length;
458 };
459 /** Update the tile tracker to account for the given tile in the given space. */
460 TileCoordinator.prototype._markTilePosition = function (start, tile) {
461 for (var i = 0; i < tile.colspan; i++) {
462 this.tracker[start + i] = tile.rowspan;
463 }
464 };
465 return TileCoordinator;
466 }());
467 /**
468 * Simple data structure for tile position (row, col).
469 * @docs-private
470 */
471 var TilePosition = /** @class */ (function () {
472 function TilePosition(row, col) {
473 this.row = row;
474 this.col = col;
475 }
476 return TilePosition;
477 }());
478
479 /**
480 * @license
481 * Copyright Google LLC All Rights Reserved.
482 *
483 * Use of this source code is governed by an MIT-style license that can be
484 * found in the LICENSE file at https://angular.io/license
485 */
486 /**
487 * Injection token used to provide a grid list to a tile and to avoid circular imports.
488 * @docs-private
489 */
490 var MAT_GRID_LIST = new core.InjectionToken('MAT_GRID_LIST');
491
492 /**
493 * @license
494 * Copyright Google LLC All Rights Reserved.
495 *
496 * Use of this source code is governed by an MIT-style license that can be
497 * found in the LICENSE file at https://angular.io/license
498 */
499 var MatGridTile = /** @class */ (function () {
500 function MatGridTile(_element, _gridList) {
501 this._element = _element;
502 this._gridList = _gridList;
503 this._rowspan = 1;
504 this._colspan = 1;
505 }
506 Object.defineProperty(MatGridTile.prototype, "rowspan", {
507 /** Amount of rows that the grid tile takes up. */
508 get: function () { return this._rowspan; },
509 set: function (value) { this._rowspan = Math.round(coercion.coerceNumberProperty(value)); },
510 enumerable: false,
511 configurable: true
512 });
513 Object.defineProperty(MatGridTile.prototype, "colspan", {
514 /** Amount of columns that the grid tile takes up. */
515 get: function () { return this._colspan; },
516 set: function (value) { this._colspan = Math.round(coercion.coerceNumberProperty(value)); },
517 enumerable: false,
518 configurable: true
519 });
520 /**
521 * Sets the style of the grid-tile element. Needs to be set manually to avoid
522 * "Changed after checked" errors that would occur with HostBinding.
523 */
524 MatGridTile.prototype._setStyle = function (property, value) {
525 this._element.nativeElement.style[property] = value;
526 };
527 return MatGridTile;
528 }());
529 MatGridTile.decorators = [
530 { type: core.Component, args: [{
531 selector: 'mat-grid-tile',
532 exportAs: 'matGridTile',
533 host: {
534 'class': 'mat-grid-tile',
535 // Ensures that the "rowspan" and "colspan" input value is reflected in
536 // the DOM. This is needed for the grid-tile harness.
537 '[attr.rowspan]': 'rowspan',
538 '[attr.colspan]': 'colspan'
539 },
540 template: "<div class=\"mat-grid-tile-content\">\n <ng-content></ng-content>\n</div>\n",
541 encapsulation: core.ViewEncapsulation.None,
542 changeDetection: core.ChangeDetectionStrategy.OnPush,
543 styles: [".mat-grid-list{display:block;position:relative}.mat-grid-tile{display:block;position:absolute;overflow:hidden}.mat-grid-tile .mat-grid-tile-header,.mat-grid-tile .mat-grid-tile-footer{display:flex;align-items:center;height:48px;color:#fff;background:rgba(0,0,0,.38);overflow:hidden;padding:0 16px;position:absolute;left:0;right:0}.mat-grid-tile .mat-grid-tile-header>*,.mat-grid-tile .mat-grid-tile-footer>*{margin:0;padding:0;font-weight:normal;font-size:inherit}.mat-grid-tile .mat-grid-tile-header.mat-2-line,.mat-grid-tile .mat-grid-tile-footer.mat-2-line{height:68px}.mat-grid-tile .mat-grid-list-text{display:flex;flex-direction:column;flex:auto;box-sizing:border-box;overflow:hidden}.mat-grid-tile .mat-grid-list-text>*{margin:0;padding:0;font-weight:normal;font-size:inherit}.mat-grid-tile .mat-grid-list-text:empty{display:none}.mat-grid-tile .mat-grid-tile-header{top:0}.mat-grid-tile .mat-grid-tile-footer{bottom:0}.mat-grid-tile .mat-grid-avatar{padding-right:16px}[dir=rtl] .mat-grid-tile .mat-grid-avatar{padding-right:0;padding-left:16px}.mat-grid-tile .mat-grid-avatar:empty{display:none}.mat-grid-tile-content{top:0;left:0;right:0;bottom:0;position:absolute;display:flex;align-items:center;justify-content:center;height:100%;padding:0;margin:0}\n"]
544 },] }
545 ];
546 MatGridTile.ctorParameters = function () { return [
547 { type: core.ElementRef },
548 { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [MAT_GRID_LIST,] }] }
549 ]; };
550 MatGridTile.propDecorators = {
551 rowspan: [{ type: core.Input }],
552 colspan: [{ type: core.Input }]
553 };
554 var MatGridTileText = /** @class */ (function () {
555 function MatGridTileText(_element) {
556 this._element = _element;
557 }
558 MatGridTileText.prototype.ngAfterContentInit = function () {
559 core$1.setLines(this._lines, this._element);
560 };
561 return MatGridTileText;
562 }());
563 MatGridTileText.decorators = [
564 { type: core.Component, args: [{
565 selector: 'mat-grid-tile-header, mat-grid-tile-footer',
566 template: "<ng-content select=\"[mat-grid-avatar], [matGridAvatar]\"></ng-content>\n<div class=\"mat-grid-list-text\"><ng-content select=\"[mat-line], [matLine]\"></ng-content></div>\n<ng-content></ng-content>\n",
567 changeDetection: core.ChangeDetectionStrategy.OnPush,
568 encapsulation: core.ViewEncapsulation.None
569 },] }
570 ];
571 MatGridTileText.ctorParameters = function () { return [
572 { type: core.ElementRef }
573 ]; };
574 MatGridTileText.propDecorators = {
575 _lines: [{ type: core.ContentChildren, args: [core$1.MatLine, { descendants: true },] }]
576 };
577 /**
578 * Directive whose purpose is to add the mat- CSS styling to this selector.
579 * @docs-private
580 */
581 var MatGridAvatarCssMatStyler = /** @class */ (function () {
582 function MatGridAvatarCssMatStyler() {
583 }
584 return MatGridAvatarCssMatStyler;
585 }());
586 MatGridAvatarCssMatStyler.decorators = [
587 { type: core.Directive, args: [{
588 selector: '[mat-grid-avatar], [matGridAvatar]',
589 host: { 'class': 'mat-grid-avatar' }
590 },] }
591 ];
592 /**
593 * Directive whose purpose is to add the mat- CSS styling to this selector.
594 * @docs-private
595 */
596 var MatGridTileHeaderCssMatStyler = /** @class */ (function () {
597 function MatGridTileHeaderCssMatStyler() {
598 }
599 return MatGridTileHeaderCssMatStyler;
600 }());
601 MatGridTileHeaderCssMatStyler.decorators = [
602 { type: core.Directive, args: [{
603 selector: 'mat-grid-tile-header',
604 host: { 'class': 'mat-grid-tile-header' }
605 },] }
606 ];
607 /**
608 * Directive whose purpose is to add the mat- CSS styling to this selector.
609 * @docs-private
610 */
611 var MatGridTileFooterCssMatStyler = /** @class */ (function () {
612 function MatGridTileFooterCssMatStyler() {
613 }
614 return MatGridTileFooterCssMatStyler;
615 }());
616 MatGridTileFooterCssMatStyler.decorators = [
617 { type: core.Directive, args: [{
618 selector: 'mat-grid-tile-footer',
619 host: { 'class': 'mat-grid-tile-footer' }
620 },] }
621 ];
622
623 /**
624 * @license
625 * Copyright Google LLC All Rights Reserved.
626 *
627 * Use of this source code is governed by an MIT-style license that can be
628 * found in the LICENSE file at https://angular.io/license
629 */
630 /**
631 * RegExp that can be used to check whether a value will
632 * be allowed inside a CSS `calc()` expression.
633 */
634 var cssCalcAllowedValue = /^-?\d+((\.\d+)?[A-Za-z%$]?)+$/;
635 /**
636 * Sets the style properties for an individual tile, given the position calculated by the
637 * Tile Coordinator.
638 * @docs-private
639 */
640 var TileStyler = /** @class */ (function () {
641 function TileStyler() {
642 this._rows = 0;
643 this._rowspan = 0;
644 }
645 /**
646 * Adds grid-list layout info once it is available. Cannot be processed in the constructor
647 * because these properties haven't been calculated by that point.
648 *
649 * @param gutterSize Size of the grid's gutter.
650 * @param tracker Instance of the TileCoordinator.
651 * @param cols Amount of columns in the grid.
652 * @param direction Layout direction of the grid.
653 */
654 TileStyler.prototype.init = function (gutterSize, tracker, cols, direction) {
655 this._gutterSize = normalizeUnits(gutterSize);
656 this._rows = tracker.rowCount;
657 this._rowspan = tracker.rowspan;
658 this._cols = cols;
659 this._direction = direction;
660 };
661 /**
662 * Computes the amount of space a single 1x1 tile would take up (width or height).
663 * Used as a basis for other calculations.
664 * @param sizePercent Percent of the total grid-list space that one 1x1 tile would take up.
665 * @param gutterFraction Fraction of the gutter size taken up by one 1x1 tile.
666 * @return The size of a 1x1 tile as an expression that can be evaluated via CSS calc().
667 */
668 TileStyler.prototype.getBaseTileSize = function (sizePercent, gutterFraction) {
669 // Take the base size percent (as would be if evenly dividing the size between cells),
670 // and then subtracting the size of one gutter. However, since there are no gutters on the
671 // edges, each tile only uses a fraction (gutterShare = numGutters / numCells) of the gutter
672 // size. (Imagine having one gutter per tile, and then breaking up the extra gutter on the
673 // edge evenly among the cells).
674 return "(" + sizePercent + "% - (" + this._gutterSize + " * " + gutterFraction + "))";
675 };
676 /**
677 * Gets The horizontal or vertical position of a tile, e.g., the 'top' or 'left' property value.
678 * @param offset Number of tiles that have already been rendered in the row/column.
679 * @param baseSize Base size of a 1x1 tile (as computed in getBaseTileSize).
680 * @return Position of the tile as a CSS calc() expression.
681 */
682 TileStyler.prototype.getTilePosition = function (baseSize, offset) {
683 // The position comes the size of a 1x1 tile plus gutter for each previous tile in the
684 // row/column (offset).
685 return offset === 0 ? '0' : calc("(" + baseSize + " + " + this._gutterSize + ") * " + offset);
686 };
687 /**
688 * Gets the actual size of a tile, e.g., width or height, taking rowspan or colspan into account.
689 * @param baseSize Base size of a 1x1 tile (as computed in getBaseTileSize).
690 * @param span The tile's rowspan or colspan.
691 * @return Size of the tile as a CSS calc() expression.
692 */
693 TileStyler.prototype.getTileSize = function (baseSize, span) {
694 return "(" + baseSize + " * " + span + ") + (" + (span - 1) + " * " + this._gutterSize + ")";
695 };
696 /**
697 * Sets the style properties to be applied to a tile for the given row and column index.
698 * @param tile Tile to which to apply the styling.
699 * @param rowIndex Index of the tile's row.
700 * @param colIndex Index of the tile's column.
701 */
702 TileStyler.prototype.setStyle = function (tile, rowIndex, colIndex) {
703 // Percent of the available horizontal space that one column takes up.
704 var percentWidthPerTile = 100 / this._cols;
705 // Fraction of the vertical gutter size that each column takes up.
706 // For example, if there are 5 columns, each column uses 4/5 = 0.8 times the gutter width.
707 var gutterWidthFractionPerTile = (this._cols - 1) / this._cols;
708 this.setColStyles(tile, colIndex, percentWidthPerTile, gutterWidthFractionPerTile);
709 this.setRowStyles(tile, rowIndex, percentWidthPerTile, gutterWidthFractionPerTile);
710 };
711 /** Sets the horizontal placement of the tile in the list. */
712 TileStyler.prototype.setColStyles = function (tile, colIndex, percentWidth, gutterWidth) {
713 // Base horizontal size of a column.
714 var baseTileWidth = this.getBaseTileSize(percentWidth, gutterWidth);
715 // The width and horizontal position of each tile is always calculated the same way, but the
716 // height and vertical position depends on the rowMode.
717 var side = this._direction === 'rtl' ? 'right' : 'left';
718 tile._setStyle(side, this.getTilePosition(baseTileWidth, colIndex));
719 tile._setStyle('width', calc(this.getTileSize(baseTileWidth, tile.colspan)));
720 };
721 /**
722 * Calculates the total size taken up by gutters across one axis of a list.
723 */
724 TileStyler.prototype.getGutterSpan = function () {
725 return this._gutterSize + " * (" + this._rowspan + " - 1)";
726 };
727 /**
728 * Calculates the total size taken up by tiles across one axis of a list.
729 * @param tileHeight Height of the tile.
730 */
731 TileStyler.prototype.getTileSpan = function (tileHeight) {
732 return this._rowspan + " * " + this.getTileSize(tileHeight, 1);
733 };
734 /**
735 * Calculates the computed height and returns the correct style property to set.
736 * This method can be implemented by each type of TileStyler.
737 * @docs-private
738 */
739 TileStyler.prototype.getComputedHeight = function () { return null; };
740 return TileStyler;
741 }());
742 /**
743 * This type of styler is instantiated when the user passes in a fixed row height.
744 * Example `<mat-grid-list cols="3" rowHeight="100px">`
745 * @docs-private
746 */
747 var FixedTileStyler = /** @class */ (function (_super) {
748 __extends(FixedTileStyler, _super);
749 function FixedTileStyler(fixedRowHeight) {
750 var _this = _super.call(this) || this;
751 _this.fixedRowHeight = fixedRowHeight;
752 return _this;
753 }
754 FixedTileStyler.prototype.init = function (gutterSize, tracker, cols, direction) {
755 _super.prototype.init.call(this, gutterSize, tracker, cols, direction);
756 this.fixedRowHeight = normalizeUnits(this.fixedRowHeight);
757 if (!cssCalcAllowedValue.test(this.fixedRowHeight) &&
758 (typeof ngDevMode === 'undefined' || ngDevMode)) {
759 throw Error("Invalid value \"" + this.fixedRowHeight + "\" set as rowHeight.");
760 }
761 };
762 FixedTileStyler.prototype.setRowStyles = function (tile, rowIndex) {
763 tile._setStyle('top', this.getTilePosition(this.fixedRowHeight, rowIndex));
764 tile._setStyle('height', calc(this.getTileSize(this.fixedRowHeight, tile.rowspan)));
765 };
766 FixedTileStyler.prototype.getComputedHeight = function () {
767 return [
768 'height', calc(this.getTileSpan(this.fixedRowHeight) + " + " + this.getGutterSpan())
769 ];
770 };
771 FixedTileStyler.prototype.reset = function (list) {
772 list._setListStyle(['height', null]);
773 if (list._tiles) {
774 list._tiles.forEach(function (tile) {
775 tile._setStyle('top', null);
776 tile._setStyle('height', null);
777 });
778 }
779 };
780 return FixedTileStyler;
781 }(TileStyler));
782 /**
783 * This type of styler is instantiated when the user passes in a width:height ratio
784 * for the row height. Example `<mat-grid-list cols="3" rowHeight="3:1">`
785 * @docs-private
786 */
787 var RatioTileStyler = /** @class */ (function (_super) {
788 __extends(RatioTileStyler, _super);
789 function RatioTileStyler(value) {
790 var _this = _super.call(this) || this;
791 _this._parseRatio(value);
792 return _this;
793 }
794 RatioTileStyler.prototype.setRowStyles = function (tile, rowIndex, percentWidth, gutterWidth) {
795 var percentHeightPerTile = percentWidth / this.rowHeightRatio;
796 this.baseTileHeight = this.getBaseTileSize(percentHeightPerTile, gutterWidth);
797 // Use padding-top and margin-top to maintain the given aspect ratio, as
798 // a percentage-based value for these properties is applied versus the *width* of the
799 // containing block. See http://www.w3.org/TR/CSS2/box.html#margin-properties
800 tile._setStyle('marginTop', this.getTilePosition(this.baseTileHeight, rowIndex));
801 tile._setStyle('paddingTop', calc(this.getTileSize(this.baseTileHeight, tile.rowspan)));
802 };
803 RatioTileStyler.prototype.getComputedHeight = function () {
804 return [
805 'paddingBottom', calc(this.getTileSpan(this.baseTileHeight) + " + " + this.getGutterSpan())
806 ];
807 };
808 RatioTileStyler.prototype.reset = function (list) {
809 list._setListStyle(['paddingBottom', null]);
810 list._tiles.forEach(function (tile) {
811 tile._setStyle('marginTop', null);
812 tile._setStyle('paddingTop', null);
813 });
814 };
815 RatioTileStyler.prototype._parseRatio = function (value) {
816 var ratioParts = value.split(':');
817 if (ratioParts.length !== 2 && (typeof ngDevMode === 'undefined' || ngDevMode)) {
818 throw Error("mat-grid-list: invalid ratio given for row-height: \"" + value + "\"");
819 }
820 this.rowHeightRatio = parseFloat(ratioParts[0]) / parseFloat(ratioParts[1]);
821 };
822 return RatioTileStyler;
823 }(TileStyler));
824 /**
825 * This type of styler is instantiated when the user selects a "fit" row height mode.
826 * In other words, the row height will reflect the total height of the container divided
827 * by the number of rows. Example `<mat-grid-list cols="3" rowHeight="fit">`
828 *
829 * @docs-private
830 */
831 var FitTileStyler = /** @class */ (function (_super) {
832 __extends(FitTileStyler, _super);
833 function FitTileStyler() {
834 return _super !== null && _super.apply(this, arguments) || this;
835 }
836 FitTileStyler.prototype.setRowStyles = function (tile, rowIndex) {
837 // Percent of the available vertical space that one row takes up.
838 var percentHeightPerTile = 100 / this._rowspan;
839 // Fraction of the horizontal gutter size that each column takes up.
840 var gutterHeightPerTile = (this._rows - 1) / this._rows;
841 // Base vertical size of a column.
842 var baseTileHeight = this.getBaseTileSize(percentHeightPerTile, gutterHeightPerTile);
843 tile._setStyle('top', this.getTilePosition(baseTileHeight, rowIndex));
844 tile._setStyle('height', calc(this.getTileSize(baseTileHeight, tile.rowspan)));
845 };
846 FitTileStyler.prototype.reset = function (list) {
847 if (list._tiles) {
848 list._tiles.forEach(function (tile) {
849 tile._setStyle('top', null);
850 tile._setStyle('height', null);
851 });
852 }
853 };
854 return FitTileStyler;
855 }(TileStyler));
856 /** Wraps a CSS string in a calc function */
857 function calc(exp) {
858 return "calc(" + exp + ")";
859 }
860 /** Appends pixels to a CSS string if no units are given. */
861 function normalizeUnits(value) {
862 return value.match(/([A-Za-z%]+)$/) ? value : value + "px";
863 }
864
865 /**
866 * @license
867 * Copyright Google LLC All Rights Reserved.
868 *
869 * Use of this source code is governed by an MIT-style license that can be
870 * found in the LICENSE file at https://angular.io/license
871 */
872 // TODO(kara): Conditional (responsive) column count / row size.
873 // TODO(kara): Re-layout on window resize / media change (debounced).
874 // TODO(kara): gridTileHeader and gridTileFooter.
875 var MAT_FIT_MODE = 'fit';
876 var MatGridList = /** @class */ (function () {
877 function MatGridList(_element, _dir) {
878 this._element = _element;
879 this._dir = _dir;
880 /** The amount of space between tiles. This will be something like '5px' or '2em'. */
881 this._gutter = '1px';
882 }
883 Object.defineProperty(MatGridList.prototype, "cols", {
884 /** Amount of columns in the grid list. */
885 get: function () { return this._cols; },
886 set: function (value) {
887 this._cols = Math.max(1, Math.round(coercion.coerceNumberProperty(value)));
888 },
889 enumerable: false,
890 configurable: true
891 });
892 Object.defineProperty(MatGridList.prototype, "gutterSize", {
893 /** Size of the grid list's gutter in pixels. */
894 get: function () { return this._gutter; },
895 set: function (value) { this._gutter = "" + (value == null ? '' : value); },
896 enumerable: false,
897 configurable: true
898 });
899 Object.defineProperty(MatGridList.prototype, "rowHeight", {
900 /** Set internal representation of row height from the user-provided value. */
901 get: function () { return this._rowHeight; },
902 set: function (value) {
903 var newValue = "" + (value == null ? '' : value);
904 if (newValue !== this._rowHeight) {
905 this._rowHeight = newValue;
906 this._setTileStyler(this._rowHeight);
907 }
908 },
909 enumerable: false,
910 configurable: true
911 });
912 MatGridList.prototype.ngOnInit = function () {
913 this._checkCols();
914 this._checkRowHeight();
915 };
916 /**
917 * The layout calculation is fairly cheap if nothing changes, so there's little cost
918 * to run it frequently.
919 */
920 MatGridList.prototype.ngAfterContentChecked = function () {
921 this._layoutTiles();
922 };
923 /** Throw a friendly error if cols property is missing */
924 MatGridList.prototype._checkCols = function () {
925 if (!this.cols && (typeof ngDevMode === 'undefined' || ngDevMode)) {
926 throw Error("mat-grid-list: must pass in number of columns. " +
927 "Example: <mat-grid-list cols=\"3\">");
928 }
929 };
930 /** Default to equal width:height if rowHeight property is missing */
931 MatGridList.prototype._checkRowHeight = function () {
932 if (!this._rowHeight) {
933 this._setTileStyler('1:1');
934 }
935 };
936 /** Creates correct Tile Styler subtype based on rowHeight passed in by user */
937 MatGridList.prototype._setTileStyler = function (rowHeight) {
938 if (this._tileStyler) {
939 this._tileStyler.reset(this);
940 }
941 if (rowHeight === MAT_FIT_MODE) {
942 this._tileStyler = new FitTileStyler();
943 }
944 else if (rowHeight && rowHeight.indexOf(':') > -1) {
945 this._tileStyler = new RatioTileStyler(rowHeight);
946 }
947 else {
948 this._tileStyler = new FixedTileStyler(rowHeight);
949 }
950 };
951 /** Computes and applies the size and position for all children grid tiles. */
952 MatGridList.prototype._layoutTiles = function () {
953 var _this = this;
954 if (!this._tileCoordinator) {
955 this._tileCoordinator = new TileCoordinator();
956 }
957 var tracker = this._tileCoordinator;
958 var tiles = this._tiles.filter(function (tile) { return !tile._gridList || tile._gridList === _this; });
959 var direction = this._dir ? this._dir.value : 'ltr';
960 this._tileCoordinator.update(this.cols, tiles);
961 this._tileStyler.init(this.gutterSize, tracker, this.cols, direction);
962 tiles.forEach(function (tile, index) {
963 var pos = tracker.positions[index];
964 _this._tileStyler.setStyle(tile, pos.row, pos.col);
965 });
966 this._setListStyle(this._tileStyler.getComputedHeight());
967 };
968 /** Sets style on the main grid-list element, given the style name and value. */
969 MatGridList.prototype._setListStyle = function (style) {
970 if (style) {
971 this._element.nativeElement.style[style[0]] = style[1];
972 }
973 };
974 return MatGridList;
975 }());
976 MatGridList.decorators = [
977 { type: core.Component, args: [{
978 selector: 'mat-grid-list',
979 exportAs: 'matGridList',
980 template: "<div>\n <ng-content></ng-content>\n</div>",
981 host: {
982 'class': 'mat-grid-list',
983 // Ensures that the "cols" input value is reflected in the DOM. This is
984 // needed for the grid-list harness.
985 '[attr.cols]': 'cols',
986 },
987 providers: [{
988 provide: MAT_GRID_LIST,
989 useExisting: MatGridList
990 }],
991 changeDetection: core.ChangeDetectionStrategy.OnPush,
992 encapsulation: core.ViewEncapsulation.None,
993 styles: [".mat-grid-list{display:block;position:relative}.mat-grid-tile{display:block;position:absolute;overflow:hidden}.mat-grid-tile .mat-grid-tile-header,.mat-grid-tile .mat-grid-tile-footer{display:flex;align-items:center;height:48px;color:#fff;background:rgba(0,0,0,.38);overflow:hidden;padding:0 16px;position:absolute;left:0;right:0}.mat-grid-tile .mat-grid-tile-header>*,.mat-grid-tile .mat-grid-tile-footer>*{margin:0;padding:0;font-weight:normal;font-size:inherit}.mat-grid-tile .mat-grid-tile-header.mat-2-line,.mat-grid-tile .mat-grid-tile-footer.mat-2-line{height:68px}.mat-grid-tile .mat-grid-list-text{display:flex;flex-direction:column;flex:auto;box-sizing:border-box;overflow:hidden}.mat-grid-tile .mat-grid-list-text>*{margin:0;padding:0;font-weight:normal;font-size:inherit}.mat-grid-tile .mat-grid-list-text:empty{display:none}.mat-grid-tile .mat-grid-tile-header{top:0}.mat-grid-tile .mat-grid-tile-footer{bottom:0}.mat-grid-tile .mat-grid-avatar{padding-right:16px}[dir=rtl] .mat-grid-tile .mat-grid-avatar{padding-right:0;padding-left:16px}.mat-grid-tile .mat-grid-avatar:empty{display:none}.mat-grid-tile-content{top:0;left:0;right:0;bottom:0;position:absolute;display:flex;align-items:center;justify-content:center;height:100%;padding:0;margin:0}\n"]
994 },] }
995 ];
996 MatGridList.ctorParameters = function () { return [
997 { type: core.ElementRef },
998 { type: bidi.Directionality, decorators: [{ type: core.Optional }] }
999 ]; };
1000 MatGridList.propDecorators = {
1001 _tiles: [{ type: core.ContentChildren, args: [MatGridTile, { descendants: true },] }],
1002 cols: [{ type: core.Input }],
1003 gutterSize: [{ type: core.Input }],
1004 rowHeight: [{ type: core.Input }]
1005 };
1006
1007 /**
1008 * @license
1009 * Copyright Google LLC All Rights Reserved.
1010 *
1011 * Use of this source code is governed by an MIT-style license that can be
1012 * found in the LICENSE file at https://angular.io/license
1013 */
1014 var MatGridListModule = /** @class */ (function () {
1015 function MatGridListModule() {
1016 }
1017 return MatGridListModule;
1018 }());
1019 MatGridListModule.decorators = [
1020 { type: core.NgModule, args: [{
1021 imports: [core$1.MatLineModule, core$1.MatCommonModule],
1022 exports: [
1023 MatGridList,
1024 MatGridTile,
1025 MatGridTileText,
1026 core$1.MatLineModule,
1027 core$1.MatCommonModule,
1028 MatGridTileHeaderCssMatStyler,
1029 MatGridTileFooterCssMatStyler,
1030 MatGridAvatarCssMatStyler
1031 ],
1032 declarations: [
1033 MatGridList,
1034 MatGridTile,
1035 MatGridTileText,
1036 MatGridTileHeaderCssMatStyler,
1037 MatGridTileFooterCssMatStyler,
1038 MatGridAvatarCssMatStyler
1039 ],
1040 },] }
1041 ];
1042
1043 /**
1044 * @license
1045 * Copyright Google LLC All Rights Reserved.
1046 *
1047 * Use of this source code is governed by an MIT-style license that can be
1048 * found in the LICENSE file at https://angular.io/license
1049 */
1050 // Privately exported for the grid-list harness.
1051 var ɵTileCoordinator = TileCoordinator;
1052
1053 /**
1054 * Generated bundle index. Do not edit.
1055 */
1056
1057 exports.MatGridAvatarCssMatStyler = MatGridAvatarCssMatStyler;
1058 exports.MatGridList = MatGridList;
1059 exports.MatGridListModule = MatGridListModule;
1060 exports.MatGridTile = MatGridTile;
1061 exports.MatGridTileFooterCssMatStyler = MatGridTileFooterCssMatStyler;
1062 exports.MatGridTileHeaderCssMatStyler = MatGridTileHeaderCssMatStyler;
1063 exports.MatGridTileText = MatGridTileText;
1064 exports.ɵTileCoordinator = ɵTileCoordinator;
1065 exports.ɵangular_material_src_material_grid_list_grid_list_a = MAT_GRID_LIST;
1066
1067 Object.defineProperty(exports, '__esModule', { value: true });
1068
1069})));
1070//# sourceMappingURL=material-grid-list.umd.js.map
Note: See TracBrowser for help on using the repository browser.