1 | import { Directive, Component, ChangeDetectionStrategy, ViewEncapsulation, ElementRef, Inject, ContentChildren, NgModule } from '@angular/core';
|
---|
2 | import { mixinColor, MatCommonModule } from '@angular/material/core';
|
---|
3 | import { Platform } from '@angular/cdk/platform';
|
---|
4 | import { DOCUMENT } from '@angular/common';
|
---|
5 |
|
---|
6 | /**
|
---|
7 | * @license
|
---|
8 | * Copyright Google LLC All Rights Reserved.
|
---|
9 | *
|
---|
10 | * Use of this source code is governed by an MIT-style license that can be
|
---|
11 | * found in the LICENSE file at https://angular.io/license
|
---|
12 | */
|
---|
13 | // Boilerplate for applying mixins to MatToolbar.
|
---|
14 | /** @docs-private */
|
---|
15 | const _MatToolbarBase = mixinColor(class {
|
---|
16 | constructor(_elementRef) {
|
---|
17 | this._elementRef = _elementRef;
|
---|
18 | }
|
---|
19 | });
|
---|
20 | class MatToolbarRow {
|
---|
21 | }
|
---|
22 | MatToolbarRow.decorators = [
|
---|
23 | { type: Directive, args: [{
|
---|
24 | selector: 'mat-toolbar-row',
|
---|
25 | exportAs: 'matToolbarRow',
|
---|
26 | host: { 'class': 'mat-toolbar-row' },
|
---|
27 | },] }
|
---|
28 | ];
|
---|
29 | class MatToolbar extends _MatToolbarBase {
|
---|
30 | constructor(elementRef, _platform, document) {
|
---|
31 | super(elementRef);
|
---|
32 | this._platform = _platform;
|
---|
33 | // TODO: make the document a required param when doing breaking changes.
|
---|
34 | this._document = document;
|
---|
35 | }
|
---|
36 | ngAfterViewInit() {
|
---|
37 | if (this._platform.isBrowser) {
|
---|
38 | this._checkToolbarMixedModes();
|
---|
39 | this._toolbarRows.changes.subscribe(() => this._checkToolbarMixedModes());
|
---|
40 | }
|
---|
41 | }
|
---|
42 | /**
|
---|
43 | * Throws an exception when developers are attempting to combine the different toolbar row modes.
|
---|
44 | */
|
---|
45 | _checkToolbarMixedModes() {
|
---|
46 | if (this._toolbarRows.length && (typeof ngDevMode === 'undefined' || ngDevMode)) {
|
---|
47 | // Check if there are any other DOM nodes that can display content but aren't inside of
|
---|
48 | // a <mat-toolbar-row> element.
|
---|
49 | const isCombinedUsage = Array.from(this._elementRef.nativeElement.childNodes)
|
---|
50 | .filter(node => !(node.classList && node.classList.contains('mat-toolbar-row')))
|
---|
51 | .filter(node => node.nodeType !== (this._document ? this._document.COMMENT_NODE : 8))
|
---|
52 | .some(node => !!(node.textContent && node.textContent.trim()));
|
---|
53 | if (isCombinedUsage) {
|
---|
54 | throwToolbarMixedModesError();
|
---|
55 | }
|
---|
56 | }
|
---|
57 | }
|
---|
58 | }
|
---|
59 | MatToolbar.decorators = [
|
---|
60 | { type: Component, args: [{
|
---|
61 | selector: 'mat-toolbar',
|
---|
62 | exportAs: 'matToolbar',
|
---|
63 | template: "<ng-content></ng-content>\n<ng-content select=\"mat-toolbar-row\"></ng-content>\n",
|
---|
64 | inputs: ['color'],
|
---|
65 | host: {
|
---|
66 | 'class': 'mat-toolbar',
|
---|
67 | '[class.mat-toolbar-multiple-rows]': '_toolbarRows.length > 0',
|
---|
68 | '[class.mat-toolbar-single-row]': '_toolbarRows.length === 0',
|
---|
69 | },
|
---|
70 | changeDetection: ChangeDetectionStrategy.OnPush,
|
---|
71 | encapsulation: ViewEncapsulation.None,
|
---|
72 | styles: [".cdk-high-contrast-active .mat-toolbar{outline:solid 1px}.mat-toolbar-row,.mat-toolbar-single-row{display:flex;box-sizing:border-box;padding:0 16px;width:100%;flex-direction:row;align-items:center;white-space:nowrap}.mat-toolbar-multiple-rows{display:flex;box-sizing:border-box;flex-direction:column;width:100%}\n"]
|
---|
73 | },] }
|
---|
74 | ];
|
---|
75 | MatToolbar.ctorParameters = () => [
|
---|
76 | { type: ElementRef },
|
---|
77 | { type: Platform },
|
---|
78 | { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
|
---|
79 | ];
|
---|
80 | MatToolbar.propDecorators = {
|
---|
81 | _toolbarRows: [{ type: ContentChildren, args: [MatToolbarRow, { descendants: true },] }]
|
---|
82 | };
|
---|
83 | /**
|
---|
84 | * Throws an exception when attempting to combine the different toolbar row modes.
|
---|
85 | * @docs-private
|
---|
86 | */
|
---|
87 | function throwToolbarMixedModesError() {
|
---|
88 | throw Error('MatToolbar: Attempting to combine different toolbar modes. ' +
|
---|
89 | 'Either specify multiple `<mat-toolbar-row>` elements explicitly or just place content ' +
|
---|
90 | 'inside of a `<mat-toolbar>` for a single row.');
|
---|
91 | }
|
---|
92 |
|
---|
93 | /**
|
---|
94 | * @license
|
---|
95 | * Copyright Google LLC All Rights Reserved.
|
---|
96 | *
|
---|
97 | * Use of this source code is governed by an MIT-style license that can be
|
---|
98 | * found in the LICENSE file at https://angular.io/license
|
---|
99 | */
|
---|
100 | class MatToolbarModule {
|
---|
101 | }
|
---|
102 | MatToolbarModule.decorators = [
|
---|
103 | { type: NgModule, args: [{
|
---|
104 | imports: [MatCommonModule],
|
---|
105 | exports: [MatToolbar, MatToolbarRow, MatCommonModule],
|
---|
106 | declarations: [MatToolbar, MatToolbarRow],
|
---|
107 | },] }
|
---|
108 | ];
|
---|
109 |
|
---|
110 | /**
|
---|
111 | * @license
|
---|
112 | * Copyright Google LLC All Rights Reserved.
|
---|
113 | *
|
---|
114 | * Use of this source code is governed by an MIT-style license that can be
|
---|
115 | * found in the LICENSE file at https://angular.io/license
|
---|
116 | */
|
---|
117 |
|
---|
118 | /**
|
---|
119 | * Generated bundle index. Do not edit.
|
---|
120 | */
|
---|
121 |
|
---|
122 | export { MatToolbar, MatToolbarModule, MatToolbarRow, throwToolbarMixedModesError };
|
---|
123 | //# sourceMappingURL=toolbar.js.map
|
---|