@net7/boilerplate-dataviz 5.2.3 → 5.2.5
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/esm2022/lib/components/card/card.mjs +3 -3
- package/esm2022/lib/components/card-state-wrapper/card-state-wrapper.mjs +3 -3
- package/esm2022/lib/components/card-text-item/card-text-item.mjs +3 -3
- package/esm2022/lib/components/data-widget-wrapper/data-widget-wrapper.mjs +3 -3
- package/esm2022/lib/components/datepicker-wrapper/datepicker-wrapper.mjs +3 -3
- package/esm2022/lib/layout/card-example-layout/card-example-layout.mjs +3 -3
- package/esm2022/lib/layout/example-layout/example-layout.mjs +3 -3
- package/esm2022/lib/n7-boilerplate-dataviz.module.mjs +4 -4
- package/fesm2022/net7-boilerplate-dataviz.mjs +25 -25
- package/package.json +1 -1
|
@@ -5,10 +5,10 @@ import * as i2 from "@net7/components";
|
|
|
5
5
|
import * as i3 from "../card-state-wrapper/card-state-wrapper";
|
|
6
6
|
import * as i4 from "../card-text-item/card-text-item";
|
|
7
7
|
export class CardComponent {
|
|
8
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
9
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
8
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CardComponent, selector: "dv-card", inputs: { data: "data", emit: "emit" }, ngImport: i0, template: "<div *ngIf=\"data\"\n class=\"dv-card {{ data.classes || '' }}\">\n <dv-card-state-wrapper [state$]=\"data.state$[data.id]\"\n [stateComponents]=\"data.stateComponents[data.id]\">\n <ng-container *ngFor=\"let area of ['header', 'content', 'footer']\">\n <div *ngIf=\"data[area]\"\n class=\"dv-card__{{ area }}\">\n <ng-container *ngFor=\"let section of data[area].sections\">\n <dv-card-state-wrapper [state$]=\"data.state$[section.id]\"\n [stateComponents]=\"section.stateComponents\">\n <section class=\"dv-card__section {{ section.classes || '' }}\">\n <ng-container *ngTemplateOutlet=\"blocks; context: { $implicit: section.items }\"></ng-container>\n </section>\n </dv-card-state-wrapper>\n </ng-container>\n </div>\n </ng-container>\n </dv-card-state-wrapper>\n</div>\n\n<ng-template #blocks\n let-items>\n <ng-container *ngFor=\"let item of items\">\n <dv-card-state-wrapper [state$]=\"data.state$[item.id]\"\n [stateComponents]=\"data.stateComponents[item.id]\">\n <div class=\"{{ 'dv-card__item dv-card__' + item.type }}\">\n <!-- TEXT -->\n <ng-container *ngIf=\"item.type === 'text'\">\n <dv-card-text-item [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></dv-card-text-item>\n </ng-container>\n\n <!-- DATA WIDGET -->\n <ng-container *ngIf=\"item.type === 'data-widget'\">\n <n7-data-widget [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\">\n </n7-data-widget>\n </ng-container>\n\n <!-- TABLE -->\n <ng-container *ngIf=\"item.type === 'table'\">\n <n7-table [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-table>\n </ng-container>\n\n <!-- INNER TITLE -->\n <ng-container *ngIf=\"item.type === 'inner-title'\">\n <n7-inner-title [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-inner-title>\n </ng-container>\n\n <!-- SELECT -->\n <ng-container *ngIf=\"item.type === 'select'\">\n <n7-input-select [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-input-select>\n </ng-container>\n\n <!-- APEX CHARTS -->\n <ng-container *ngIf=\"item.type.includes('apex')\">\n <n7-chart [data]=\"data.widgets[item.id].ds.out$ | async\"></n7-chart>\n </ng-container>\n\n <!-- MAP -->\n <ng-container *ngIf=\"item.type === 'map'\">\n <n7-map [data]=\"data.widgets[item.id].ds.out$ | async\"></n7-map>\n </ng-container>\n </div>\n </dv-card-state-wrapper>\n </ng-container>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.ChartComponent, selector: "n7-chart", inputs: ["data", "emit"] }, { kind: "component", type: i2.DataWidgetComponent, selector: "n7-data-widget", inputs: ["data", "emit"] }, { kind: "component", type: i2.InnerTitleComponent, selector: "n7-inner-title", inputs: ["data", "emit"] }, { kind: "component", type: i2.InputSelectComponent, selector: "n7-input-select", inputs: ["data", "emit"] }, { kind: "component", type: i2.MapComponent, selector: "n7-map", inputs: ["data", "emit"] }, { kind: "component", type: i2.TableComponent, selector: "n7-table", inputs: ["data", "emit"] }, { kind: "component", type: i3.CardStateWrapperComponent, selector: "dv-card-state-wrapper", inputs: ["state$", "stateComponents"] }, { kind: "component", type: i4.CardTextItemComponent, selector: "dv-card-text-item", inputs: ["data", "emit"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
|
|
10
10
|
}
|
|
11
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
11
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardComponent, decorators: [{
|
|
12
12
|
type: Component,
|
|
13
13
|
args: [{ selector: 'dv-card', template: "<div *ngIf=\"data\"\n class=\"dv-card {{ data.classes || '' }}\">\n <dv-card-state-wrapper [state$]=\"data.state$[data.id]\"\n [stateComponents]=\"data.stateComponents[data.id]\">\n <ng-container *ngFor=\"let area of ['header', 'content', 'footer']\">\n <div *ngIf=\"data[area]\"\n class=\"dv-card__{{ area }}\">\n <ng-container *ngFor=\"let section of data[area].sections\">\n <dv-card-state-wrapper [state$]=\"data.state$[section.id]\"\n [stateComponents]=\"section.stateComponents\">\n <section class=\"dv-card__section {{ section.classes || '' }}\">\n <ng-container *ngTemplateOutlet=\"blocks; context: { $implicit: section.items }\"></ng-container>\n </section>\n </dv-card-state-wrapper>\n </ng-container>\n </div>\n </ng-container>\n </dv-card-state-wrapper>\n</div>\n\n<ng-template #blocks\n let-items>\n <ng-container *ngFor=\"let item of items\">\n <dv-card-state-wrapper [state$]=\"data.state$[item.id]\"\n [stateComponents]=\"data.stateComponents[item.id]\">\n <div class=\"{{ 'dv-card__item dv-card__' + item.type }}\">\n <!-- TEXT -->\n <ng-container *ngIf=\"item.type === 'text'\">\n <dv-card-text-item [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></dv-card-text-item>\n </ng-container>\n\n <!-- DATA WIDGET -->\n <ng-container *ngIf=\"item.type === 'data-widget'\">\n <n7-data-widget [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\">\n </n7-data-widget>\n </ng-container>\n\n <!-- TABLE -->\n <ng-container *ngIf=\"item.type === 'table'\">\n <n7-table [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-table>\n </ng-container>\n\n <!-- INNER TITLE -->\n <ng-container *ngIf=\"item.type === 'inner-title'\">\n <n7-inner-title [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-inner-title>\n </ng-container>\n\n <!-- SELECT -->\n <ng-container *ngIf=\"item.type === 'select'\">\n <n7-input-select [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-input-select>\n </ng-container>\n\n <!-- APEX CHARTS -->\n <ng-container *ngIf=\"item.type.includes('apex')\">\n <n7-chart [data]=\"data.widgets[item.id].ds.out$ | async\"></n7-chart>\n </ng-container>\n\n <!-- MAP -->\n <ng-container *ngIf=\"item.type === 'map'\">\n <n7-map [data]=\"data.widgets[item.id].ds.out$ | async\"></n7-map>\n </ng-container>\n </div>\n </dv-card-state-wrapper>\n </ng-container>\n</ng-template>\n" }]
|
|
14
14
|
}], propDecorators: { data: [{
|
|
@@ -31,10 +31,10 @@ export class CardStateWrapperComponent {
|
|
|
31
31
|
}
|
|
32
32
|
});
|
|
33
33
|
}
|
|
34
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
35
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
34
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardStateWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
35
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CardStateWrapperComponent, selector: "dv-card-state-wrapper", inputs: { state$: "state$", stateComponents: "stateComponents" }, viewQueries: [{ propertyName: "loading", first: true, predicate: ["loading"], descendants: true, read: ViewContainerRef }, { propertyName: "empty", first: true, predicate: ["empty"], descendants: true, read: ViewContainerRef }, { propertyName: "error", first: true, predicate: ["error"], descendants: true, read: ViewContainerRef }, { propertyName: "idle", first: true, predicate: ["idle"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<ng-container *ngIf=\"(state$ | async) as state\">\n <ng-container [ngSwitch]=\"state\">\n <ng-container *ngSwitchCase=\"'idle'\">\n <ng-container #idle></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'loading'\">\n <ng-container #loading></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'empty'\">\n <ng-container #empty></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'success'\">\n <!-- card content -->\n <ng-content></ng-content>\n <!-- ------------ -->\n </ng-container>\n </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
|
|
36
36
|
}
|
|
37
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
37
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardStateWrapperComponent, decorators: [{
|
|
38
38
|
type: Component,
|
|
39
39
|
args: [{ selector: 'dv-card-state-wrapper', template: "<ng-container *ngIf=\"(state$ | async) as state\">\n <ng-container [ngSwitch]=\"state\">\n <ng-container *ngSwitchCase=\"'idle'\">\n <ng-container #idle></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'loading'\">\n <ng-container #loading></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'empty'\">\n <ng-container #empty></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'success'\">\n <!-- card content -->\n <ng-content></ng-content>\n <!-- ------------ -->\n </ng-container>\n </ng-container>\n</ng-container>\n" }]
|
|
40
40
|
}], propDecorators: { state$: [{
|
|
@@ -7,10 +7,10 @@ export class CardTextItemComponent {
|
|
|
7
7
|
return;
|
|
8
8
|
this.emit('click', payload);
|
|
9
9
|
}
|
|
10
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
11
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
10
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardTextItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CardTextItemComponent, selector: "dv-card-text-item", inputs: { data: "data", emit: "emit" }, ngImport: i0, template: "<div *ngIf=\"data\" class=\"dv-card-text-item {{ data.classes || '' }}\">\n <span [innerHTML]=\"data.text\" (click)=\"onClick(data.payload)\"></span>\n</div>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
12
12
|
}
|
|
13
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
13
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardTextItemComponent, decorators: [{
|
|
14
14
|
type: Component,
|
|
15
15
|
args: [{ selector: 'dv-card-text-item', template: "<div *ngIf=\"data\" class=\"dv-card-text-item {{ data.classes || '' }}\">\n <span [innerHTML]=\"data.text\" (click)=\"onClick(data.payload)\"></span>\n</div>" }]
|
|
16
16
|
}], propDecorators: { data: [{
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { Component, Input } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
3
|
export class DataWidgetWrapperComponent {
|
|
4
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
5
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
4
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DataWidgetWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DataWidgetWrapperComponent, selector: "dv-data-widget-wrapper", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"dv-data-widget-wrapper {{ data && data.classes || '' }}\">\n <ng-content></ng-content>\n</div>" }); }
|
|
6
6
|
}
|
|
7
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
7
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DataWidgetWrapperComponent, decorators: [{
|
|
8
8
|
type: Component,
|
|
9
9
|
args: [{ selector: 'dv-data-widget-wrapper', template: "<div class=\"dv-data-widget-wrapper {{ data && data.classes || '' }}\">\n <ng-content></ng-content>\n</div>" }]
|
|
10
10
|
}], propDecorators: { data: [{
|
|
@@ -13,10 +13,10 @@ export class DatepickerWrapperComponent {
|
|
|
13
13
|
return;
|
|
14
14
|
this.emit('toggle', payload);
|
|
15
15
|
}
|
|
16
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
17
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
16
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DatepickerWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
17
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DatepickerWrapperComponent, selector: "dv-datepicker-wrapper", inputs: { data: "data", emit: "emit" }, ngImport: i0, template: "<div *ngIf=\"data\" class=\"dv-datepicker-wrapper {{ data.select.classes || '' }}\">\n <div class=\"dv-datepicker-wrapper__label\" (click)=\"toggleDropDown(data.payload)\">\n <input type=\"text\" [value]=\"data.select.label\" [readOnly]=\"true\"/>\n <span class=\"{{data.select.icon}}\"></span>\n </div>\n <div class=\"dv-datepicker-wrapper__dropdown\" [hidden]=\"data.select.hidden\">\n <ul class=\"dv-datepicker-wrapper__dropdown-list\">\n <li class=\"dv-datepicker-wrapper__dropdown-list-option {{ opt.classes || '' }}\" *ngFor=\"let opt of data.select.items\" (click)=\"onClick(opt.payload)\">{{opt.text}}</li>\n </ul>\n </div>\n <n7-datepicker\n [data]=\"data.datepicker.data\"\n [emit]=\"emit\">\n </n7-datepicker>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.DatepickerComponent, selector: "n7-datepicker", inputs: ["data", "emit"] }] }); }
|
|
18
18
|
}
|
|
19
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
19
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DatepickerWrapperComponent, decorators: [{
|
|
20
20
|
type: Component,
|
|
21
21
|
args: [{ selector: 'dv-datepicker-wrapper', template: "<div *ngIf=\"data\" class=\"dv-datepicker-wrapper {{ data.select.classes || '' }}\">\n <div class=\"dv-datepicker-wrapper__label\" (click)=\"toggleDropDown(data.payload)\">\n <input type=\"text\" [value]=\"data.select.label\" [readOnly]=\"true\"/>\n <span class=\"{{data.select.icon}}\"></span>\n </div>\n <div class=\"dv-datepicker-wrapper__dropdown\" [hidden]=\"data.select.hidden\">\n <ul class=\"dv-datepicker-wrapper__dropdown-list\">\n <li class=\"dv-datepicker-wrapper__dropdown-list-option {{ opt.classes || '' }}\" *ngFor=\"let opt of data.select.items\" (click)=\"onClick(opt.payload)\">{{opt.text}}</li>\n </ul>\n </div>\n <n7-datepicker\n [data]=\"data.datepicker.data\"\n [emit]=\"emit\">\n </n7-datepicker>\n</div>\n" }]
|
|
22
22
|
}], propDecorators: { data: [{
|
|
@@ -34,10 +34,10 @@ export class DvCardExampleLayoutComponent extends AbstractLayout {
|
|
|
34
34
|
ngOnDestroy() {
|
|
35
35
|
this.onDestroy();
|
|
36
36
|
}
|
|
37
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
38
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
37
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DvCardExampleLayoutComponent, deps: [{ token: i1.LayoutsConfigurationService }, { token: i1.ConfigurationService }, { token: i1.CommunicationService }, { token: i2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
38
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DvCardExampleLayoutComponent, selector: "dv-card-example-layout", usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"lb.dataSource && lb.dataSource.cards\" class=\"dv-card-example-layout\">\n <ng-container *ngFor=\"let card of lb.dataSource.cards\">\n <dv-card [data]=\"card\"></dv-card>\n </ng-container>\n</div>", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.CardComponent, selector: "dv-card", inputs: ["data", "emit"] }] }); }
|
|
39
39
|
}
|
|
40
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
40
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DvCardExampleLayoutComponent, decorators: [{
|
|
41
41
|
type: Component,
|
|
42
42
|
args: [{ selector: 'dv-card-example-layout', template: "<div *ngIf=\"lb.dataSource && lb.dataSource.cards\" class=\"dv-card-example-layout\">\n <ng-container *ngFor=\"let card of lb.dataSource.cards\">\n <dv-card [data]=\"card\"></dv-card>\n </ng-container>\n</div>" }]
|
|
43
43
|
}], ctorParameters: () => [{ type: i1.LayoutsConfigurationService }, { type: i1.ConfigurationService }, { type: i1.CommunicationService }, { type: i2.ActivatedRoute }] });
|
|
@@ -20,10 +20,10 @@ export class DvExampleLayoutComponent extends AbstractLayout {
|
|
|
20
20
|
ngOnDestroy() {
|
|
21
21
|
this.onDestroy();
|
|
22
22
|
}
|
|
23
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
24
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
23
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DvExampleLayoutComponent, deps: [{ token: i1.CommunicationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
24
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DvExampleLayoutComponent, selector: "dv-example-layout", usesInheritance: true, ngImport: i0, template: "<div class=\"dv-example-layout\" id=\"example-layout\">\n <h2>Grid component</h2>\n <p>Four columns equal width</p>\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/204\" />\n </div>\n </n7-grid>\n\n <br />\n\n <p>Two columns, first is 33%</p>\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/600\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/600/600\" />\n </div>\n </n7-grid>\n\n <p>Nested grids</p>\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/500\" />\n </div>\n <div class=\"n7-grid__item\">\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/204\" />\n </div>\n </n7-grid>\n </div>\n </n7-grid>\n\n <h2>Container component</h2>\n <p>Full width container</p>\n <n7-container classes=\"big-container-class\">Container content</n7-container>\n <n7-container classes=\"big-container-class\" fluid=\"true\">\n Container fluid content\n </n7-container>\n\n <h2>Combined components</h2>\n <p>Container with grids inside</p>\n <n7-container classes=\"big-container-class\">\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/500\" />\n </div>\n <div class=\"n7-grid__item\">\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/204\" />\n </div>\n </n7-grid>\n </div>\n </n7-grid>\n </n7-container>\n\n\n <h2>Side scroller component</h2>\n \n <n7-container classes=\"big-container-class\" fluid=\"true\">\n <n7-side-scroller>\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n </n7-side-scroller>\n </n7-container>\n\n <!-- Data widget wrapper with not-fixed height, two rows -->\n <!-- <dv-data-widget-wrapper>\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title\n [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget\n [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-chart\n [data]=\"lb.widgets['dv-graph'].ds.out$ | async\">\n </n7-chart>\n </div>\n </div>\n </dv-data-widget-wrapper> -->\n\n <!-- Data widget wrapper with fixed height, two rows -->\n <!-- <dv-data-widget-wrapper\n [data]=\"{ classes: 'dv-data-widget-wrapper-fixed-height' }\"\n >\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n <div class=\"dv-data-widget-wrapper__content-row\">Row content</div>\n </div>\n </dv-data-widget-wrapper> -->\n\n <!-- Data widget wrapper with fixed height, one row -->\n <!-- <dv-data-widget-wrapper\n [data]=\"{ classes: 'dv-data-widget-wrapper-fixed-height' }\"\n >\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n </div>\n </dv-data-widget-wrapper>\n\n <dv-datepicker-wrapper\n [data]=\"lb.widgets['dv-datepicker-wrapper'].ds.out$ | async\"\n [emit]=\"lb.widgets['dv-datepicker-wrapper'].emit\"\n >\n </dv-datepicker-wrapper> -->\n</div>\n", dependencies: [{ kind: "component", type: i1.GridComponent, selector: "n7-grid", inputs: ["templateColumns", "classes"] }, { kind: "component", type: i1.ContainerComponent, selector: "n7-container", inputs: ["fluid", "classes"] }, { kind: "component", type: i1.SideScrollerComponent, selector: "n7-side-scroller", inputs: ["classes"] }] }); }
|
|
25
25
|
}
|
|
26
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
26
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DvExampleLayoutComponent, decorators: [{
|
|
27
27
|
type: Component,
|
|
28
28
|
args: [{ selector: 'dv-example-layout', template: "<div class=\"dv-example-layout\" id=\"example-layout\">\n <h2>Grid component</h2>\n <p>Four columns equal width</p>\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/204\" />\n </div>\n </n7-grid>\n\n <br />\n\n <p>Two columns, first is 33%</p>\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/600\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/600/600\" />\n </div>\n </n7-grid>\n\n <p>Nested grids</p>\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/500\" />\n </div>\n <div class=\"n7-grid__item\">\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/204\" />\n </div>\n </n7-grid>\n </div>\n </n7-grid>\n\n <h2>Container component</h2>\n <p>Full width container</p>\n <n7-container classes=\"big-container-class\">Container content</n7-container>\n <n7-container classes=\"big-container-class\" fluid=\"true\">\n Container fluid content\n </n7-container>\n\n <h2>Combined components</h2>\n <p>Container with grids inside</p>\n <n7-container classes=\"big-container-class\">\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/500\" />\n </div>\n <div class=\"n7-grid__item\">\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/204\" />\n </div>\n </n7-grid>\n </div>\n </n7-grid>\n </n7-container>\n\n\n <h2>Side scroller component</h2>\n \n <n7-container classes=\"big-container-class\" fluid=\"true\">\n <n7-side-scroller>\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n </n7-side-scroller>\n </n7-container>\n\n <!-- Data widget wrapper with not-fixed height, two rows -->\n <!-- <dv-data-widget-wrapper>\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title\n [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget\n [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-chart\n [data]=\"lb.widgets['dv-graph'].ds.out$ | async\">\n </n7-chart>\n </div>\n </div>\n </dv-data-widget-wrapper> -->\n\n <!-- Data widget wrapper with fixed height, two rows -->\n <!-- <dv-data-widget-wrapper\n [data]=\"{ classes: 'dv-data-widget-wrapper-fixed-height' }\"\n >\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n <div class=\"dv-data-widget-wrapper__content-row\">Row content</div>\n </div>\n </dv-data-widget-wrapper> -->\n\n <!-- Data widget wrapper with fixed height, one row -->\n <!-- <dv-data-widget-wrapper\n [data]=\"{ classes: 'dv-data-widget-wrapper-fixed-height' }\"\n >\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n </div>\n </dv-data-widget-wrapper>\n\n <dv-datepicker-wrapper\n [data]=\"lb.widgets['dv-datepicker-wrapper'].ds.out$ | async\"\n [emit]=\"lb.widgets['dv-datepicker-wrapper'].emit\"\n >\n </dv-datepicker-wrapper> -->\n</div>\n" }]
|
|
29
29
|
}], ctorParameters: () => [{ type: i1.CommunicationService }] });
|
|
@@ -23,8 +23,8 @@ const COMPONENTS = [
|
|
|
23
23
|
DvCardExampleLayoutComponent
|
|
24
24
|
];
|
|
25
25
|
export class N7BoilerplateDatavizModule {
|
|
26
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
27
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.
|
|
26
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: N7BoilerplateDatavizModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
27
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: N7BoilerplateDatavizModule, declarations: [DataWidgetWrapperComponent,
|
|
28
28
|
DatepickerWrapperComponent,
|
|
29
29
|
CardComponent,
|
|
30
30
|
CardStateWrapperComponent,
|
|
@@ -39,11 +39,11 @@ export class N7BoilerplateDatavizModule {
|
|
|
39
39
|
CardTextItemComponent,
|
|
40
40
|
DvExampleLayoutComponent,
|
|
41
41
|
DvCardExampleLayoutComponent] }); }
|
|
42
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.
|
|
42
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: N7BoilerplateDatavizModule, imports: [CommonModule,
|
|
43
43
|
DvComponentsLibModule,
|
|
44
44
|
N7BoilerplateCommonModule] }); }
|
|
45
45
|
}
|
|
46
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
46
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: N7BoilerplateDatavizModule, decorators: [{
|
|
47
47
|
type: NgModule,
|
|
48
48
|
args: [{
|
|
49
49
|
declarations: COMPONENTS,
|
|
@@ -13,10 +13,10 @@ import { BehaviorSubject, forkJoin } from 'rxjs';
|
|
|
13
13
|
import * as i2$1 from '@angular/router';
|
|
14
14
|
|
|
15
15
|
class DataWidgetWrapperComponent {
|
|
16
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
17
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
16
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DataWidgetWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
17
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DataWidgetWrapperComponent, selector: "dv-data-widget-wrapper", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"dv-data-widget-wrapper {{ data && data.classes || '' }}\">\n <ng-content></ng-content>\n</div>" }); }
|
|
18
18
|
}
|
|
19
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
19
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DataWidgetWrapperComponent, decorators: [{
|
|
20
20
|
type: Component,
|
|
21
21
|
args: [{ selector: 'dv-data-widget-wrapper', template: "<div class=\"dv-data-widget-wrapper {{ data && data.classes || '' }}\">\n <ng-content></ng-content>\n</div>" }]
|
|
22
22
|
}], propDecorators: { data: [{
|
|
@@ -34,10 +34,10 @@ class DatepickerWrapperComponent {
|
|
|
34
34
|
return;
|
|
35
35
|
this.emit('toggle', payload);
|
|
36
36
|
}
|
|
37
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
38
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
37
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DatepickerWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
38
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DatepickerWrapperComponent, selector: "dv-datepicker-wrapper", inputs: { data: "data", emit: "emit" }, ngImport: i0, template: "<div *ngIf=\"data\" class=\"dv-datepicker-wrapper {{ data.select.classes || '' }}\">\n <div class=\"dv-datepicker-wrapper__label\" (click)=\"toggleDropDown(data.payload)\">\n <input type=\"text\" [value]=\"data.select.label\" [readOnly]=\"true\"/>\n <span class=\"{{data.select.icon}}\"></span>\n </div>\n <div class=\"dv-datepicker-wrapper__dropdown\" [hidden]=\"data.select.hidden\">\n <ul class=\"dv-datepicker-wrapper__dropdown-list\">\n <li class=\"dv-datepicker-wrapper__dropdown-list-option {{ opt.classes || '' }}\" *ngFor=\"let opt of data.select.items\" (click)=\"onClick(opt.payload)\">{{opt.text}}</li>\n </ul>\n </div>\n <n7-datepicker\n [data]=\"data.datepicker.data\"\n [emit]=\"emit\">\n </n7-datepicker>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.DatepickerComponent, selector: "n7-datepicker", inputs: ["data", "emit"] }] }); }
|
|
39
39
|
}
|
|
40
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
40
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DatepickerWrapperComponent, decorators: [{
|
|
41
41
|
type: Component,
|
|
42
42
|
args: [{ selector: 'dv-datepicker-wrapper', template: "<div *ngIf=\"data\" class=\"dv-datepicker-wrapper {{ data.select.classes || '' }}\">\n <div class=\"dv-datepicker-wrapper__label\" (click)=\"toggleDropDown(data.payload)\">\n <input type=\"text\" [value]=\"data.select.label\" [readOnly]=\"true\"/>\n <span class=\"{{data.select.icon}}\"></span>\n </div>\n <div class=\"dv-datepicker-wrapper__dropdown\" [hidden]=\"data.select.hidden\">\n <ul class=\"dv-datepicker-wrapper__dropdown-list\">\n <li class=\"dv-datepicker-wrapper__dropdown-list-option {{ opt.classes || '' }}\" *ngFor=\"let opt of data.select.items\" (click)=\"onClick(opt.payload)\">{{opt.text}}</li>\n </ul>\n </div>\n <n7-datepicker\n [data]=\"data.datepicker.data\"\n [emit]=\"emit\">\n </n7-datepicker>\n</div>\n" }]
|
|
43
43
|
}], propDecorators: { data: [{
|
|
@@ -75,10 +75,10 @@ class CardStateWrapperComponent {
|
|
|
75
75
|
}
|
|
76
76
|
});
|
|
77
77
|
}
|
|
78
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
79
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
78
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardStateWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
79
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CardStateWrapperComponent, selector: "dv-card-state-wrapper", inputs: { state$: "state$", stateComponents: "stateComponents" }, viewQueries: [{ propertyName: "loading", first: true, predicate: ["loading"], descendants: true, read: ViewContainerRef }, { propertyName: "empty", first: true, predicate: ["empty"], descendants: true, read: ViewContainerRef }, { propertyName: "error", first: true, predicate: ["error"], descendants: true, read: ViewContainerRef }, { propertyName: "idle", first: true, predicate: ["idle"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<ng-container *ngIf=\"(state$ | async) as state\">\n <ng-container [ngSwitch]=\"state\">\n <ng-container *ngSwitchCase=\"'idle'\">\n <ng-container #idle></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'loading'\">\n <ng-container #loading></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'empty'\">\n <ng-container #empty></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'success'\">\n <!-- card content -->\n <ng-content></ng-content>\n <!-- ------------ -->\n </ng-container>\n </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
|
|
80
80
|
}
|
|
81
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
81
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardStateWrapperComponent, decorators: [{
|
|
82
82
|
type: Component,
|
|
83
83
|
args: [{ selector: 'dv-card-state-wrapper', template: "<ng-container *ngIf=\"(state$ | async) as state\">\n <ng-container [ngSwitch]=\"state\">\n <ng-container *ngSwitchCase=\"'idle'\">\n <ng-container #idle></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'loading'\">\n <ng-container #loading></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'empty'\">\n <ng-container #empty></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'success'\">\n <!-- card content -->\n <ng-content></ng-content>\n <!-- ------------ -->\n </ng-container>\n </ng-container>\n</ng-container>\n" }]
|
|
84
84
|
}], propDecorators: { state$: [{
|
|
@@ -105,10 +105,10 @@ class CardTextItemComponent {
|
|
|
105
105
|
return;
|
|
106
106
|
this.emit('click', payload);
|
|
107
107
|
}
|
|
108
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
109
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
108
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardTextItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
109
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CardTextItemComponent, selector: "dv-card-text-item", inputs: { data: "data", emit: "emit" }, ngImport: i0, template: "<div *ngIf=\"data\" class=\"dv-card-text-item {{ data.classes || '' }}\">\n <span [innerHTML]=\"data.text\" (click)=\"onClick(data.payload)\"></span>\n</div>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
110
110
|
}
|
|
111
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
111
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardTextItemComponent, decorators: [{
|
|
112
112
|
type: Component,
|
|
113
113
|
args: [{ selector: 'dv-card-text-item', template: "<div *ngIf=\"data\" class=\"dv-card-text-item {{ data.classes || '' }}\">\n <span [innerHTML]=\"data.text\" (click)=\"onClick(data.payload)\"></span>\n</div>" }]
|
|
114
114
|
}], propDecorators: { data: [{
|
|
@@ -118,10 +118,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
|
|
|
118
118
|
}] } });
|
|
119
119
|
|
|
120
120
|
class CardComponent {
|
|
121
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
122
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
121
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
122
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CardComponent, selector: "dv-card", inputs: { data: "data", emit: "emit" }, ngImport: i0, template: "<div *ngIf=\"data\"\n class=\"dv-card {{ data.classes || '' }}\">\n <dv-card-state-wrapper [state$]=\"data.state$[data.id]\"\n [stateComponents]=\"data.stateComponents[data.id]\">\n <ng-container *ngFor=\"let area of ['header', 'content', 'footer']\">\n <div *ngIf=\"data[area]\"\n class=\"dv-card__{{ area }}\">\n <ng-container *ngFor=\"let section of data[area].sections\">\n <dv-card-state-wrapper [state$]=\"data.state$[section.id]\"\n [stateComponents]=\"section.stateComponents\">\n <section class=\"dv-card__section {{ section.classes || '' }}\">\n <ng-container *ngTemplateOutlet=\"blocks; context: { $implicit: section.items }\"></ng-container>\n </section>\n </dv-card-state-wrapper>\n </ng-container>\n </div>\n </ng-container>\n </dv-card-state-wrapper>\n</div>\n\n<ng-template #blocks\n let-items>\n <ng-container *ngFor=\"let item of items\">\n <dv-card-state-wrapper [state$]=\"data.state$[item.id]\"\n [stateComponents]=\"data.stateComponents[item.id]\">\n <div class=\"{{ 'dv-card__item dv-card__' + item.type }}\">\n <!-- TEXT -->\n <ng-container *ngIf=\"item.type === 'text'\">\n <dv-card-text-item [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></dv-card-text-item>\n </ng-container>\n\n <!-- DATA WIDGET -->\n <ng-container *ngIf=\"item.type === 'data-widget'\">\n <n7-data-widget [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\">\n </n7-data-widget>\n </ng-container>\n\n <!-- TABLE -->\n <ng-container *ngIf=\"item.type === 'table'\">\n <n7-table [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-table>\n </ng-container>\n\n <!-- INNER TITLE -->\n <ng-container *ngIf=\"item.type === 'inner-title'\">\n <n7-inner-title [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-inner-title>\n </ng-container>\n\n <!-- SELECT -->\n <ng-container *ngIf=\"item.type === 'select'\">\n <n7-input-select [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-input-select>\n </ng-container>\n\n <!-- APEX CHARTS -->\n <ng-container *ngIf=\"item.type.includes('apex')\">\n <n7-chart [data]=\"data.widgets[item.id].ds.out$ | async\"></n7-chart>\n </ng-container>\n\n <!-- MAP -->\n <ng-container *ngIf=\"item.type === 'map'\">\n <n7-map [data]=\"data.widgets[item.id].ds.out$ | async\"></n7-map>\n </ng-container>\n </div>\n </dv-card-state-wrapper>\n </ng-container>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.ChartComponent, selector: "n7-chart", inputs: ["data", "emit"] }, { kind: "component", type: i2.DataWidgetComponent, selector: "n7-data-widget", inputs: ["data", "emit"] }, { kind: "component", type: i2.InnerTitleComponent, selector: "n7-inner-title", inputs: ["data", "emit"] }, { kind: "component", type: i2.InputSelectComponent, selector: "n7-input-select", inputs: ["data", "emit"] }, { kind: "component", type: i2.MapComponent, selector: "n7-map", inputs: ["data", "emit"] }, { kind: "component", type: i2.TableComponent, selector: "n7-table", inputs: ["data", "emit"] }, { kind: "component", type: CardStateWrapperComponent, selector: "dv-card-state-wrapper", inputs: ["state$", "stateComponents"] }, { kind: "component", type: CardTextItemComponent, selector: "dv-card-text-item", inputs: ["data", "emit"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
|
|
123
123
|
}
|
|
124
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
124
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardComponent, decorators: [{
|
|
125
125
|
type: Component,
|
|
126
126
|
args: [{ selector: 'dv-card', template: "<div *ngIf=\"data\"\n class=\"dv-card {{ data.classes || '' }}\">\n <dv-card-state-wrapper [state$]=\"data.state$[data.id]\"\n [stateComponents]=\"data.stateComponents[data.id]\">\n <ng-container *ngFor=\"let area of ['header', 'content', 'footer']\">\n <div *ngIf=\"data[area]\"\n class=\"dv-card__{{ area }}\">\n <ng-container *ngFor=\"let section of data[area].sections\">\n <dv-card-state-wrapper [state$]=\"data.state$[section.id]\"\n [stateComponents]=\"section.stateComponents\">\n <section class=\"dv-card__section {{ section.classes || '' }}\">\n <ng-container *ngTemplateOutlet=\"blocks; context: { $implicit: section.items }\"></ng-container>\n </section>\n </dv-card-state-wrapper>\n </ng-container>\n </div>\n </ng-container>\n </dv-card-state-wrapper>\n</div>\n\n<ng-template #blocks\n let-items>\n <ng-container *ngFor=\"let item of items\">\n <dv-card-state-wrapper [state$]=\"data.state$[item.id]\"\n [stateComponents]=\"data.stateComponents[item.id]\">\n <div class=\"{{ 'dv-card__item dv-card__' + item.type }}\">\n <!-- TEXT -->\n <ng-container *ngIf=\"item.type === 'text'\">\n <dv-card-text-item [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></dv-card-text-item>\n </ng-container>\n\n <!-- DATA WIDGET -->\n <ng-container *ngIf=\"item.type === 'data-widget'\">\n <n7-data-widget [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\">\n </n7-data-widget>\n </ng-container>\n\n <!-- TABLE -->\n <ng-container *ngIf=\"item.type === 'table'\">\n <n7-table [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-table>\n </ng-container>\n\n <!-- INNER TITLE -->\n <ng-container *ngIf=\"item.type === 'inner-title'\">\n <n7-inner-title [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-inner-title>\n </ng-container>\n\n <!-- SELECT -->\n <ng-container *ngIf=\"item.type === 'select'\">\n <n7-input-select [data]=\"data.widgets[item.id].ds.out$ | async\"\n [emit]=\"data.widgets[item.id].emit\"></n7-input-select>\n </ng-container>\n\n <!-- APEX CHARTS -->\n <ng-container *ngIf=\"item.type.includes('apex')\">\n <n7-chart [data]=\"data.widgets[item.id].ds.out$ | async\"></n7-chart>\n </ng-container>\n\n <!-- MAP -->\n <ng-container *ngIf=\"item.type === 'map'\">\n <n7-map [data]=\"data.widgets[item.id].ds.out$ | async\"></n7-map>\n </ng-container>\n </div>\n </dv-card-state-wrapper>\n </ng-container>\n</ng-template>\n" }]
|
|
127
127
|
}], propDecorators: { data: [{
|
|
@@ -716,10 +716,10 @@ class DvExampleLayoutComponent extends AbstractLayout {
|
|
|
716
716
|
ngOnDestroy() {
|
|
717
717
|
this.onDestroy();
|
|
718
718
|
}
|
|
719
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
720
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
719
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DvExampleLayoutComponent, deps: [{ token: i1$1.CommunicationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
720
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DvExampleLayoutComponent, selector: "dv-example-layout", usesInheritance: true, ngImport: i0, template: "<div class=\"dv-example-layout\" id=\"example-layout\">\n <h2>Grid component</h2>\n <p>Four columns equal width</p>\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/204\" />\n </div>\n </n7-grid>\n\n <br />\n\n <p>Two columns, first is 33%</p>\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/600\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/600/600\" />\n </div>\n </n7-grid>\n\n <p>Nested grids</p>\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/500\" />\n </div>\n <div class=\"n7-grid__item\">\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/204\" />\n </div>\n </n7-grid>\n </div>\n </n7-grid>\n\n <h2>Container component</h2>\n <p>Full width container</p>\n <n7-container classes=\"big-container-class\">Container content</n7-container>\n <n7-container classes=\"big-container-class\" fluid=\"true\">\n Container fluid content\n </n7-container>\n\n <h2>Combined components</h2>\n <p>Container with grids inside</p>\n <n7-container classes=\"big-container-class\">\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/500\" />\n </div>\n <div class=\"n7-grid__item\">\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/204\" />\n </div>\n </n7-grid>\n </div>\n </n7-grid>\n </n7-container>\n\n\n <h2>Side scroller component</h2>\n \n <n7-container classes=\"big-container-class\" fluid=\"true\">\n <n7-side-scroller>\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n </n7-side-scroller>\n </n7-container>\n\n <!-- Data widget wrapper with not-fixed height, two rows -->\n <!-- <dv-data-widget-wrapper>\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title\n [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget\n [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-chart\n [data]=\"lb.widgets['dv-graph'].ds.out$ | async\">\n </n7-chart>\n </div>\n </div>\n </dv-data-widget-wrapper> -->\n\n <!-- Data widget wrapper with fixed height, two rows -->\n <!-- <dv-data-widget-wrapper\n [data]=\"{ classes: 'dv-data-widget-wrapper-fixed-height' }\"\n >\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n <div class=\"dv-data-widget-wrapper__content-row\">Row content</div>\n </div>\n </dv-data-widget-wrapper> -->\n\n <!-- Data widget wrapper with fixed height, one row -->\n <!-- <dv-data-widget-wrapper\n [data]=\"{ classes: 'dv-data-widget-wrapper-fixed-height' }\"\n >\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n </div>\n </dv-data-widget-wrapper>\n\n <dv-datepicker-wrapper\n [data]=\"lb.widgets['dv-datepicker-wrapper'].ds.out$ | async\"\n [emit]=\"lb.widgets['dv-datepicker-wrapper'].emit\"\n >\n </dv-datepicker-wrapper> -->\n</div>\n", dependencies: [{ kind: "component", type: i1$1.GridComponent, selector: "n7-grid", inputs: ["templateColumns", "classes"] }, { kind: "component", type: i1$1.ContainerComponent, selector: "n7-container", inputs: ["fluid", "classes"] }, { kind: "component", type: i1$1.SideScrollerComponent, selector: "n7-side-scroller", inputs: ["classes"] }] }); }
|
|
721
721
|
}
|
|
722
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
722
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DvExampleLayoutComponent, decorators: [{
|
|
723
723
|
type: Component,
|
|
724
724
|
args: [{ selector: 'dv-example-layout', template: "<div class=\"dv-example-layout\" id=\"example-layout\">\n <h2>Grid component</h2>\n <p>Four columns equal width</p>\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/204\" />\n </div>\n </n7-grid>\n\n <br />\n\n <p>Two columns, first is 33%</p>\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/600\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/600/600\" />\n </div>\n </n7-grid>\n\n <p>Nested grids</p>\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/500\" />\n </div>\n <div class=\"n7-grid__item\">\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/204\" />\n </div>\n </n7-grid>\n </div>\n </n7-grid>\n\n <h2>Container component</h2>\n <p>Full width container</p>\n <n7-container classes=\"big-container-class\">Container content</n7-container>\n <n7-container classes=\"big-container-class\" fluid=\"true\">\n Container fluid content\n </n7-container>\n\n <h2>Combined components</h2>\n <p>Container with grids inside</p>\n <n7-container classes=\"big-container-class\">\n <n7-grid templateColumns=\"33% 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/300/500\" />\n </div>\n <div class=\"n7-grid__item\">\n <n7-grid templateColumns=\"1fr 1fr 1fr 1fr\" classes=\"custom-grid\">\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/200\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/201\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/199\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/198\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/197\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/195\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/203\" />\n </div>\n <div class=\"n7-grid__item\">\n <img src=\"http://placekitten.com/200/204\" />\n </div>\n </n7-grid>\n </div>\n </n7-grid>\n </n7-container>\n\n\n <h2>Side scroller component</h2>\n \n <n7-container classes=\"big-container-class\" fluid=\"true\">\n <n7-side-scroller>\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n <img src=\"http://placekitten.com/200/204\" />\n </n7-side-scroller>\n </n7-container>\n\n <!-- Data widget wrapper with not-fixed height, two rows -->\n <!-- <dv-data-widget-wrapper>\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title\n [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget\n [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-chart\n [data]=\"lb.widgets['dv-graph'].ds.out$ | async\">\n </n7-chart>\n </div>\n </div>\n </dv-data-widget-wrapper> -->\n\n <!-- Data widget wrapper with fixed height, two rows -->\n <!-- <dv-data-widget-wrapper\n [data]=\"{ classes: 'dv-data-widget-wrapper-fixed-height' }\"\n >\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n <div class=\"dv-data-widget-wrapper__content-row\">Row content</div>\n </div>\n </dv-data-widget-wrapper> -->\n\n <!-- Data widget wrapper with fixed height, one row -->\n <!-- <dv-data-widget-wrapper\n [data]=\"{ classes: 'dv-data-widget-wrapper-fixed-height' }\"\n >\n <div class=\"dv-data-widget-wrapper__title\">\n <n7-inner-title [data]=\"lb.widgets['dv-inner-title'].ds.out$ | async\">\n </n7-inner-title>\n </div>\n <div class=\"dv-data-widget-wrapper__content\">\n <div class=\"dv-data-widget-wrapper__content-row\">\n <n7-data-widget [data]=\"lb.widgets['dv-widget'].ds.out$ | async\">\n </n7-data-widget>\n </div>\n </div>\n </dv-data-widget-wrapper>\n\n <dv-datepicker-wrapper\n [data]=\"lb.widgets['dv-datepicker-wrapper'].ds.out$ | async\"\n [emit]=\"lb.widgets['dv-datepicker-wrapper'].emit\"\n >\n </dv-datepicker-wrapper> -->\n</div>\n" }]
|
|
725
725
|
}], ctorParameters: () => [{ type: i1$1.CommunicationService }] });
|
|
@@ -986,10 +986,10 @@ class DvCardExampleLayoutComponent extends AbstractLayout {
|
|
|
986
986
|
ngOnDestroy() {
|
|
987
987
|
this.onDestroy();
|
|
988
988
|
}
|
|
989
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
990
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
989
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DvCardExampleLayoutComponent, deps: [{ token: i1$1.LayoutsConfigurationService }, { token: i1$1.ConfigurationService }, { token: i1$1.CommunicationService }, { token: i2$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
990
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DvCardExampleLayoutComponent, selector: "dv-card-example-layout", usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"lb.dataSource && lb.dataSource.cards\" class=\"dv-card-example-layout\">\n <ng-container *ngFor=\"let card of lb.dataSource.cards\">\n <dv-card [data]=\"card\"></dv-card>\n </ng-container>\n</div>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CardComponent, selector: "dv-card", inputs: ["data", "emit"] }] }); }
|
|
991
991
|
}
|
|
992
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
992
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DvCardExampleLayoutComponent, decorators: [{
|
|
993
993
|
type: Component,
|
|
994
994
|
args: [{ selector: 'dv-card-example-layout', template: "<div *ngIf=\"lb.dataSource && lb.dataSource.cards\" class=\"dv-card-example-layout\">\n <ng-container *ngFor=\"let card of lb.dataSource.cards\">\n <dv-card [data]=\"card\"></dv-card>\n </ng-container>\n</div>" }]
|
|
995
995
|
}], ctorParameters: () => [{ type: i1$1.LayoutsConfigurationService }, { type: i1$1.ConfigurationService }, { type: i1$1.CommunicationService }, { type: i2$1.ActivatedRoute }] });
|
|
@@ -1005,8 +1005,8 @@ const COMPONENTS = [
|
|
|
1005
1005
|
DvCardExampleLayoutComponent
|
|
1006
1006
|
];
|
|
1007
1007
|
class N7BoilerplateDatavizModule {
|
|
1008
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1009
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.
|
|
1008
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: N7BoilerplateDatavizModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1009
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: N7BoilerplateDatavizModule, declarations: [DataWidgetWrapperComponent,
|
|
1010
1010
|
DatepickerWrapperComponent,
|
|
1011
1011
|
CardComponent,
|
|
1012
1012
|
CardStateWrapperComponent,
|
|
@@ -1021,11 +1021,11 @@ class N7BoilerplateDatavizModule {
|
|
|
1021
1021
|
CardTextItemComponent,
|
|
1022
1022
|
DvExampleLayoutComponent,
|
|
1023
1023
|
DvCardExampleLayoutComponent] }); }
|
|
1024
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.
|
|
1024
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: N7BoilerplateDatavizModule, imports: [CommonModule,
|
|
1025
1025
|
DvComponentsLibModule,
|
|
1026
1026
|
N7BoilerplateCommonModule] }); }
|
|
1027
1027
|
}
|
|
1028
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1028
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: N7BoilerplateDatavizModule, decorators: [{
|
|
1029
1029
|
type: NgModule,
|
|
1030
1030
|
args: [{
|
|
1031
1031
|
declarations: COMPONENTS,
|