@dontdrinkandroot/ngx-material-extensions 0.7.0 → 0.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/_theme.scss +4 -1
- package/assets/fonts.scss +8 -13
- package/fesm2022/dontdrinkandroot-ngx-material-extensions.mjs +259 -368
- package/fesm2022/dontdrinkandroot-ngx-material-extensions.mjs.map +1 -1
- package/package.json +2 -1
- package/src/button/fab-fixed.directive.d.ts +3 -3
- package/src/ddr-material-extensions.module.d.ts +2 -22
- package/src/filter/filter.component.d.ts +6 -15
- package/src/gridlist/grid-tile-lazy-image-container.directive.d.ts +5 -5
- package/src/gridlist/grid-tile-lazy-img.directive.d.ts +3 -3
- package/src/sidenav/sidenav-container.component.d.ts +6 -11
- package/src/sidenav/sidenav-toggle.component.d.ts +5 -5
- package/src/sidenav/sidenav.service.d.ts +4 -5
- package/src/theme/theme-config.d.ts +2 -2
- package/src/theme/theme-scroll.service.d.ts +5 -5
- package/src/toolbar/toolbar-fixed-top.directive.d.ts +3 -3
|
@@ -1,140 +1,153 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, Inject,
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
import { BehaviorSubject, interval, fromEvent, distinctUntilChanged } from 'rxjs';
|
|
2
|
+
import { InjectionToken, Injectable, Inject, makeEnvironmentProviders, provideEnvironmentInitializer, inject, Directive, Component, ChangeDetectionStrategy, Input, ViewChild, HostBinding, ContentChildren, HostListener } from '@angular/core';
|
|
3
|
+
import { MatIconRegistry, MatIcon } from '@angular/material/icon';
|
|
4
|
+
import { DOCUMENT, AsyncPipe, NgClass } from '@angular/common';
|
|
5
|
+
import { fromEvent, distinctUntilChanged, interval, BehaviorSubject } from 'rxjs';
|
|
7
6
|
import { map, debounce } from 'rxjs/operators';
|
|
8
|
-
import * as
|
|
9
|
-
import {
|
|
10
|
-
import
|
|
11
|
-
import {
|
|
12
|
-
import
|
|
13
|
-
import {
|
|
14
|
-
import
|
|
15
|
-
import { MatButtonModule } from '@angular/material/button';
|
|
16
|
-
import * as i3$1 from '@angular/material/sidenav';
|
|
17
|
-
import { MatSidenavModule } from '@angular/material/sidenav';
|
|
7
|
+
import * as i1 from '@angular/forms';
|
|
8
|
+
import { FormControl, ReactiveFormsModule } from '@angular/forms';
|
|
9
|
+
import { MatCard } from '@angular/material/card';
|
|
10
|
+
import { MatFormField, MatSuffix } from '@angular/material/form-field';
|
|
11
|
+
import { MatInput } from '@angular/material/input';
|
|
12
|
+
import { MatIconButton } from '@angular/material/button';
|
|
13
|
+
import { outputFromObservable, toSignal } from '@angular/core/rxjs-interop';
|
|
18
14
|
import { __decorate } from 'tslib';
|
|
19
15
|
import { NumberUtils, StringUtils, Debounce, Limit } from '@dontdrinkandroot/ngx-extensions';
|
|
20
|
-
import
|
|
21
|
-
import
|
|
22
|
-
import
|
|
23
|
-
import
|
|
24
|
-
import
|
|
25
|
-
import { MatInputModule } from '@angular/material/input';
|
|
26
|
-
import * as i4 from '@angular/material/form-field';
|
|
27
|
-
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
28
|
-
import { MatToolbarModule } from '@angular/material/toolbar';
|
|
16
|
+
import { MatSidenav, MatSidenavContainer, MatSidenavContent } from '@angular/material/sidenav';
|
|
17
|
+
import * as i1$1 from '@angular/cdk/layout';
|
|
18
|
+
import { Breakpoints } from '@angular/cdk/layout';
|
|
19
|
+
import * as i2 from '@angular/router';
|
|
20
|
+
import { NavigationStart } from '@angular/router';
|
|
29
21
|
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
22
|
+
const DDR_MAT_THEME = new InjectionToken('DDR_MAT_THEME');
|
|
23
|
+
|
|
24
|
+
class DdrMatThemeScrollService {
|
|
33
25
|
document;
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
largeBreakpoints = [
|
|
37
|
-
Breakpoints.Medium,
|
|
38
|
-
Breakpoints.Large,
|
|
39
|
-
Breakpoints.XLarge
|
|
40
|
-
];
|
|
41
|
-
screenLarge$;
|
|
42
|
-
mode$;
|
|
43
|
-
opened$;
|
|
44
|
-
sidenavContentScrolled$ = new BehaviorSubject(false);
|
|
45
|
-
constructor(breakpointObserver, router, document) {
|
|
46
|
-
this.breakpointObserver = breakpointObserver;
|
|
47
|
-
this.router = router;
|
|
26
|
+
themeConfig;
|
|
27
|
+
constructor(document, themeConfig) {
|
|
48
28
|
this.document = document;
|
|
49
|
-
this.
|
|
50
|
-
this.mode$ = this.screenLarge$.pipe(map(large => large && this.stayOpenOnLargeScreen ? 'side' : 'over'));
|
|
51
|
-
this.opened$ = this.screenLarge$.pipe(map(large => large && this.stayOpenOnLargeScreen));
|
|
52
|
-
this.router.events.subscribe(event => {
|
|
53
|
-
if (event instanceof NavigationStart) {
|
|
54
|
-
this.closeSidebar();
|
|
55
|
-
}
|
|
56
|
-
});
|
|
57
|
-
}
|
|
58
|
-
setSidenav(sidenav) {
|
|
59
|
-
this.sidenav = sidenav;
|
|
60
|
-
}
|
|
61
|
-
getStayOpenOnLargeScreen() {
|
|
62
|
-
return this.stayOpenOnLargeScreen;
|
|
63
|
-
}
|
|
64
|
-
setStayOpenOnLargeScreen(value) {
|
|
65
|
-
this.stayOpenOnLargeScreen = value;
|
|
29
|
+
this.themeConfig = themeConfig;
|
|
66
30
|
}
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
31
|
+
init() {
|
|
32
|
+
const lightMetaElement = this.findOrCreateThemeColorMetaElement('(prefers-color-scheme: light)', this.themeConfig.themeColorLight);
|
|
33
|
+
const darkMetaElement = this.findOrCreateThemeColorMetaElement('(prefers-color-scheme: dark)', this.themeConfig.themeColorDark);
|
|
34
|
+
fromEvent(this.document, 'scroll')
|
|
35
|
+
.pipe(map(() => this.document.documentElement.scrollTop > 0), distinctUntilChanged()).subscribe((scrolled) => {
|
|
36
|
+
this.document.body.classList.toggle('ddr-mat-scrolled', scrolled);
|
|
37
|
+
lightMetaElement.content = scrolled ? this.themeConfig.themeColorLightScrolled : this.themeConfig.themeColorLight;
|
|
38
|
+
darkMetaElement.content = scrolled ? this.themeConfig.themeColorDarkScrolled : this.themeConfig.themeColorDark;
|
|
39
|
+
});
|
|
75
40
|
}
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
41
|
+
findOrCreateThemeColorMetaElement(media, content) {
|
|
42
|
+
let metaElement = this.document.head.querySelector(`meta[name="theme-color"][media="${media}"]`);
|
|
43
|
+
if (null == metaElement) {
|
|
44
|
+
metaElement = this.createThemeColorMetaElement(media, content);
|
|
79
45
|
}
|
|
46
|
+
return metaElement;
|
|
80
47
|
}
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
return this.screenLarge$.pipe(map(large => !large || !this.stayOpenOnLargeScreen));
|
|
89
|
-
}
|
|
90
|
-
watchContentScrolled() {
|
|
91
|
-
return this.sidenavContentScrolled$.asObservable();
|
|
48
|
+
createThemeColorMetaElement(media, content) {
|
|
49
|
+
const metaElement = this.document.createElement('meta');
|
|
50
|
+
metaElement.name = 'theme-color';
|
|
51
|
+
metaElement.media = media;
|
|
52
|
+
metaElement.content = content;
|
|
53
|
+
this.document.head.appendChild(metaElement);
|
|
54
|
+
return metaElement;
|
|
92
55
|
}
|
|
93
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
94
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.
|
|
56
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatThemeScrollService, deps: [{ token: DOCUMENT }, { token: DDR_MAT_THEME }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
57
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatThemeScrollService });
|
|
95
58
|
}
|
|
96
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
97
|
-
type: Injectable
|
|
98
|
-
|
|
99
|
-
providedIn: 'root'
|
|
100
|
-
}]
|
|
101
|
-
}], ctorParameters: () => [{ type: i1.BreakpointObserver }, { type: i2.Router }, { type: Document, decorators: [{
|
|
59
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatThemeScrollService, decorators: [{
|
|
60
|
+
type: Injectable
|
|
61
|
+
}], ctorParameters: () => [{ type: Document, decorators: [{
|
|
102
62
|
type: Inject,
|
|
103
63
|
args: [DOCUMENT]
|
|
64
|
+
}] }, { type: undefined, decorators: [{
|
|
65
|
+
type: Inject,
|
|
66
|
+
args: [DDR_MAT_THEME]
|
|
104
67
|
}] }] });
|
|
105
68
|
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
69
|
+
function provideDdrMaterialExtensions() {
|
|
70
|
+
return makeEnvironmentProviders([
|
|
71
|
+
DdrMatThemeScrollService,
|
|
72
|
+
{
|
|
73
|
+
provide: DDR_MAT_THEME,
|
|
74
|
+
multi: false,
|
|
75
|
+
useValue: {
|
|
76
|
+
themeColorLight: '#fdfbff',
|
|
77
|
+
themeColorDark: '#1a1b1f',
|
|
78
|
+
themeColorLightScrolled: '#efedf1',
|
|
79
|
+
themeColorDarkScrolled: '#1e1f23',
|
|
80
|
+
}
|
|
81
|
+
},
|
|
82
|
+
provideEnvironmentInitializer(() => {
|
|
83
|
+
inject(DdrMatThemeScrollService).init();
|
|
84
|
+
inject(MatIconRegistry).setDefaultFontSetClass('material-symbols-rounded');
|
|
85
|
+
})
|
|
86
|
+
]);
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
class DdrMatFabFixedDirective {
|
|
90
|
+
el;
|
|
91
|
+
constructor(el) {
|
|
92
|
+
this.el = el;
|
|
112
93
|
}
|
|
113
|
-
|
|
114
|
-
|
|
94
|
+
/**
|
|
95
|
+
* @override
|
|
96
|
+
*/
|
|
97
|
+
ngOnInit() {
|
|
98
|
+
const container = document.createElement('div');
|
|
99
|
+
container.classList.add('ddr-mat-fab-fixed-container');
|
|
100
|
+
this.el.nativeElement.parentElement.insertBefore(container, this.el.nativeElement);
|
|
101
|
+
container.appendChild(this.el.nativeElement);
|
|
115
102
|
}
|
|
116
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
117
|
-
static
|
|
118
|
-
<button mat-icon-button (click)="toggleSidenav()">
|
|
119
|
-
<mat-icon>menu</mat-icon>
|
|
120
|
-
</button>`, isInline: true, dependencies: [{ kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }] });
|
|
103
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatFabFixedDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
104
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.1", type: DdrMatFabFixedDirective, isStandalone: true, selector: "[ddrMatFabFixed]", ngImport: i0 });
|
|
121
105
|
}
|
|
122
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
123
|
-
type:
|
|
106
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatFabFixedDirective, decorators: [{
|
|
107
|
+
type: Directive,
|
|
124
108
|
args: [{
|
|
125
|
-
selector: '
|
|
126
|
-
template: `
|
|
127
|
-
<button mat-icon-button (click)="toggleSidenav()">
|
|
128
|
-
<mat-icon>menu</mat-icon>
|
|
129
|
-
</button>`,
|
|
130
|
-
host: {
|
|
131
|
-
'[style.display]': 'visible() ? "block" : "none"'
|
|
132
|
-
},
|
|
133
|
-
standalone: false
|
|
109
|
+
selector: '[ddrMatFabFixed]',
|
|
134
110
|
}]
|
|
135
|
-
}], ctorParameters: () => [{ type:
|
|
111
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
112
|
+
|
|
113
|
+
class DdrMatFilterComponent {
|
|
114
|
+
formControl = new FormControl(null);
|
|
115
|
+
filterChanged = outputFromObservable(this.formControl.valueChanges
|
|
116
|
+
.pipe(debounce(() => interval(this.bouncePeriod))));
|
|
117
|
+
bouncePeriod = 500;
|
|
118
|
+
inputElement;
|
|
119
|
+
/**
|
|
120
|
+
* @override
|
|
121
|
+
*/
|
|
122
|
+
ngAfterContentInit() {
|
|
123
|
+
this.inputElement.nativeElement.focus();
|
|
124
|
+
}
|
|
125
|
+
clear() {
|
|
126
|
+
this.formControl.setValue(null);
|
|
127
|
+
// this.filterChanged.emit(null);
|
|
128
|
+
}
|
|
129
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
130
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.1", type: DdrMatFilterComponent, isStandalone: true, selector: "ddr-mat-filter", inputs: { bouncePeriod: "bouncePeriod" }, outputs: { filterChanged: "filterChanged" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<mat-card appearance=\"outlined\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\">\n <input matInput type=\"text\" [formControl]=\"formControl\" #input />\n <button mat-icon-button matSuffix (click)=\"clear()\">\n <mat-icon>close</mat-icon>\n </button>\n </mat-form-field>\n</mat-card>\n", dependencies: [{ kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
131
|
+
}
|
|
132
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatFilterComponent, decorators: [{
|
|
133
|
+
type: Component,
|
|
134
|
+
args: [{ selector: 'ddr-mat-filter', imports: [
|
|
135
|
+
MatIconButton,
|
|
136
|
+
MatCard,
|
|
137
|
+
MatFormField,
|
|
138
|
+
MatIcon,
|
|
139
|
+
MatInput,
|
|
140
|
+
MatSuffix,
|
|
141
|
+
ReactiveFormsModule
|
|
142
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-card appearance=\"outlined\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\">\n <input matInput type=\"text\" [formControl]=\"formControl\" #input />\n <button mat-icon-button matSuffix (click)=\"clear()\">\n <mat-icon>close</mat-icon>\n </button>\n </mat-form-field>\n</mat-card>\n" }]
|
|
143
|
+
}], propDecorators: { bouncePeriod: [{
|
|
144
|
+
type: Input
|
|
145
|
+
}], inputElement: [{
|
|
146
|
+
type: ViewChild,
|
|
147
|
+
args: ['input', { static: true }]
|
|
148
|
+
}] } });
|
|
136
149
|
|
|
137
|
-
class
|
|
150
|
+
class DdrMatGridTileLazyImgDirective {
|
|
138
151
|
element;
|
|
139
152
|
cd;
|
|
140
153
|
src;
|
|
@@ -221,18 +234,17 @@ class GridTileLazyImgDirective {
|
|
|
221
234
|
// console.log('isHidden');
|
|
222
235
|
return window.getComputedStyle(nativeElement).display === 'none';
|
|
223
236
|
}
|
|
224
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
225
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.
|
|
237
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatGridTileLazyImgDirective, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
238
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.1", type: DdrMatGridTileLazyImgDirective, isStandalone: true, selector: "[ddrMatGridTileLazyImg]", inputs: { src: ["ddrMatGridTileLazyImg", "src"], offset: "offset", objectFit: "objectFit" }, host: { properties: { "src": "this.hostSrc", "style.object-fit": "this.hostStyleObjectFit", "style.width.px": "this.hostStyleWidthPx", "style.height.px": "this.hostStyleHeightPx", "style.opacity": "this.hostStyleOpacity" } }, usesOnChanges: true, ngImport: i0 });
|
|
226
239
|
}
|
|
227
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
240
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatGridTileLazyImgDirective, decorators: [{
|
|
228
241
|
type: Directive,
|
|
229
242
|
args: [{
|
|
230
|
-
selector: '[
|
|
231
|
-
standalone: false
|
|
243
|
+
selector: '[ddrMatGridTileLazyImg]'
|
|
232
244
|
}]
|
|
233
245
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { src: [{
|
|
234
246
|
type: Input,
|
|
235
|
-
args: ['
|
|
247
|
+
args: ['ddrMatGridTileLazyImg']
|
|
236
248
|
}], hostSrc: [{
|
|
237
249
|
type: HostBinding,
|
|
238
250
|
args: ['src']
|
|
@@ -254,7 +266,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImpor
|
|
|
254
266
|
type: Input
|
|
255
267
|
}] } });
|
|
256
268
|
|
|
257
|
-
class
|
|
269
|
+
class DdrMatGridTileLazyImageContainerDirective {
|
|
258
270
|
lazyImages;
|
|
259
271
|
changeSubscription;
|
|
260
272
|
windowResized() {
|
|
@@ -283,24 +295,23 @@ class GridTileLazyImageContainerDirective {
|
|
|
283
295
|
ngOnDestroy() {
|
|
284
296
|
this.changeSubscription.unsubscribe();
|
|
285
297
|
}
|
|
286
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
287
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.
|
|
298
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatGridTileLazyImageContainerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
299
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.1", type: DdrMatGridTileLazyImageContainerDirective, isStandalone: true, selector: "[ddrMatGridTileLazyImgContainer]", host: { listeners: { "window:resize": "windowResized($event)", "window:scroll": "windowScroll($event)" } }, queries: [{ propertyName: "lazyImages", predicate: DdrMatGridTileLazyImgDirective, descendants: true }], ngImport: i0 });
|
|
288
300
|
}
|
|
289
301
|
__decorate([
|
|
290
302
|
Debounce()
|
|
291
|
-
],
|
|
303
|
+
], DdrMatGridTileLazyImageContainerDirective.prototype, "windowResized", null);
|
|
292
304
|
__decorate([
|
|
293
305
|
Limit()
|
|
294
|
-
],
|
|
295
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
306
|
+
], DdrMatGridTileLazyImageContainerDirective.prototype, "windowScroll", null);
|
|
307
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatGridTileLazyImageContainerDirective, decorators: [{
|
|
296
308
|
type: Directive,
|
|
297
309
|
args: [{
|
|
298
|
-
selector: '[
|
|
299
|
-
standalone: false
|
|
310
|
+
selector: '[ddrMatGridTileLazyImgContainer]'
|
|
300
311
|
}]
|
|
301
312
|
}], propDecorators: { lazyImages: [{
|
|
302
313
|
type: ContentChildren,
|
|
303
|
-
args: [
|
|
314
|
+
args: [DdrMatGridTileLazyImgDirective, { descendants: true }]
|
|
304
315
|
}], windowResized: [{
|
|
305
316
|
type: HostListener,
|
|
306
317
|
args: ['window:resize', ['$event']]
|
|
@@ -309,13 +320,83 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImpor
|
|
|
309
320
|
args: ['window:scroll', ['$event']]
|
|
310
321
|
}] } });
|
|
311
322
|
|
|
312
|
-
class
|
|
323
|
+
class DdrMatSidenavService {
|
|
324
|
+
breakpointObserver;
|
|
325
|
+
router;
|
|
326
|
+
sidenav;
|
|
327
|
+
stayOpenOnLargeScreen = true;
|
|
328
|
+
largeBreakpoints = [
|
|
329
|
+
Breakpoints.Medium,
|
|
330
|
+
Breakpoints.Large,
|
|
331
|
+
Breakpoints.XLarge
|
|
332
|
+
];
|
|
333
|
+
screenLarge$;
|
|
334
|
+
mode$;
|
|
335
|
+
opened$;
|
|
336
|
+
sidenavContentScrolled$ = new BehaviorSubject(false);
|
|
337
|
+
constructor(breakpointObserver, router) {
|
|
338
|
+
this.breakpointObserver = breakpointObserver;
|
|
339
|
+
this.router = router;
|
|
340
|
+
this.screenLarge$ = this.breakpointObserver.observe(this.largeBreakpoints).pipe(map(result => result.matches));
|
|
341
|
+
this.mode$ = this.screenLarge$.pipe(map(large => large && this.stayOpenOnLargeScreen ? 'side' : 'over'));
|
|
342
|
+
this.opened$ = this.screenLarge$.pipe(map(large => large && this.stayOpenOnLargeScreen));
|
|
343
|
+
this.router.events.subscribe(event => {
|
|
344
|
+
if (event instanceof NavigationStart) {
|
|
345
|
+
this.closeSidebar();
|
|
346
|
+
}
|
|
347
|
+
});
|
|
348
|
+
}
|
|
349
|
+
setSidenav(sidenav) {
|
|
350
|
+
this.sidenav = sidenav;
|
|
351
|
+
}
|
|
352
|
+
getStayOpenOnLargeScreen() {
|
|
353
|
+
return this.stayOpenOnLargeScreen;
|
|
354
|
+
}
|
|
355
|
+
setStayOpenOnLargeScreen(value) {
|
|
356
|
+
this.stayOpenOnLargeScreen = value;
|
|
357
|
+
}
|
|
358
|
+
toggle() {
|
|
359
|
+
if (null == this.sidenav) {
|
|
360
|
+
return Promise.reject('No MatSidenav found. Use setSidenav() of SidenavService');
|
|
361
|
+
}
|
|
362
|
+
if (!(this.stayOpenOnLargeScreen && this.breakpointObserver.isMatched(this.largeBreakpoints))) {
|
|
363
|
+
return this.sidenav.toggle();
|
|
364
|
+
}
|
|
365
|
+
return Promise.resolve(this.sidenav.opened ? 'open' : 'close');
|
|
366
|
+
}
|
|
367
|
+
closeSidebar() {
|
|
368
|
+
if (!(this.stayOpenOnLargeScreen && this.breakpointObserver.isMatched(this.largeBreakpoints))) {
|
|
369
|
+
this.sidenav.close();
|
|
370
|
+
}
|
|
371
|
+
}
|
|
372
|
+
getModeObservable() {
|
|
373
|
+
return this.mode$;
|
|
374
|
+
}
|
|
375
|
+
getOpenedObservable() {
|
|
376
|
+
return this.opened$;
|
|
377
|
+
}
|
|
378
|
+
watchToggleVisible() {
|
|
379
|
+
return this.screenLarge$.pipe(map(large => !large || !this.stayOpenOnLargeScreen));
|
|
380
|
+
}
|
|
381
|
+
watchContentScrolled() {
|
|
382
|
+
return this.sidenavContentScrolled$.asObservable();
|
|
383
|
+
}
|
|
384
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatSidenavService, deps: [{ token: i1$1.BreakpointObserver }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
385
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatSidenavService, providedIn: 'root' });
|
|
386
|
+
}
|
|
387
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatSidenavService, decorators: [{
|
|
388
|
+
type: Injectable,
|
|
389
|
+
args: [{
|
|
390
|
+
providedIn: 'root'
|
|
391
|
+
}]
|
|
392
|
+
}], ctorParameters: () => [{ type: i1$1.BreakpointObserver }, { type: i2.Router }] });
|
|
393
|
+
|
|
394
|
+
class DdrMatSidenavContainerComponent {
|
|
313
395
|
sidenavService;
|
|
314
396
|
sidenav;
|
|
315
397
|
stayOpenOnLargeScreen = true;
|
|
316
398
|
mode$;
|
|
317
399
|
opened$;
|
|
318
|
-
scrollSubscription;
|
|
319
400
|
constructor(sidenavService) {
|
|
320
401
|
this.sidenavService = sidenavService;
|
|
321
402
|
this.mode$ = this.sidenavService.getModeObservable();
|
|
@@ -333,118 +414,61 @@ class SidenavContainerComponent {
|
|
|
333
414
|
ngOnInit() {
|
|
334
415
|
this.sidenavService.setSidenav(this.sidenav);
|
|
335
416
|
}
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
*/
|
|
339
|
-
ngOnDestroy() {
|
|
340
|
-
this.scrollSubscription.unsubscribe();
|
|
341
|
-
}
|
|
342
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SidenavContainerComponent, deps: [{ token: SidenavService }], target: i0.ɵɵFactoryTarget.Component });
|
|
343
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.5", type: SidenavContainerComponent, isStandalone: false, selector: "ddr-mat-sidenav-container", inputs: { stayOpenOnLargeScreen: "stayOpenOnLargeScreen" }, viewQueries: [{ propertyName: "sidenav", first: true, predicate: ["sidenav"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<mat-sidenav-container [ngClass]=\"(mode$|async)\">\n <mat-sidenav\n #sidenav\n [mode]=\"(mode$|async) ?? 'over'\"\n [opened]=\"(opened$|async)\"\n [fixedInViewport]=\"true\"\n >\n <ng-content select=\"[slot=mat-sidenav]\"></ng-content>\n </mat-sidenav>\n <mat-sidenav-content #sidenavContent>\n <ng-content select=\"[slot=mat-sidenav-content]\"></ng-content>\n </mat-sidenav-content>\n</mat-sidenav-container>\n", dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3$1.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i3$1.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i3$1.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "pipe", type: i2$2.AsyncPipe, name: "async" }] });
|
|
417
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatSidenavContainerComponent, deps: [{ token: DdrMatSidenavService }], target: i0.ɵɵFactoryTarget.Component });
|
|
418
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.1", type: DdrMatSidenavContainerComponent, isStandalone: true, selector: "ddr-mat-sidenav-container", inputs: { stayOpenOnLargeScreen: "stayOpenOnLargeScreen" }, viewQueries: [{ propertyName: "sidenav", first: true, predicate: ["sidenav"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<mat-sidenav-container [ngClass]=\"(mode$|async)\">\n <mat-sidenav\n #sidenav\n [mode]=\"(mode$|async) ?? 'over'\"\n [opened]=\"(opened$|async)\"\n [fixedInViewport]=\"true\"\n >\n <ng-content select=\"[slot=mat-sidenav]\"></ng-content>\n </mat-sidenav>\n <mat-sidenav-content #sidenavContent>\n <ng-content select=\"[slot=mat-sidenav-content]\"></ng-content>\n </mat-sidenav-content>\n</mat-sidenav-container>\n", dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "component", type: MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
344
419
|
}
|
|
345
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
420
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatSidenavContainerComponent, decorators: [{
|
|
346
421
|
type: Component,
|
|
347
|
-
args: [{ selector: 'ddr-mat-sidenav-container',
|
|
348
|
-
|
|
422
|
+
args: [{ selector: 'ddr-mat-sidenav-container', imports: [
|
|
423
|
+
AsyncPipe,
|
|
424
|
+
MatSidenav,
|
|
425
|
+
MatSidenavContainer,
|
|
426
|
+
MatSidenavContent,
|
|
427
|
+
NgClass
|
|
428
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-sidenav-container [ngClass]=\"(mode$|async)\">\n <mat-sidenav\n #sidenav\n [mode]=\"(mode$|async) ?? 'over'\"\n [opened]=\"(opened$|async)\"\n [fixedInViewport]=\"true\"\n >\n <ng-content select=\"[slot=mat-sidenav]\"></ng-content>\n </mat-sidenav>\n <mat-sidenav-content #sidenavContent>\n <ng-content select=\"[slot=mat-sidenav-content]\"></ng-content>\n </mat-sidenav-content>\n</mat-sidenav-container>\n" }]
|
|
429
|
+
}], ctorParameters: () => [{ type: DdrMatSidenavService }], propDecorators: { sidenav: [{
|
|
349
430
|
type: ViewChild,
|
|
350
431
|
args: ['sidenav', { static: true }]
|
|
351
432
|
}], stayOpenOnLargeScreen: [{
|
|
352
433
|
type: Input
|
|
353
434
|
}] } });
|
|
354
435
|
|
|
355
|
-
class
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
/**
|
|
362
|
-
* @override
|
|
363
|
-
*/
|
|
364
|
-
ngOnInit() {
|
|
365
|
-
this.valueChangesSubscription = this.formControl.valueChanges
|
|
366
|
-
.pipe(debounce(() => interval(this.bouncePeriod)))
|
|
367
|
-
.subscribe((value => this.filterChanged.emit(value)));
|
|
368
|
-
}
|
|
369
|
-
/**
|
|
370
|
-
* @override
|
|
371
|
-
*/
|
|
372
|
-
ngOnDestroy() {
|
|
373
|
-
this.valueChangesSubscription.unsubscribe();
|
|
374
|
-
}
|
|
375
|
-
/**
|
|
376
|
-
* @override
|
|
377
|
-
*/
|
|
378
|
-
ngAfterContentInit() {
|
|
379
|
-
this.inputElement.nativeElement.focus();
|
|
436
|
+
class DdrMatSidenavToggleComponent {
|
|
437
|
+
sidenavService;
|
|
438
|
+
visible;
|
|
439
|
+
constructor(sidenavService) {
|
|
440
|
+
this.sidenavService = sidenavService;
|
|
441
|
+
this.visible = toSignal(this.sidenavService.watchToggleVisible(), { initialValue: false });
|
|
380
442
|
}
|
|
381
|
-
|
|
382
|
-
this.
|
|
383
|
-
this.filterChanged.emit(undefined);
|
|
443
|
+
toggleSidenav() {
|
|
444
|
+
this.sidenavService.toggle();
|
|
384
445
|
}
|
|
385
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
386
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.
|
|
446
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatSidenavToggleComponent, deps: [{ token: DdrMatSidenavService }], target: i0.ɵɵFactoryTarget.Component });
|
|
447
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.1", type: DdrMatSidenavToggleComponent, isStandalone: true, selector: "ddr-mat-sidenav-toggle", host: { properties: { "style.display": "visible() ? \"block\" : \"none\"" } }, ngImport: i0, template: `
|
|
448
|
+
<button mat-icon-button (click)="toggleSidenav()">
|
|
449
|
+
<mat-icon>menu</mat-icon>
|
|
450
|
+
</button>`, isInline: true, dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
387
451
|
}
|
|
388
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
452
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatSidenavToggleComponent, decorators: [{
|
|
389
453
|
type: Component,
|
|
390
|
-
args: [{
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
this.document = document;
|
|
407
|
-
this.themeConfig = themeConfig;
|
|
408
|
-
}
|
|
409
|
-
init() {
|
|
410
|
-
const lightMetaElement = this.findOrCreateThemeColorMetaElement('(prefers-color-scheme: light)', this.themeConfig.themeColorLight);
|
|
411
|
-
const darkMetaElement = this.findOrCreateThemeColorMetaElement('(prefers-color-scheme: dark)', this.themeConfig.themeColorDark);
|
|
412
|
-
fromEvent(this.document, 'scroll')
|
|
413
|
-
.pipe(map(() => this.document.documentElement.scrollTop > 0), distinctUntilChanged()).subscribe((scrolled) => {
|
|
414
|
-
this.document.body.classList.toggle('ddr-mat-scrolled', scrolled);
|
|
415
|
-
lightMetaElement.content = scrolled ? this.themeConfig.themeColorLightScrolled : this.themeConfig.themeColorLight;
|
|
416
|
-
darkMetaElement.content = scrolled ? this.themeConfig.themeColorDarkScrolled : this.themeConfig.themeColorDark;
|
|
417
|
-
});
|
|
418
|
-
}
|
|
419
|
-
findOrCreateThemeColorMetaElement(media, content) {
|
|
420
|
-
let metaElement = this.document.head.querySelector(`meta[name="theme-color"][media="${media}"]`);
|
|
421
|
-
if (null == metaElement) {
|
|
422
|
-
metaElement = this.createThemeColorMetaElement(media, content);
|
|
423
|
-
}
|
|
424
|
-
return metaElement;
|
|
425
|
-
}
|
|
426
|
-
createThemeColorMetaElement(media, content) {
|
|
427
|
-
const metaElement = this.document.createElement('meta');
|
|
428
|
-
metaElement.name = 'theme-color';
|
|
429
|
-
metaElement.media = media;
|
|
430
|
-
metaElement.content = content;
|
|
431
|
-
this.document.head.appendChild(metaElement);
|
|
432
|
-
return metaElement;
|
|
433
|
-
}
|
|
434
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: ThemeScrollService, deps: [{ token: DOCUMENT }, { token: DDR_MATERIAL_EXTENSIONS_THEME }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
435
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: ThemeScrollService });
|
|
436
|
-
}
|
|
437
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: ThemeScrollService, decorators: [{
|
|
438
|
-
type: Injectable
|
|
439
|
-
}], ctorParameters: () => [{ type: Document, decorators: [{
|
|
440
|
-
type: Inject,
|
|
441
|
-
args: [DOCUMENT]
|
|
442
|
-
}] }, { type: undefined, decorators: [{
|
|
443
|
-
type: Inject,
|
|
444
|
-
args: [DDR_MATERIAL_EXTENSIONS_THEME]
|
|
445
|
-
}] }] });
|
|
454
|
+
args: [{
|
|
455
|
+
selector: 'ddr-mat-sidenav-toggle',
|
|
456
|
+
template: `
|
|
457
|
+
<button mat-icon-button (click)="toggleSidenav()">
|
|
458
|
+
<mat-icon>menu</mat-icon>
|
|
459
|
+
</button>`,
|
|
460
|
+
imports: [
|
|
461
|
+
MatIcon,
|
|
462
|
+
MatIconButton
|
|
463
|
+
],
|
|
464
|
+
host: {
|
|
465
|
+
'[style.display]': 'visible() ? "block" : "none"'
|
|
466
|
+
},
|
|
467
|
+
changeDetection: ChangeDetectionStrategy.OnPush
|
|
468
|
+
}]
|
|
469
|
+
}], ctorParameters: () => [{ type: DdrMatSidenavService }] });
|
|
446
470
|
|
|
447
|
-
class
|
|
471
|
+
class DdrMatToolbarFixedTopDirective {
|
|
448
472
|
el;
|
|
449
473
|
ddrMatToolbarFixedTop = '';
|
|
450
474
|
constructor(el) {
|
|
@@ -464,151 +488,18 @@ class ToolbarFixedTopDirective {
|
|
|
464
488
|
});
|
|
465
489
|
}
|
|
466
490
|
}
|
|
467
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
468
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.
|
|
491
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatToolbarFixedTopDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
492
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.1", type: DdrMatToolbarFixedTopDirective, isStandalone: true, selector: "[ddrMatToolbarFixedTop]", inputs: { ddrMatToolbarFixedTop: "ddrMatToolbarFixedTop" }, ngImport: i0 });
|
|
469
493
|
}
|
|
470
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
494
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.1", ngImport: i0, type: DdrMatToolbarFixedTopDirective, decorators: [{
|
|
471
495
|
type: Directive,
|
|
472
496
|
args: [{
|
|
473
|
-
selector: '[ddrMatToolbarFixedTop]'
|
|
474
|
-
standalone: false
|
|
497
|
+
selector: '[ddrMatToolbarFixedTop]'
|
|
475
498
|
}]
|
|
476
499
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { ddrMatToolbarFixedTop: [{
|
|
477
500
|
type: Input
|
|
478
501
|
}] } });
|
|
479
502
|
|
|
480
|
-
class FabFixedDirective {
|
|
481
|
-
el;
|
|
482
|
-
constructor(el) {
|
|
483
|
-
this.el = el;
|
|
484
|
-
}
|
|
485
|
-
/**
|
|
486
|
-
* @override
|
|
487
|
-
*/
|
|
488
|
-
ngOnInit() {
|
|
489
|
-
const container = document.createElement('div');
|
|
490
|
-
container.classList.add('ddr-mat-fab-fixed-container');
|
|
491
|
-
this.el.nativeElement.parentElement.insertBefore(container, this.el.nativeElement);
|
|
492
|
-
container.appendChild(this.el.nativeElement);
|
|
493
|
-
}
|
|
494
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: FabFixedDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
495
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: FabFixedDirective, isStandalone: false, selector: "[ddrMatFabFixed]", ngImport: i0 });
|
|
496
|
-
}
|
|
497
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: FabFixedDirective, decorators: [{
|
|
498
|
-
type: Directive,
|
|
499
|
-
args: [{
|
|
500
|
-
selector: '[ddrMatFabFixed]',
|
|
501
|
-
standalone: false
|
|
502
|
-
}]
|
|
503
|
-
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
504
|
-
|
|
505
|
-
class DdrMaterialExtensionsModule {
|
|
506
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: DdrMaterialExtensionsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
507
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.5", ngImport: i0, type: DdrMaterialExtensionsModule, declarations: [FabFixedDirective,
|
|
508
|
-
FilterComponent,
|
|
509
|
-
SidenavToggleComponent,
|
|
510
|
-
GridTileLazyImageContainerDirective,
|
|
511
|
-
GridTileLazyImgDirective,
|
|
512
|
-
SidenavContainerComponent,
|
|
513
|
-
ToolbarFixedTopDirective], imports: [CommonModule,
|
|
514
|
-
MatCardModule,
|
|
515
|
-
MatSidenavModule,
|
|
516
|
-
MatIconModule,
|
|
517
|
-
MatInputModule,
|
|
518
|
-
MatButtonModule,
|
|
519
|
-
MatFormFieldModule,
|
|
520
|
-
MatToolbarModule,
|
|
521
|
-
ReactiveFormsModule], exports: [FabFixedDirective,
|
|
522
|
-
FilterComponent,
|
|
523
|
-
SidenavToggleComponent,
|
|
524
|
-
GridTileLazyImageContainerDirective,
|
|
525
|
-
GridTileLazyImgDirective,
|
|
526
|
-
SidenavContainerComponent,
|
|
527
|
-
ToolbarFixedTopDirective] });
|
|
528
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: DdrMaterialExtensionsModule, providers: [
|
|
529
|
-
ThemeScrollService,
|
|
530
|
-
{
|
|
531
|
-
provide: ENVIRONMENT_INITIALIZER,
|
|
532
|
-
multi: true,
|
|
533
|
-
useValue() {
|
|
534
|
-
inject(ThemeScrollService).init();
|
|
535
|
-
}
|
|
536
|
-
},
|
|
537
|
-
{
|
|
538
|
-
provide: DDR_MATERIAL_EXTENSIONS_THEME,
|
|
539
|
-
multi: false,
|
|
540
|
-
useValue: {
|
|
541
|
-
themeColorLight: '#fdfbff',
|
|
542
|
-
themeColorDark: '#1a1b1f',
|
|
543
|
-
themeColorLightScrolled: '#efedf1',
|
|
544
|
-
themeColorDarkScrolled: '#1e1f23',
|
|
545
|
-
}
|
|
546
|
-
}
|
|
547
|
-
], imports: [CommonModule,
|
|
548
|
-
MatCardModule,
|
|
549
|
-
MatSidenavModule,
|
|
550
|
-
MatIconModule,
|
|
551
|
-
MatInputModule,
|
|
552
|
-
MatButtonModule,
|
|
553
|
-
MatFormFieldModule,
|
|
554
|
-
MatToolbarModule,
|
|
555
|
-
ReactiveFormsModule] });
|
|
556
|
-
}
|
|
557
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: DdrMaterialExtensionsModule, decorators: [{
|
|
558
|
-
type: NgModule,
|
|
559
|
-
args: [{
|
|
560
|
-
declarations: [
|
|
561
|
-
FabFixedDirective,
|
|
562
|
-
FilterComponent,
|
|
563
|
-
SidenavToggleComponent,
|
|
564
|
-
GridTileLazyImageContainerDirective,
|
|
565
|
-
GridTileLazyImgDirective,
|
|
566
|
-
SidenavContainerComponent,
|
|
567
|
-
ToolbarFixedTopDirective
|
|
568
|
-
],
|
|
569
|
-
imports: [
|
|
570
|
-
CommonModule,
|
|
571
|
-
MatCardModule,
|
|
572
|
-
MatSidenavModule,
|
|
573
|
-
MatIconModule,
|
|
574
|
-
MatInputModule,
|
|
575
|
-
MatButtonModule,
|
|
576
|
-
MatFormFieldModule,
|
|
577
|
-
MatToolbarModule,
|
|
578
|
-
ReactiveFormsModule
|
|
579
|
-
],
|
|
580
|
-
exports: [
|
|
581
|
-
FabFixedDirective,
|
|
582
|
-
FilterComponent,
|
|
583
|
-
SidenavToggleComponent,
|
|
584
|
-
GridTileLazyImageContainerDirective,
|
|
585
|
-
GridTileLazyImgDirective,
|
|
586
|
-
SidenavContainerComponent,
|
|
587
|
-
ToolbarFixedTopDirective
|
|
588
|
-
],
|
|
589
|
-
providers: [
|
|
590
|
-
ThemeScrollService,
|
|
591
|
-
{
|
|
592
|
-
provide: ENVIRONMENT_INITIALIZER,
|
|
593
|
-
multi: true,
|
|
594
|
-
useValue() {
|
|
595
|
-
inject(ThemeScrollService).init();
|
|
596
|
-
}
|
|
597
|
-
},
|
|
598
|
-
{
|
|
599
|
-
provide: DDR_MATERIAL_EXTENSIONS_THEME,
|
|
600
|
-
multi: false,
|
|
601
|
-
useValue: {
|
|
602
|
-
themeColorLight: '#fdfbff',
|
|
603
|
-
themeColorDark: '#1a1b1f',
|
|
604
|
-
themeColorLightScrolled: '#efedf1',
|
|
605
|
-
themeColorDarkScrolled: '#1e1f23',
|
|
606
|
-
}
|
|
607
|
-
}
|
|
608
|
-
]
|
|
609
|
-
}]
|
|
610
|
-
}] });
|
|
611
|
-
|
|
612
503
|
/*
|
|
613
504
|
* Public API Surface of ngx-material-extensions
|
|
614
505
|
*/
|
|
@@ -617,5 +508,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImpor
|
|
|
617
508
|
* Generated bundle index. Do not edit.
|
|
618
509
|
*/
|
|
619
510
|
|
|
620
|
-
export {
|
|
511
|
+
export { DDR_MAT_THEME, DdrMatFabFixedDirective, DdrMatFilterComponent, DdrMatGridTileLazyImageContainerDirective, DdrMatGridTileLazyImgDirective, DdrMatSidenavContainerComponent, DdrMatSidenavService, DdrMatSidenavToggleComponent, DdrMatToolbarFixedTopDirective, provideDdrMaterialExtensions };
|
|
621
512
|
//# sourceMappingURL=dontdrinkandroot-ngx-material-extensions.mjs.map
|