angular-dumb-lib 0.0.20 → 0.0.22
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/fesm2022/angular-dumb-lib.mjs +106 -106
- package/fesm2022/angular-dumb-lib.mjs.map +1 -1
- package/lib/angular-dumb-lib.component.d.ts +1 -1
- package/lib/angular-dumb-lib.module.d.ts +1 -1
- package/package.json +3 -5
- package/esm2022/angular-dumb-lib.mjs +0 -5
- package/esm2022/lib/angular-dumb-lib.component.mjs +0 -20
- package/esm2022/lib/angular-dumb-lib.module.mjs +0 -22
- package/esm2022/lib/angular-dumb-lib.service.mjs +0 -15
- package/esm2022/lib/components/atoms/button/button.component.mjs +0 -34
- package/esm2022/lib/components/atoms/datetime-picker/datetime-picker.component.mjs +0 -58
- package/esm2022/lib/components/atoms/file-selection/file-selection.component.mjs +0 -85
- package/esm2022/lib/components/atoms/input/input.component.mjs +0 -57
- package/esm2022/lib/components/atoms/loading/loading.component.mjs +0 -37
- package/esm2022/lib/components/atoms/menu-widget/menu-widget.component.mjs +0 -36
- package/esm2022/lib/components/atoms/scroll-to-top/scroll-to-top.component.mjs +0 -22
- package/esm2022/lib/components/atoms/selection/selection.component.mjs +0 -92
- package/esm2022/lib/components/atoms/slider/slider.component.mjs +0 -42
- package/esm2022/lib/components/atoms/tags/tags.component.mjs +0 -62
- package/esm2022/lib/components/molecules/cards/cards.component.mjs +0 -30
- package/esm2022/lib/components/molecules/content-design/content-design.component.mjs +0 -48
- package/esm2022/lib/components/molecules/form/form.component.mjs +0 -73
- package/esm2022/lib/components/molecules/formated-text/formated-text.component.mjs +0 -40
- package/esm2022/lib/components/molecules/modal/modal.component.mjs +0 -49
- package/esm2022/lib/components/molecules/paginator/paginator.component.mjs +0 -120
- package/esm2022/lib/components/molecules/table/table.component.mjs +0 -51
- package/esm2022/lib/components/pages/detail/detail.component.mjs +0 -22
- package/esm2022/lib/components/pages/footer/footer.component.mjs +0 -15
- package/esm2022/lib/components/pages/login/login.component.mjs +0 -29
- package/esm2022/lib/components/pages/menu/menu.component.mjs +0 -125
- package/esm2022/lib/components/pages/version/version.component.mjs +0 -26
- package/esm2022/lib/shared/constants/constant.mjs +0 -6
- package/esm2022/lib/shared/enums/enum.mjs +0 -86
- package/esm2022/lib/shared/interfaces/interface.mjs +0 -2
- package/esm2022/lib/shared/utils/common.utils.mjs +0 -42
- package/esm2022/public-api.mjs +0 -31
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, Component, NgModule, EventEmitter,
|
|
2
|
+
import { Injectable, Component, NgModule, EventEmitter, Output, Input, forwardRef, ContentChild, ViewChild, HostListener } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import * as i2 from '@angular/forms';
|
|
6
|
-
import {
|
|
6
|
+
import { FormsModule, NG_VALUE_ACCESSOR, ReactiveFormsModule } from '@angular/forms';
|
|
7
7
|
import { Subject, takeUntil } from 'rxjs';
|
|
8
8
|
import * as i1$1 from '@angular/platform-browser';
|
|
9
9
|
import * as i2$1 from 'primeng/table';
|
|
@@ -14,25 +14,25 @@ import { RouterModule } from '@angular/router';
|
|
|
14
14
|
|
|
15
15
|
class AngularDumbLibService {
|
|
16
16
|
constructor() { }
|
|
17
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
18
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
17
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: AngularDumbLibService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
18
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: AngularDumbLibService, providedIn: 'root' }); }
|
|
19
19
|
}
|
|
20
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: AngularDumbLibService, decorators: [{
|
|
21
21
|
type: Injectable,
|
|
22
22
|
args: [{
|
|
23
23
|
providedIn: 'root'
|
|
24
24
|
}]
|
|
25
|
-
}], ctorParameters:
|
|
25
|
+
}], ctorParameters: () => [] });
|
|
26
26
|
|
|
27
27
|
class AngularDumbLibComponent {
|
|
28
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
29
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
28
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: AngularDumbLibComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
29
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: AngularDumbLibComponent, isStandalone: true, selector: "lib-angular-dumb-lib", ngImport: i0, template: `
|
|
30
30
|
<p>
|
|
31
31
|
angular-dumb-lib works!
|
|
32
32
|
</p>
|
|
33
33
|
`, isInline: true }); }
|
|
34
34
|
}
|
|
35
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
35
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: AngularDumbLibComponent, decorators: [{
|
|
36
36
|
type: Component,
|
|
37
37
|
args: [{ selector: 'lib-angular-dumb-lib', template: `
|
|
38
38
|
<p>
|
|
@@ -42,17 +42,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
42
42
|
}] });
|
|
43
43
|
|
|
44
44
|
class AngularDumbLibModule {
|
|
45
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
46
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
47
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
45
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: AngularDumbLibModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
46
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.4", ngImport: i0, type: AngularDumbLibModule, imports: [AngularDumbLibComponent], exports: [AngularDumbLibComponent] }); }
|
|
47
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: AngularDumbLibModule }); }
|
|
48
48
|
}
|
|
49
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
49
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: AngularDumbLibModule, decorators: [{
|
|
50
50
|
type: NgModule,
|
|
51
51
|
args: [{
|
|
52
|
-
declarations: [
|
|
53
|
-
|
|
52
|
+
declarations: [],
|
|
53
|
+
imports: [
|
|
54
|
+
AngularDumbLibComponent
|
|
54
55
|
],
|
|
55
|
-
imports: [],
|
|
56
56
|
exports: [
|
|
57
57
|
AngularDumbLibComponent,
|
|
58
58
|
]
|
|
@@ -161,13 +161,13 @@ class ButtonComponent {
|
|
|
161
161
|
onButtonClick() {
|
|
162
162
|
this.clickEvent.emit();
|
|
163
163
|
}
|
|
164
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
165
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
164
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
165
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: ButtonComponent, isStandalone: true, selector: "app-button", inputs: { config: "config" }, outputs: { clickEvent: "clickEvent" }, ngImport: i0, template: "<button\n type=\"{{config.type}}\"\n class=\"btn btn-primary\"\n [disabled]=\"config.isDisabled\"\n [ngClass]=\"{'active': config.isActive,\n 'normal': config.designType === 'normal',\n 'contrast': config.designType === 'contrast'}\"\n (click)=\"onButtonClick()\">\n <div class=\"button-content\">\n <ng-container *ngIf=\"config.iconValue\">\n <i class=\"material-icons\" data-toggle=\"tooltip\" title=\"Delete\">{{config.iconValue}}</i>\n </ng-container>\n <span>{{ config.label }}</span>\n </div>\n</button>\n", styles: ["button.btn.btn-primary{padding:.5rem 1rem;border:none;border-radius:50px;cursor:pointer;height:3rem}button.btn.btn-primary .button-content{display:flex;flex-direction:row;justify-content:center;align-items:center;height:100%}button.btn.btn-primary:disabled{background-color:#ccc!important;color:#666!important;cursor:not-allowed!important;border-color:#666!important}button.btn.btn-primary.normal{background-color:#f6ad15;color:#fff}button.btn.btn-primary.normal:hover:not(:disabled){background-color:#e09a14}button.btn.btn-primary.contrast{color:#f6ad15;border:1px solid #d58f13}button.btn.btn-primary.contrast:hover:not(:disabled){background-color:#f4d87e;color:#1a1a1a}button.btn.btn-primary.active{background-color:#e09a14;color:#fff}button.btn.btn-primary.active:hover:not(:disabled){background-color:#e09a14;color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
166
166
|
}
|
|
167
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
167
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
168
168
|
type: Component,
|
|
169
169
|
args: [{ selector: 'app-button', standalone: true, imports: [CommonModule], template: "<button\n type=\"{{config.type}}\"\n class=\"btn btn-primary\"\n [disabled]=\"config.isDisabled\"\n [ngClass]=\"{'active': config.isActive,\n 'normal': config.designType === 'normal',\n 'contrast': config.designType === 'contrast'}\"\n (click)=\"onButtonClick()\">\n <div class=\"button-content\">\n <ng-container *ngIf=\"config.iconValue\">\n <i class=\"material-icons\" data-toggle=\"tooltip\" title=\"Delete\">{{config.iconValue}}</i>\n </ng-container>\n <span>{{ config.label }}</span>\n </div>\n</button>\n", styles: ["button.btn.btn-primary{padding:.5rem 1rem;border:none;border-radius:50px;cursor:pointer;height:3rem}button.btn.btn-primary .button-content{display:flex;flex-direction:row;justify-content:center;align-items:center;height:100%}button.btn.btn-primary:disabled{background-color:#ccc!important;color:#666!important;cursor:not-allowed!important;border-color:#666!important}button.btn.btn-primary.normal{background-color:#f6ad15;color:#fff}button.btn.btn-primary.normal:hover:not(:disabled){background-color:#e09a14}button.btn.btn-primary.contrast{color:#f6ad15;border:1px solid #d58f13}button.btn.btn-primary.contrast:hover:not(:disabled){background-color:#f4d87e;color:#1a1a1a}button.btn.btn-primary.active{background-color:#e09a14;color:#fff}button.btn.btn-primary.active:hover:not(:disabled){background-color:#e09a14;color:#fff}\n"] }]
|
|
170
|
-
}], ctorParameters:
|
|
170
|
+
}], ctorParameters: () => [], propDecorators: { config: [{
|
|
171
171
|
type: Input
|
|
172
172
|
}], clickEvent: [{
|
|
173
173
|
type: Output
|
|
@@ -180,17 +180,17 @@ class ScrollToTopComponent {
|
|
|
180
180
|
scrollToTop() {
|
|
181
181
|
const element = document.querySelector('.content');
|
|
182
182
|
element?.scrollIntoView({
|
|
183
|
-
behavior: 'smooth',
|
|
183
|
+
behavior: 'smooth', // Enables smooth scrolling
|
|
184
184
|
block: 'start' // Scrolls to the top of the element
|
|
185
185
|
});
|
|
186
186
|
}
|
|
187
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
188
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
187
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ScrollToTopComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
188
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: ScrollToTopComponent, isStandalone: true, selector: "app-scroll-to-top", ngImport: i0, template: "<button (click)=\"scrollToTop()\">\n <span class=\"material-icons\">arrow_upward</span>\n</button>\n", styles: ["button{position:fixed;bottom:20px;right:20px;width:50px;height:50px;border:none;background-color:#f6ad15;color:#fff;cursor:pointer;border-radius:50%;box-shadow:0 4px 8px #0000004d;display:flex;align-items:center;justify-content:center;transition:background-color .3s ease,box-shadow .3s ease;font-size:24px}button:hover{background-color:#e09a14;color:#fff;box-shadow:0 6px 12px #0006}button:active{box-shadow:0 2px 4px #0000004d}\n"] }); }
|
|
189
189
|
}
|
|
190
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
190
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ScrollToTopComponent, decorators: [{
|
|
191
191
|
type: Component,
|
|
192
|
-
args: [{ selector: 'app-scroll-to-top', standalone: true, template: "<button (click)=\"scrollToTop()\">\n <span class=\"material-icons\">arrow_upward</span>\n</button>\n", styles: ["button{position:fixed;bottom:20px;right:20px;width:50px;height:50px;border:none;background-color:#f6ad15;color:#fff;cursor:pointer;border-radius:50%;box-shadow:0 4px 8px #0000004d;display:flex;align-items:center;justify-content:center;transition:background-color .3s ease,box-shadow .3s ease;font-size:24px}button:hover{background-color:#e09a14;color:#fff;box-shadow:0 6px 12px #0006}button:active{
|
|
193
|
-
}], ctorParameters:
|
|
192
|
+
args: [{ selector: 'app-scroll-to-top', standalone: true, template: "<button (click)=\"scrollToTop()\">\n <span class=\"material-icons\">arrow_upward</span>\n</button>\n", styles: ["button{position:fixed;bottom:20px;right:20px;width:50px;height:50px;border:none;background-color:#f6ad15;color:#fff;cursor:pointer;border-radius:50%;box-shadow:0 4px 8px #0000004d;display:flex;align-items:center;justify-content:center;transition:background-color .3s ease,box-shadow .3s ease;font-size:24px}button:hover{background-color:#e09a14;color:#fff;box-shadow:0 6px 12px #0006}button:active{box-shadow:0 2px 4px #0000004d}\n"] }]
|
|
193
|
+
}], ctorParameters: () => [] });
|
|
194
194
|
|
|
195
195
|
class DatetimePickerComponent {
|
|
196
196
|
constructor() {
|
|
@@ -229,14 +229,14 @@ class DatetimePickerComponent {
|
|
|
229
229
|
this.onChange(new Date(dateTime));
|
|
230
230
|
}
|
|
231
231
|
}
|
|
232
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
233
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
232
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: DatetimePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
233
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: DatetimePickerComponent, isStandalone: true, selector: "app-datetime-picker", providers: [{
|
|
234
234
|
provide: NG_VALUE_ACCESSOR,
|
|
235
235
|
useExisting: forwardRef(() => DatetimePickerComponent),
|
|
236
236
|
multi: true
|
|
237
237
|
}], ngImport: i0, template: "<div class=\"datetime-picker-container\">\n <label for=\"date\">Datetime:</label>\n <div class=\"inputs-container\">\n <input id=\"date\" type=\"date\" [(ngModel)]=\"selectedDate\" (ngModelChange)=\"onDateChange($event)\" (blur)=\"onTouched()\">\n <input id=\"time\" type=\"time\" [(ngModel)]=\"selectedTime\" (ngModelChange)=\"onTimeChange($event)\" (blur)=\"onTouched()\">\n </div>\n</div>\n", styles: [".datetime-picker-container{display:flex;flex-direction:column;margin-bottom:1rem}.datetime-picker-container label{margin-bottom:.5rem;font-weight:700}.inputs-container{display:flex;gap:1rem}.inputs-container input[type=date],.inputs-container input[type=time]{padding:.5rem;font-size:1rem;border:1px solid #ccc;border-radius:4px;width:150px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
238
238
|
}
|
|
239
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
239
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: DatetimePickerComponent, decorators: [{
|
|
240
240
|
type: Component,
|
|
241
241
|
args: [{ selector: 'app-datetime-picker', standalone: true, providers: [{
|
|
242
242
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -298,14 +298,14 @@ class FileSelectionComponent {
|
|
|
298
298
|
setDisabledState(isDisabled) {
|
|
299
299
|
// Implement if you need to handle disabled state
|
|
300
300
|
}
|
|
301
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
302
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
301
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: FileSelectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
302
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: FileSelectionComponent, isStandalone: true, selector: "app-file-selection", inputs: { label: "label", chooseFileLabel: "chooseFileLabel", imageUrl: "imageUrl", fileName: "fileName" }, providers: [{
|
|
303
303
|
provide: NG_VALUE_ACCESSOR,
|
|
304
304
|
useExisting: forwardRef(() => FileSelectionComponent),
|
|
305
305
|
multi: true
|
|
306
306
|
}], ngImport: i0, template: "<div class=\"file-selector\">\n <label *ngIf=\"label\">{{ label }}</label>\n <input\n id=\"fileInput\"\n type=\"file\"\n (change)=\"onFileSelected($event)\"\n accept=\"image/*\"\n class=\"hidden-file-input\">\n <div class=\"file-selection\">\n <!-- Custom button to trigger file input -->\n <app-button [config]=\"config\"\n class=\"custom-file-button\"\n (clickEvent)=\"triggerFileInput()\">\n Select Image\n </app-button>\n <div *ngIf=\"fileName\" class=\"file-name\">\n {{ fileName }}\n </div>\n </div>\n\n <div *ngIf=\"imageUrl\">\n <img [src]=\"imageUrl\" alt=\"Selected Image\" class=\"preview-image\"/>\n </div>\n</div>\n", styles: [".file-selector{display:flex;flex-direction:column;align-items:flex-start}.file-selector label{font-size:14px;color:#666;margin-bottom:8px;font-weight:700}.file-selector input[type=file]{margin-bottom:16px}.file-selector .preview-image{max-width:150px;max-height:150px;border:1px solid #ccc;margin-top:8px}.file-selector .hidden-file-input{opacity:0;position:absolute;z-index:-1}.file-selector .file-selection{display:flex;align-items:center;gap:10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["config"], outputs: ["clickEvent"] }] }); }
|
|
307
307
|
}
|
|
308
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
308
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: FileSelectionComponent, decorators: [{
|
|
309
309
|
type: Component,
|
|
310
310
|
args: [{ selector: 'app-file-selection', standalone: true, providers: [{
|
|
311
311
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -353,21 +353,21 @@ class InputComponent {
|
|
|
353
353
|
...this.config,
|
|
354
354
|
};
|
|
355
355
|
}
|
|
356
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
357
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
356
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
357
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: InputComponent, isStandalone: true, selector: "app-input", inputs: { config: "config" }, providers: [{
|
|
358
358
|
provide: NG_VALUE_ACCESSOR,
|
|
359
359
|
useExisting: forwardRef(() => InputComponent),
|
|
360
360
|
multi: true
|
|
361
|
-
}], ngImport: i0, template: "<div class=\"input-item\" [ngClass]=\"config.direction\">\n <label *ngIf=\"config.label\">\n {{ config.label }}\n <span *ngIf=\"config.required\" class=\"required-indicator\">*</span>\n </label>\n\n <div class=\"input-container\">\n <input *ngIf=\"config.type !== 'textarea' && config.type !== 'richText' && config.type !== 'image'\"\n [type]=\"config.type\"\n [name]=\"config.name\"\n [required]=\"config.required
|
|
361
|
+
}], ngImport: i0, template: "<div class=\"input-item\" [ngClass]=\"config.direction\">\n <label *ngIf=\"config.label\">\n {{ config.label }}\n <span *ngIf=\"config.required\" class=\"required-indicator\">*</span>\n </label>\n\n <div class=\"input-container\">\n <input *ngIf=\"config.type !== 'textarea' && config.type !== 'richText' && config.type !== 'image'\"\n [type]=\"config.type\"\n [name]=\"config.name\"\n [required]=\"config.required!\"\n [(ngModel)]=\"value\"\n [placeholder] = \"config.placeholder\"\n [ngClass]=\"{'input-error': !config.isValid}\">\n <textarea *ngIf=\"config.type === 'textarea'\"\n [name]=\"config.name\"\n [required]=\"config.required!\"\n [(ngModel)]=\"value\"\n [placeholder] = \"config.placeholder\"\n [ngClass]=\"{'input-error': !config.isValid}\">\n </textarea>\n <i *ngIf=\"!config.isValid\" class=\"material-icons warning-icon\">error</i>\n </div>\n\n <div *ngIf=\"config.type === 'image'\">\n <img *ngIf=\"value\" [src]=\"value\" alt=\"Selected Image\" class=\"preview-image\"/>\n </div>\n</div>\n", styles: [".input-item{display:flex;width:100%;gap:10px}.input-item .input-container{display:flex;width:inherit}.input-item .input-container .input-error{border-color:red}.input-item label{display:flex;align-items:center}.input-item.horizontal{flex-direction:row}.input-item.horizontal label{width:30%}.input-item.vertical{flex-direction:column}.input-item .preview-image{max-width:150px;max-height:150px;border:1px solid #ccc;margin-top:8px}.input-item .required-indicator,.input-item .warning-icon{display:flex;align-items:center;color:red;margin-left:4px}.input-item .warning-icon{font-weight:700}.input-item input,.input-item textarea{padding:.5rem;border:1px solid #ccc;border-radius:.25rem;width:-webkit-fill-available}.input-item quill-editor{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
362
362
|
}
|
|
363
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
363
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: InputComponent, decorators: [{
|
|
364
364
|
type: Component,
|
|
365
365
|
args: [{ selector: 'app-input', standalone: true, providers: [{
|
|
366
366
|
provide: NG_VALUE_ACCESSOR,
|
|
367
367
|
useExisting: forwardRef(() => InputComponent),
|
|
368
368
|
multi: true
|
|
369
|
-
}], imports: [CommonModule, FormsModule], template: "<div class=\"input-item\" [ngClass]=\"config.direction\">\n <label *ngIf=\"config.label\">\n {{ config.label }}\n <span *ngIf=\"config.required\" class=\"required-indicator\">*</span>\n </label>\n\n <div class=\"input-container\">\n <input *ngIf=\"config.type !== 'textarea' && config.type !== 'richText' && config.type !== 'image'\"\n [type]=\"config.type\"\n [name]=\"config.name\"\n [required]=\"config.required
|
|
370
|
-
}], ctorParameters:
|
|
369
|
+
}], imports: [CommonModule, FormsModule], template: "<div class=\"input-item\" [ngClass]=\"config.direction\">\n <label *ngIf=\"config.label\">\n {{ config.label }}\n <span *ngIf=\"config.required\" class=\"required-indicator\">*</span>\n </label>\n\n <div class=\"input-container\">\n <input *ngIf=\"config.type !== 'textarea' && config.type !== 'richText' && config.type !== 'image'\"\n [type]=\"config.type\"\n [name]=\"config.name\"\n [required]=\"config.required!\"\n [(ngModel)]=\"value\"\n [placeholder] = \"config.placeholder\"\n [ngClass]=\"{'input-error': !config.isValid}\">\n <textarea *ngIf=\"config.type === 'textarea'\"\n [name]=\"config.name\"\n [required]=\"config.required!\"\n [(ngModel)]=\"value\"\n [placeholder] = \"config.placeholder\"\n [ngClass]=\"{'input-error': !config.isValid}\">\n </textarea>\n <i *ngIf=\"!config.isValid\" class=\"material-icons warning-icon\">error</i>\n </div>\n\n <div *ngIf=\"config.type === 'image'\">\n <img *ngIf=\"value\" [src]=\"value\" alt=\"Selected Image\" class=\"preview-image\"/>\n </div>\n</div>\n", styles: [".input-item{display:flex;width:100%;gap:10px}.input-item .input-container{display:flex;width:inherit}.input-item .input-container .input-error{border-color:red}.input-item label{display:flex;align-items:center}.input-item.horizontal{flex-direction:row}.input-item.horizontal label{width:30%}.input-item.vertical{flex-direction:column}.input-item .preview-image{max-width:150px;max-height:150px;border:1px solid #ccc;margin-top:8px}.input-item .required-indicator,.input-item .warning-icon{display:flex;align-items:center;color:red;margin-left:4px}.input-item .warning-icon{font-weight:700}.input-item input,.input-item textarea{padding:.5rem;border:1px solid #ccc;border-radius:.25rem;width:-webkit-fill-available}.input-item quill-editor{width:100%}\n"] }]
|
|
370
|
+
}], ctorParameters: () => [], propDecorators: { config: [{
|
|
371
371
|
type: Input
|
|
372
372
|
}] } });
|
|
373
373
|
|
|
@@ -390,13 +390,13 @@ class LoadingComponent {
|
|
|
390
390
|
break;
|
|
391
391
|
}
|
|
392
392
|
}
|
|
393
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
394
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
393
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
394
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: LoadingComponent, isStandalone: true, selector: "app-loading", inputs: { size: "size", imageSrc: "imageSrc" }, ngImport: i0, template: "<div [ngClass]=\"size\" class=\"loading-content\">\n <img [src]=\"loadingImage\" />\n</div>\n", styles: [":host{width:100%;height:100%;display:table;text-align:center}.loading-content{display:table-cell;vertical-align:middle}.xbig img{width:256px;height:256px}.big img{width:128px;height:128px}.medium img{width:64px;height:64px}.small img{width:32px;height:32px}.xsmall img{width:16px;height:16px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
395
395
|
}
|
|
396
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
396
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: LoadingComponent, decorators: [{
|
|
397
397
|
type: Component,
|
|
398
398
|
args: [{ selector: 'app-loading', standalone: true, imports: [CommonModule], template: "<div [ngClass]=\"size\" class=\"loading-content\">\n <img [src]=\"loadingImage\" />\n</div>\n", styles: [":host{width:100%;height:100%;display:table;text-align:center}.loading-content{display:table-cell;vertical-align:middle}.xbig img{width:256px;height:256px}.big img{width:128px;height:128px}.medium img{width:64px;height:64px}.small img{width:32px;height:32px}.xsmall img{width:16px;height:16px}\n"] }]
|
|
399
|
-
}], ctorParameters:
|
|
399
|
+
}], ctorParameters: () => [], propDecorators: { size: [{
|
|
400
400
|
type: Input
|
|
401
401
|
}], imageSrc: [{
|
|
402
402
|
type: Input
|
|
@@ -456,14 +456,14 @@ class SelectionComponent {
|
|
|
456
456
|
setDisabledState(isDisabled) {
|
|
457
457
|
// Implement if you need to handle disabled state
|
|
458
458
|
}
|
|
459
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
460
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
459
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: SelectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
460
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: SelectionComponent, isStandalone: true, selector: "app-selection", inputs: { label: "label", options: "options", selectedValue: "selectedValue", selectedValues: "selectedValues", isMultiSelect: "isMultiSelect", displayType: "displayType" }, outputs: { selectedChange: "selectedChange" }, providers: [{
|
|
461
461
|
provide: NG_VALUE_ACCESSOR,
|
|
462
462
|
useExisting: forwardRef(() => SelectionComponent),
|
|
463
463
|
multi: true
|
|
464
464
|
}], ngImport: i0, template: "<div class=\"dropdown\" *ngIf=\"displayType === 'dropdown'\">\n <label *ngIf=\"label\">{{ label }}</label>\n <select\n (change)=\"onSelectChange($event)\"\n [multiple]=\"isMultiSelect\"\n [(ngModel)]=\"value\">\n <option *ngFor=\"let option of options\"\n [value]=\"option.value\"\n [selected]=\"isSelected(option.value)\">\n {{ option.label }}\n </option>\n </select>\n</div>\n\n<div class=\"radio-group\" *ngIf=\"displayType === 'radio'\">\n <label *ngIf=\"label\">{{ label }}</label>\n <div *ngFor=\"let option of options\">\n <input\n type=\"radio\"\n [value]=\"option.value\"\n [checked]=\"option.value === selectedValue\"\n (change)=\"onSelectChange($event)\"\n name=\"radioGroup\"/>\n <label>{{ option.label }}</label>\n </div>\n</div>\n\n<div class=\"checkbox-group\" *ngIf=\"displayType === 'checkbox'\">\n <label *ngIf=\"label\">{{ label }}</label>\n <div *ngFor=\"let option of options\">\n <input\n type=\"checkbox\"\n [value]=\"option.value\"\n [checked]=\"isSelected(option.value)\"\n (change)=\"onMultiSelectChange($event)\"/>\n <label>{{ option.label }}</label>\n </div>\n</div>\n", styles: [".dropdown,.radio-group,.checkbox-group{display:flex;flex-direction:column;width:100%;min-width:150px}.dropdown label,.radio-group label,.checkbox-group label{font-size:12px;color:#666;margin-bottom:4px;font-weight:700}.dropdown select{width:100%;padding:9px 8px;font-size:12px;color:#333;background-color:#fff;border:1px solid #ccc;border-radius:4px;appearance:none;cursor:pointer;transition:border-color .3s,box-shadow .3s}.dropdown select:hover{border-color:#888}.dropdown select:focus{border-color:#03a9f4;box-shadow:0 0 5px #03a9f480;outline:none}.radio-group div,.checkbox-group div{display:flex;align-items:center;margin-bottom:8px}.radio-group input[type=radio],.checkbox-group input[type=checkbox]{margin-right:8px;cursor:pointer}.radio-group label,.checkbox-group label{font-size:12px;color:#333;cursor:pointer}.radio-group input[type=radio]:focus,.checkbox-group input[type=checkbox]:focus{outline:2px solid #03A9F4;outline-offset:2px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectMultipleControlValueAccessor, selector: "select[multiple][formControlName],select[multiple][formControl],select[multiple][ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
465
465
|
}
|
|
466
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
466
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: SelectionComponent, decorators: [{
|
|
467
467
|
type: Component,
|
|
468
468
|
args: [{ selector: 'app-selection', standalone: true, providers: [{
|
|
469
469
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -509,10 +509,10 @@ class SliderComponent {
|
|
|
509
509
|
nextSlide() {
|
|
510
510
|
this.currentIndex = this.currentIndex === this.images.length - 1 ? 0 : this.currentIndex + 1;
|
|
511
511
|
}
|
|
512
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
513
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
512
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: SliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
513
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: SliderComponent, isStandalone: true, selector: "app-slider", inputs: { images: "images", autoSlide: "autoSlide", slideInterval: "slideInterval" }, ngImport: i0, template: "<div class=\"slider-container\">\n <div class=\"slider-wrapper\">\n <div\n class=\"slide\"\n *ngFor=\"let image of images; let i = index\"\n [class.active]=\"i === currentIndex\"\n [ngStyle]=\"{'background-image': 'url(' + image + ')'}\">\n </div>\n </div>\n\n <!-- Navigation Buttons -->\n <button class=\"prev\" (click)=\"prevSlide()\">❮</button>\n <button class=\"next\" (click)=\"nextSlide()\">❯</button>\n</div>\n", styles: [".slider-container{position:relative;width:100%;margin:auto;overflow:hidden}.slider-wrapper{position:relative;width:100%;height:400px}.slide{position:absolute;width:100%;height:100%;background-size:cover;background-position:center;opacity:0;transition:opacity .5s ease-in-out}.slide.active{opacity:1}.prev,.next{position:absolute;top:50%;transform:translateY(-50%);background-color:#00000080;color:#fff;border:none;padding:10px;cursor:pointer;font-size:18px}.prev{left:10px}.next{right:10px}.prev:hover,.next:hover{background-color:#000c}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
514
514
|
}
|
|
515
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
515
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: SliderComponent, decorators: [{
|
|
516
516
|
type: Component,
|
|
517
517
|
args: [{ selector: 'app-slider', standalone: true, imports: [CommonModule], template: "<div class=\"slider-container\">\n <div class=\"slider-wrapper\">\n <div\n class=\"slide\"\n *ngFor=\"let image of images; let i = index\"\n [class.active]=\"i === currentIndex\"\n [ngStyle]=\"{'background-image': 'url(' + image + ')'}\">\n </div>\n </div>\n\n <!-- Navigation Buttons -->\n <button class=\"prev\" (click)=\"prevSlide()\">❮</button>\n <button class=\"next\" (click)=\"nextSlide()\">❯</button>\n</div>\n", styles: [".slider-container{position:relative;width:100%;margin:auto;overflow:hidden}.slider-wrapper{position:relative;width:100%;height:400px}.slide{position:absolute;width:100%;height:100%;background-size:cover;background-position:center;opacity:0;transition:opacity .5s ease-in-out}.slide.active{opacity:1}.prev,.next{position:absolute;top:50%;transform:translateY(-50%);background-color:#00000080;color:#fff;border:none;padding:10px;cursor:pointer;font-size:18px}.prev{left:10px}.next{right:10px}.prev:hover,.next:hover{background-color:#000c}\n"] }]
|
|
518
518
|
}], propDecorators: { images: [{
|
|
@@ -560,14 +560,14 @@ class TagsComponent {
|
|
|
560
560
|
this.filteredTags = this.availableTags.filter(tag => tag.toLowerCase().includes(this.searchText.toLowerCase()) &&
|
|
561
561
|
!this.selectedTags.includes(tag));
|
|
562
562
|
}
|
|
563
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
564
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
563
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: TagsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
564
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: TagsComponent, isStandalone: true, selector: "app-tags", inputs: { availableTags: "availableTags" }, providers: [{
|
|
565
565
|
provide: NG_VALUE_ACCESSOR,
|
|
566
566
|
useExisting: forwardRef(() => TagsComponent),
|
|
567
567
|
multi: true
|
|
568
568
|
}], ngImport: i0, template: "<div class=\"tags-select-container\">\n <label for=\"searchTags\">Search and Select Tags:</label>\n <input\n id=\"searchTags\"\n type=\"text\"\n [(ngModel)]=\"searchText\"\n (input)=\"filterTags()\"\n placeholder=\"Search tags...\"\n />\n\n <div *ngIf=\"filteredTags.length > 0\">\n <ul class=\"tag-list\">\n <li *ngFor=\"let tag of filteredTags\" (click)=\"onTagSelectionChange(tag)\">\n {{ tag }}\n </li>\n </ul>\n </div>\n\n <div class=\"selected-tags\">\n <button *ngFor=\"let tag of selectedTags\" class=\"tag-button\">\n {{ tag }}\n <span class=\"remove-tag\" (click)=\"removeTag(tag)\">x</span>\n </button>\n </div>\n</div>\n", styles: [".tags-select-container{display:flex;flex-direction:column}input[type=text]{padding:5px;border:1px solid #ccc;border-radius:4px;width:200px;margin-bottom:10px}.tag-list{list-style-type:none;padding-left:0;margin:0;border:1px solid #ccc;max-height:100px;overflow-y:auto}.tag-list li{padding:5px;cursor:pointer;border-bottom:1px solid #ddd}.tag-list li:hover{background-color:#f1f1f1}.selected-tags{display:flex;flex-wrap:wrap;gap:5px}.tag-button{background-color:#007bff;color:#fff;border:none;border-radius:20px;padding:5px 10px;display:flex;align-items:center;cursor:pointer}.tag-button .remove-tag{margin-left:8px;background:none;border:none;font-size:1rem;font-weight:700;color:#fff;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
569
569
|
}
|
|
570
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
570
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: TagsComponent, decorators: [{
|
|
571
571
|
type: Component,
|
|
572
572
|
args: [{ selector: 'app-tags', standalone: true, providers: [{
|
|
573
573
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -606,7 +606,7 @@ function makeDestroy() {
|
|
|
606
606
|
}
|
|
607
607
|
function mapEnumToDropdownOptions(enumObj) {
|
|
608
608
|
return Object.keys(enumObj).map(key => ({
|
|
609
|
-
label: enumObj[key],
|
|
609
|
+
label: enumObj[key], // The string value of the enum
|
|
610
610
|
value: key // The key of the enum (e.g., 'Item1')
|
|
611
611
|
}));
|
|
612
612
|
}
|
|
@@ -644,13 +644,13 @@ class ContentDesignComponent {
|
|
|
644
644
|
this.clickEvent.emit(this.content);
|
|
645
645
|
}
|
|
646
646
|
}
|
|
647
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
648
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
647
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ContentDesignComponent, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
648
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: ContentDesignComponent, isStandalone: true, selector: "app-content-design", inputs: { content: "content", contentLength: "contentLength" }, outputs: { clickEvent: "clickEvent" }, ngImport: i0, template: "<div class=\"content-designer\" [ngClass]=\"content.contentDirection\">\n <ng-container *ngIf=\"content?.mapAddress; else imageTemplate\">\n <div class=\"map\">\n <iframe\n width=\"600\"\n height=\"450\"\n style=\"border:0;\"\n allowfullscreen=\"\"\n loading=\"lazy\"\n referrerpolicy=\"no-referrer-when-downgrade\"\n [src]=\"sanitizedMapAddress\">\n </iframe>\n </div>\n </ng-container>\n\n <ng-template #imageTemplate>\n <div *ngIf=\"content.coverImage\" class=\"image\">\n <img [src]=\"content.coverImage\" alt=\"Cover Image\">\n </div>\n </ng-template>\n\n <div class=\"content\">\n <h2 *ngIf=\"content.title\">{{ content.title }}</h2>\n <p *ngIf=\"content.content\">{{ truncateContent(content.content) }}</p>\n <ng-container [ngTemplateOutlet]=\"content.template\"></ng-container>\n <app-button *ngIf=\"content.button\" [config] = \"content.button\"\n (clickEvent)=\"onButtonClick(content.button.action)\">\n </app-button>\n </div>\n</div>\n", styles: [".content-designer{display:flex;gap:20px;flex-wrap:wrap;justify-content:space-between;align-items:center;text-align:center}.content-designer img{max-width:100%;height:auto}.content-designer .content{display:flex;flex-direction:column}.content-designer .content p{text-align:justify}.content-designer.left,.content-designer.right{flex-direction:row}.content-designer.left .image,.content-designer.left .content,.content-designer.right .image,.content-designer.right .content{flex:1;width:50%}.content-designer.left .content,.content-designer.right .content{text-align:justify}.content-designer.left .image,.content-designer.right .image{display:flex}.content-designer.left{flex-direction:row-reverse}.content-designer.left .image{justify-content:end}.content-designer.right .image{justify-content:start}.content-designer.up,.content-designer.down{flex-direction:column}.content-designer.up .image,.content-designer.down .image{width:100%;height:300px;overflow:hidden;justify-content:center;align-items:center}.content-designer.up .image image,.content-designer.down .image image{height:100%;width:auto;object-fit:cover}.content-designer.up{flex-direction:column-reverse}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: ButtonComponent, selector: "app-button", inputs: ["config"], outputs: ["clickEvent"] }] }); }
|
|
649
649
|
}
|
|
650
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
650
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ContentDesignComponent, decorators: [{
|
|
651
651
|
type: Component,
|
|
652
652
|
args: [{ selector: 'app-content-design', standalone: true, imports: [CommonModule, ButtonComponent], template: "<div class=\"content-designer\" [ngClass]=\"content.contentDirection\">\n <ng-container *ngIf=\"content?.mapAddress; else imageTemplate\">\n <div class=\"map\">\n <iframe\n width=\"600\"\n height=\"450\"\n style=\"border:0;\"\n allowfullscreen=\"\"\n loading=\"lazy\"\n referrerpolicy=\"no-referrer-when-downgrade\"\n [src]=\"sanitizedMapAddress\">\n </iframe>\n </div>\n </ng-container>\n\n <ng-template #imageTemplate>\n <div *ngIf=\"content.coverImage\" class=\"image\">\n <img [src]=\"content.coverImage\" alt=\"Cover Image\">\n </div>\n </ng-template>\n\n <div class=\"content\">\n <h2 *ngIf=\"content.title\">{{ content.title }}</h2>\n <p *ngIf=\"content.content\">{{ truncateContent(content.content) }}</p>\n <ng-container [ngTemplateOutlet]=\"content.template\"></ng-container>\n <app-button *ngIf=\"content.button\" [config] = \"content.button\"\n (clickEvent)=\"onButtonClick(content.button.action)\">\n </app-button>\n </div>\n</div>\n", styles: [".content-designer{display:flex;gap:20px;flex-wrap:wrap;justify-content:space-between;align-items:center;text-align:center}.content-designer img{max-width:100%;height:auto}.content-designer .content{display:flex;flex-direction:column}.content-designer .content p{text-align:justify}.content-designer.left,.content-designer.right{flex-direction:row}.content-designer.left .image,.content-designer.left .content,.content-designer.right .image,.content-designer.right .content{flex:1;width:50%}.content-designer.left .content,.content-designer.right .content{text-align:justify}.content-designer.left .image,.content-designer.right .image{display:flex}.content-designer.left{flex-direction:row-reverse}.content-designer.left .image{justify-content:end}.content-designer.right .image{justify-content:start}.content-designer.up,.content-designer.down{flex-direction:column}.content-designer.up .image,.content-designer.down .image{width:100%;height:300px;overflow:hidden;justify-content:center;align-items:center}.content-designer.up .image image,.content-designer.down .image image{height:100%;width:auto;object-fit:cover}.content-designer.up{flex-direction:column-reverse}\n"] }]
|
|
653
|
-
}], ctorParameters:
|
|
653
|
+
}], ctorParameters: () => [{ type: i1$1.DomSanitizer }], propDecorators: { content: [{
|
|
654
654
|
type: Input
|
|
655
655
|
}], contentLength: [{
|
|
656
656
|
type: Input
|
|
@@ -670,13 +670,13 @@ class CardsComponent {
|
|
|
670
670
|
this.getCardConfig.emit(contentDesign);
|
|
671
671
|
}
|
|
672
672
|
}
|
|
673
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
674
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
673
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: CardsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
674
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: CardsComponent, isStandalone: true, selector: "app-cards", inputs: { cardContents: "cardContents" }, outputs: { getCardConfig: "getCardConfig" }, ngImport: i0, template: "<div class=\"cards-content\">\n <ng-container *ngFor=\"let content of cardContents\">\n <div class=\"card {{content.name}}\">\n <app-content-design (clickEvent)=\"clickEvent($event)\"\n [content] = \"content\">\n </app-content-design>\n </div>\n </ng-container>\n</div>\n\n\n\n", styles: [".cards-content{display:flex;flex-direction:row;gap:20px}.content{width:33%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ContentDesignComponent, selector: "app-content-design", inputs: ["content", "contentLength"], outputs: ["clickEvent"] }] }); }
|
|
675
675
|
}
|
|
676
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
676
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: CardsComponent, decorators: [{
|
|
677
677
|
type: Component,
|
|
678
678
|
args: [{ selector: 'app-cards', standalone: true, imports: [CommonModule, ContentDesignComponent], template: "<div class=\"cards-content\">\n <ng-container *ngFor=\"let content of cardContents\">\n <div class=\"card {{content.name}}\">\n <app-content-design (clickEvent)=\"clickEvent($event)\"\n [content] = \"content\">\n </app-content-design>\n </div>\n </ng-container>\n</div>\n\n\n\n", styles: [".cards-content{display:flex;flex-direction:row;gap:20px}.content{width:33%}\n"] }]
|
|
679
|
-
}], ctorParameters:
|
|
679
|
+
}], ctorParameters: () => [], propDecorators: { cardContents: [{
|
|
680
680
|
type: Input
|
|
681
681
|
}], getCardConfig: [{
|
|
682
682
|
type: Output
|
|
@@ -724,15 +724,15 @@ class FormComponent {
|
|
|
724
724
|
trackByFn(index, item) {
|
|
725
725
|
return item.name;
|
|
726
726
|
}
|
|
727
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
728
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
727
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: FormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
728
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: FormComponent, isStandalone: true, selector: "app-form", inputs: { formGroup: "formGroup", inputConfigs: "inputConfigs", buttonConfig: "buttonConfig", validationMessages: "validationMessages" }, outputs: { formSubmit: "formSubmit", formChange: "formChange" }, ngImport: i0, template: "<form (ngSubmit)=\"onSubmit()\" [formGroup]=\"formGroup\">\n <ng-container *ngIf=\"inputConfigs && inputConfigs.length > 0; else noInputs\">\n <ng-container *ngFor=\"let inputConfig of inputConfigs; trackBy: trackByFn\">\n\n <!-- Input Field -->\n <app-input\n *ngIf=\"checkFormConfigType(inputConfig.type) === InputGroupType.textual\"\n [formControlName]=\"inputConfig.name\"\n [config]=\"inputConfig\"\n [required]=\"inputConfig.required!\"\n (valueChange)=\"onValueChange(inputConfig.name, $event)\">\n </app-input>\n\n <!-- Selection Field -->\n <app-selection\n *ngIf=\"checkFormConfigType(inputConfig.type) === InputGroupType.selection\"\n [formControlName]=\"inputConfig.name\"\n [label]=\"inputConfig.label ?? ''\"\n [options]=\"inputConfig.options\"\n (valueChange)=\"onValueChange(inputConfig.name, $event)\">\n </app-selection>\n\n <!-- File Selection -->\n <app-file-selection\n *ngIf=\"checkFormConfigType(inputConfig.type) === InputGroupType.file\"\n [formControlName]=\"inputConfig.name\"\n [label]=\"inputConfig.label ?? inputConfig.name\"\n (valueChange)=\"onValueChange(inputConfig.name, $event)\">\n </app-file-selection>\n\n <!-- Validation Messages -->\n <div *ngIf=\"formGroup.controls[inputConfig.name]?.invalid && formGroup.controls[inputConfig.name]?.touched\" class=\"error-message\">\n {{ validationMessages[inputConfig.name] || 'Invalid input' }}\n </div>\n\n </ng-container>\n </ng-container>\n\n <!-- Submit Button -->\n <app-button [config]=\"buttonConfig\"></app-button>\n</form>\n\n<!-- No Inputs Placeholder -->\n<ng-template #noInputs>\n <p>No inputs configured.</p>\n</ng-template>\n", styles: ["form{display:flex;flex-direction:column;gap:15px}label{display:block;margin-bottom:.5rem}input,textarea{width:100%;padding:.5rem;border:1px solid #ccc;border-radius:.25rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: InputComponent, selector: "app-input", inputs: ["config"] }, { kind: "component", type: SelectionComponent, selector: "app-selection", inputs: ["label", "options", "selectedValue", "selectedValues", "isMultiSelect", "displayType"], outputs: ["selectedChange"] }, { kind: "component", type: FileSelectionComponent, selector: "app-file-selection", inputs: ["label", "chooseFileLabel", "imageUrl", "fileName"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["config"], outputs: ["clickEvent"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
|
|
729
729
|
}
|
|
730
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
730
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: FormComponent, decorators: [{
|
|
731
731
|
type: Component,
|
|
732
732
|
args: [{ selector: 'app-form', standalone: true, imports: [
|
|
733
733
|
CommonModule, InputComponent, SelectionComponent,
|
|
734
734
|
FileSelectionComponent, ButtonComponent, FormsModule, ReactiveFormsModule
|
|
735
|
-
], template: "<form (ngSubmit)=\"onSubmit()\" [formGroup]=\"formGroup\">\n <ng-container *ngIf=\"inputConfigs && inputConfigs.length > 0; else noInputs\">\n <ng-container *ngFor=\"let inputConfig of inputConfigs; trackBy: trackByFn\">\n\n <!-- Input Field -->\n <app-input\n *ngIf=\"checkFormConfigType(inputConfig.type) === InputGroupType.textual\"\n [formControlName]=\"inputConfig.name\"\n [config]=\"inputConfig\"\n [required]=\"inputConfig.required
|
|
735
|
+
], template: "<form (ngSubmit)=\"onSubmit()\" [formGroup]=\"formGroup\">\n <ng-container *ngIf=\"inputConfigs && inputConfigs.length > 0; else noInputs\">\n <ng-container *ngFor=\"let inputConfig of inputConfigs; trackBy: trackByFn\">\n\n <!-- Input Field -->\n <app-input\n *ngIf=\"checkFormConfigType(inputConfig.type) === InputGroupType.textual\"\n [formControlName]=\"inputConfig.name\"\n [config]=\"inputConfig\"\n [required]=\"inputConfig.required!\"\n (valueChange)=\"onValueChange(inputConfig.name, $event)\">\n </app-input>\n\n <!-- Selection Field -->\n <app-selection\n *ngIf=\"checkFormConfigType(inputConfig.type) === InputGroupType.selection\"\n [formControlName]=\"inputConfig.name\"\n [label]=\"inputConfig.label ?? ''\"\n [options]=\"inputConfig.options\"\n (valueChange)=\"onValueChange(inputConfig.name, $event)\">\n </app-selection>\n\n <!-- File Selection -->\n <app-file-selection\n *ngIf=\"checkFormConfigType(inputConfig.type) === InputGroupType.file\"\n [formControlName]=\"inputConfig.name\"\n [label]=\"inputConfig.label ?? inputConfig.name\"\n (valueChange)=\"onValueChange(inputConfig.name, $event)\">\n </app-file-selection>\n\n <!-- Validation Messages -->\n <div *ngIf=\"formGroup.controls[inputConfig.name]?.invalid && formGroup.controls[inputConfig.name]?.touched\" class=\"error-message\">\n {{ validationMessages[inputConfig.name] || 'Invalid input' }}\n </div>\n\n </ng-container>\n </ng-container>\n\n <!-- Submit Button -->\n <app-button [config]=\"buttonConfig\"></app-button>\n</form>\n\n<!-- No Inputs Placeholder -->\n<ng-template #noInputs>\n <p>No inputs configured.</p>\n</ng-template>\n", styles: ["form{display:flex;flex-direction:column;gap:15px}label{display:block;margin-bottom:.5rem}input,textarea{width:100%;padding:.5rem;border:1px solid #ccc;border-radius:.25rem}\n"] }]
|
|
736
736
|
}], propDecorators: { formGroup: [{
|
|
737
737
|
type: Input
|
|
738
738
|
}], inputConfigs: [{
|
|
@@ -777,13 +777,13 @@ class ModalComponent {
|
|
|
777
777
|
cancel() {
|
|
778
778
|
this.closeModal();
|
|
779
779
|
}
|
|
780
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
781
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
780
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
781
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: ModalComponent, isStandalone: true, selector: "app-modal", inputs: { modalEvent: "modalEvent", size: "size" }, ngImport: i0, template: "<div class=\"modal-overlay\" (click)=\"handleOverlayClick($event)\" *ngIf=\"modalEvent?.isModalVisible\">\n <div class=\"modal-content\" [ngClass]=\"size\" (click)=\"handleContentClick($event)\">\n <div class=\"modal-header\">\n <h2>{{modalEvent.title }}</h2>\n <button class=\"close-btn\" (click)=\"closeModal()\">\n <i class=\"material-icons\">close</i>\n </button>\n </div>\n <div class=\"modal-body\">\n <div *ngIf=\"modalEvent.params && modalEvent.params['content']\">{{modalEvent.params['content'] }}</div>\n <ng-container *ngTemplateOutlet=\"modalEvent.template; context: modalEvent.params\"></ng-container>\n <div *ngIf=\"!modalEvent?.isDialog\" class=\"buttons\">\n <app-button [config]=\"okConfig\" (clickEvent)=\"ok()\"></app-button>\n <app-button [config]=\"cancelConfig\" (clickEvent)=\"cancel()\"></app-button>\n </div>\n </div>\n </div>\n</div>\n", styles: [".modal-overlay{display:flex;align-items:center;justify-content:center;position:fixed;inset:0;width:100%;height:100%;background-color:#00000080;z-index:50}.modal-content{display:flex;flex-direction:column;background-color:#fff;color:#000;border-radius:8px;padding:2rem;width:100%;max-height:calc(100vh - 10rem)}.modal-content.small{width:30%;max-width:300px}.modal-content.medium{width:50%;max-width:600px}.modal-content.large{width:80%;max-width:900px}.modal-content.dark-mode{background-color:#27272a;color:#d1d5db}.modal-content .modal-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:1rem;position:sticky;top:0;background-color:inherit;z-index:10;border-bottom:1px solid #e5e7eb}.modal-content .modal-header h2{font-size:2rem;font-weight:700;margin:0}.modal-content .modal-header .close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;display:flex;align-items:center}.modal-content .modal-header .close-btn i.material-icons{font-size:24px;color:#888;transition:color .2s}.modal-content .modal-header .close-btn:hover i.material-icons{color:#444}.modal-content .modal-body{flex-grow:1;overflow-y:auto;padding:1rem 0;scrollbar-width:thin;scrollbar-color:#888 #f1f1f1}.modal-content .modal-body::-webkit-scrollbar{width:10px}.modal-content .modal-body::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.modal-content .modal-body::-webkit-scrollbar-thumb{background:#888;border-radius:10px;border:2px solid #f1f1f1;transition:background .2s}.modal-content .modal-body::-webkit-scrollbar-thumb:hover{background:#555}.modal-content .buttons{display:flex;justify-content:flex-end;gap:15px;padding:1.5rem 0;border-top:1px solid #e5e7eb}p{color:#4b5563;margin-bottom:1.5rem}.dark-mode p{color:#d1d5db}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: ButtonComponent, selector: "app-button", inputs: ["config"], outputs: ["clickEvent"] }] }); }
|
|
782
782
|
}
|
|
783
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
783
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: ModalComponent, decorators: [{
|
|
784
784
|
type: Component,
|
|
785
|
-
args: [{ selector: 'app-modal', standalone: true, imports: [CommonModule, ButtonComponent], template: "<div class=\"modal-overlay\" (click)=\"handleOverlayClick($event)\" *ngIf=\"modalEvent?.isModalVisible\">\n <div class=\"modal-content\" [ngClass]=\"size\" (click)=\"handleContentClick($event)\">\n <div class=\"modal-header\">\n <h2>{{modalEvent.title }}</h2>\n <button class=\"close-btn\" (click)=\"closeModal()\">\n <i class=\"material-icons\">close</i>\n </button>\n </div>\n <div class=\"modal-body\">\n <div *ngIf=\"modalEvent.params && modalEvent.params['content']\">{{modalEvent.params['content'] }}</div>\n <ng-container *ngTemplateOutlet=\"modalEvent.template; context: modalEvent.params\"></ng-container>\n <div *ngIf=\"!modalEvent?.isDialog\" class=\"buttons\">\n <app-button [config]=\"okConfig\" (clickEvent)=\"ok()\"></app-button>\n <app-button [config]=\"cancelConfig\" (clickEvent)=\"cancel()\"></app-button>\n </div>\n </div>\n </div>\n</div>\n", styles: [".modal-overlay{display:flex;align-items:center;justify-content:center;position:fixed;inset:0;width:100%;height:100%;background-color:#00000080;z-index:50}.modal-content{display:flex;flex-direction:column;background-color:#fff;color:#000;border-radius:8px;padding:2rem;width:100%;max-height:calc(100vh - 10rem)}.modal-content.small{width:30%;max-width:300px}.modal-content.medium{width:50%;max-width:600px}.modal-content.large{width:80%;max-width:900px}.modal-content.dark-mode{background-color:#27272a;color:#d1d5db}.modal-content .modal-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:1rem;position:sticky;top:0;background-color:inherit;z-index:10;border-bottom:1px solid #e5e7eb}.modal-content .modal-header h2{font-size:2rem;font-weight:700;margin:0}.modal-content .modal-header .close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;display:flex;align-items:center}.modal-content .modal-header .close-btn i.material-icons{font-size:24px;color:#888;transition:color .2s}.modal-content .modal-header .close-btn:hover i.material-icons{color:#444}.modal-content .modal-body{flex-grow:1;overflow-y:auto;padding:1rem 0;scrollbar-width:thin;scrollbar-color:#888 #f1f1f1}.modal-content .modal-body::-webkit-scrollbar{width:10px}.modal-content .modal-body::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.modal-content .modal-body::-webkit-scrollbar-thumb{background:#888;border-radius:10px;border:2px solid #f1f1f1
|
|
786
|
-
}], ctorParameters:
|
|
785
|
+
args: [{ selector: 'app-modal', standalone: true, imports: [CommonModule, ButtonComponent], template: "<div class=\"modal-overlay\" (click)=\"handleOverlayClick($event)\" *ngIf=\"modalEvent?.isModalVisible\">\n <div class=\"modal-content\" [ngClass]=\"size\" (click)=\"handleContentClick($event)\">\n <div class=\"modal-header\">\n <h2>{{modalEvent.title }}</h2>\n <button class=\"close-btn\" (click)=\"closeModal()\">\n <i class=\"material-icons\">close</i>\n </button>\n </div>\n <div class=\"modal-body\">\n <div *ngIf=\"modalEvent.params && modalEvent.params['content']\">{{modalEvent.params['content'] }}</div>\n <ng-container *ngTemplateOutlet=\"modalEvent.template; context: modalEvent.params\"></ng-container>\n <div *ngIf=\"!modalEvent?.isDialog\" class=\"buttons\">\n <app-button [config]=\"okConfig\" (clickEvent)=\"ok()\"></app-button>\n <app-button [config]=\"cancelConfig\" (clickEvent)=\"cancel()\"></app-button>\n </div>\n </div>\n </div>\n</div>\n", styles: [".modal-overlay{display:flex;align-items:center;justify-content:center;position:fixed;inset:0;width:100%;height:100%;background-color:#00000080;z-index:50}.modal-content{display:flex;flex-direction:column;background-color:#fff;color:#000;border-radius:8px;padding:2rem;width:100%;max-height:calc(100vh - 10rem)}.modal-content.small{width:30%;max-width:300px}.modal-content.medium{width:50%;max-width:600px}.modal-content.large{width:80%;max-width:900px}.modal-content.dark-mode{background-color:#27272a;color:#d1d5db}.modal-content .modal-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:1rem;position:sticky;top:0;background-color:inherit;z-index:10;border-bottom:1px solid #e5e7eb}.modal-content .modal-header h2{font-size:2rem;font-weight:700;margin:0}.modal-content .modal-header .close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;display:flex;align-items:center}.modal-content .modal-header .close-btn i.material-icons{font-size:24px;color:#888;transition:color .2s}.modal-content .modal-header .close-btn:hover i.material-icons{color:#444}.modal-content .modal-body{flex-grow:1;overflow-y:auto;padding:1rem 0;scrollbar-width:thin;scrollbar-color:#888 #f1f1f1}.modal-content .modal-body::-webkit-scrollbar{width:10px}.modal-content .modal-body::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.modal-content .modal-body::-webkit-scrollbar-thumb{background:#888;border-radius:10px;border:2px solid #f1f1f1;transition:background .2s}.modal-content .modal-body::-webkit-scrollbar-thumb:hover{background:#555}.modal-content .buttons{display:flex;justify-content:flex-end;gap:15px;padding:1.5rem 0;border-top:1px solid #e5e7eb}p{color:#4b5563;margin-bottom:1.5rem}.dark-mode p{color:#d1d5db}\n"] }]
|
|
786
|
+
}], ctorParameters: () => [], propDecorators: { modalEvent: [{
|
|
787
787
|
type: Input
|
|
788
788
|
}], size: [{
|
|
789
789
|
type: Input
|
|
@@ -884,17 +884,17 @@ class PaginatorComponent {
|
|
|
884
884
|
return {
|
|
885
885
|
label: page.toString(),
|
|
886
886
|
type: ButtonType.button,
|
|
887
|
-
isActive: page === this.selectedPage,
|
|
887
|
+
isActive: page === this.selectedPage, // Set active state based on selectedPage
|
|
888
888
|
isDisabled: false // Page buttons are never disabled
|
|
889
889
|
};
|
|
890
890
|
}
|
|
891
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
892
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
891
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
892
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: PaginatorComponent, isStandalone: true, selector: "app-paginator", inputs: { totalRecords: "totalRecords" }, outputs: { paginator: "paginator" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"table-footer\">\n <div class=\"number-of-page\">\n <app-selection [options] = \"itemsPerPageList\"\n [selectedValue]=\"this.itemsPerPage\"\n (selectedChange) = \"onChangeNumberOfPage($event)\">\n </app-selection>\n <app-input [config]=\"inputConfig\"></app-input>\n </div>\n <div class=\"paginator\">\n <app-button (clickEvent)=\"selectPage(selectedPage - 1)\"\n [config]=\"previousButtonConfig\"/>\n\n <!-- Page Numbers -->\n <ng-container *ngFor=\"let page of pageNumbers\">\n <app-button\n (clickEvent)=\"selectPage(page)\"\n [config]=\"getPageButtonConfig(page)\">\n </app-button>\n </ng-container>\n\n <!-- Next Button -->\n <app-button (clickEvent)=\"selectPage(selectedPage + 1)\"\n [config]=\"nextButtonConfig\"/>\n </div>\n</div>\n", styles: ["body{color:#566787;background:#f5f5f5;font-family:Varela Round,sans-serif;font-size:13px}.table-footer{display:flex;padding:10px 0}.table-footer .number-of-page{width:70%;display:flex;align-items:center;gap:20px}.table-footer .paginator{display:flex;justify-content:flex-end;width:100%}.table-footer .paginator app-button{margin:0 2px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["config"], outputs: ["clickEvent"] }, { kind: "component", type: SelectionComponent, selector: "app-selection", inputs: ["label", "options", "selectedValue", "selectedValues", "isMultiSelect", "displayType"], outputs: ["selectedChange"] }, { kind: "component", type: InputComponent, selector: "app-input", inputs: ["config"] }] }); }
|
|
893
893
|
}
|
|
894
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
894
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: PaginatorComponent, decorators: [{
|
|
895
895
|
type: Component,
|
|
896
896
|
args: [{ selector: 'app-paginator', standalone: true, imports: [CommonModule, ButtonComponent, SelectionComponent, InputComponent], template: "<div class=\"table-footer\">\n <div class=\"number-of-page\">\n <app-selection [options] = \"itemsPerPageList\"\n [selectedValue]=\"this.itemsPerPage\"\n (selectedChange) = \"onChangeNumberOfPage($event)\">\n </app-selection>\n <app-input [config]=\"inputConfig\"></app-input>\n </div>\n <div class=\"paginator\">\n <app-button (clickEvent)=\"selectPage(selectedPage - 1)\"\n [config]=\"previousButtonConfig\"/>\n\n <!-- Page Numbers -->\n <ng-container *ngFor=\"let page of pageNumbers\">\n <app-button\n (clickEvent)=\"selectPage(page)\"\n [config]=\"getPageButtonConfig(page)\">\n </app-button>\n </ng-container>\n\n <!-- Next Button -->\n <app-button (clickEvent)=\"selectPage(selectedPage + 1)\"\n [config]=\"nextButtonConfig\"/>\n </div>\n</div>\n", styles: ["body{color:#566787;background:#f5f5f5;font-family:Varela Round,sans-serif;font-size:13px}.table-footer{display:flex;padding:10px 0}.table-footer .number-of-page{width:70%;display:flex;align-items:center;gap:20px}.table-footer .paginator{display:flex;justify-content:flex-end;width:100%}.table-footer .paginator app-button{margin:0 2px}\n"] }]
|
|
897
|
-
}], ctorParameters:
|
|
897
|
+
}], ctorParameters: () => [], propDecorators: { totalRecords: [{
|
|
898
898
|
type: Input
|
|
899
899
|
}], paginator: [{
|
|
900
900
|
type: Output
|
|
@@ -918,13 +918,13 @@ class TableComponent {
|
|
|
918
918
|
changePaginator(paging) {
|
|
919
919
|
this.paginator.emit(paging);
|
|
920
920
|
}
|
|
921
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
922
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
921
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: TableComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
922
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: TableComponent, isStandalone: true, selector: "app-table", inputs: { items: "items", columns: "columns", totalRecords: "totalRecords", tableName: "tableName", loadingState: "loadingState" }, outputs: { paginator: "paginator" }, queries: [{ propertyName: "bodyTemplate", first: true, predicate: ["bodyTemplate"], descendants: true }], ngImport: i0, template: "<div class=\"container-xl table-wrapper\">\n <div class=\"table-title\">\n <h2><b>{{tableName }}</b></h2>\n </div>\n <div class=\"loading-wrapper\">\n <ng-container *ngIf=\"!(loadingState | async); else loading; then table\">\n </ng-container>\n </div>\n <app-paginator [totalRecords] = \"totalRecords\" (paginator)=\"changePaginator($event)\"></app-paginator>\n</div>\n\n<ng-template #loading>\n <div class=\"loading-wrapper\">\n <app-loading></app-loading>\n </div>\n</ng-template>\n\n<ng-template #table>\n <ng-container *ngIf=\"totalRecords == 0; then emptyContent; else tableContent\">\n </ng-container>\n</ng-template>\n\n<ng-template #tableContent>\n <p-table [value]=\"items\" class=\"table table-striped table-hover\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th>\n <ng-content select=\"[selectAllCheckbox]\"></ng-content>\n </th>\n <ng-container *ngFor=\" let col of columns\">\n <th>{{col.name }}</th>\n </ng-container>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-item>\n <ng-container [ngTemplateOutlet]=\"bodyTemplate\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n </ng-template>\n </p-table>\n</ng-template>\n\n<ng-template #emptyContent>\n <div class=\"no-record-message\">\n <div>No records</div>\n </div>\n</ng-template>\n", styles: [":host{width:100%}body{color:#566787;background:#f5f5f5;font-family:Varela Round,sans-serif;font-size:13px}.table-responsive{margin:30px 0}.table-wrapper{background:#fff;border-radius:3px;box-shadow:0 1px 1px #0000000d}.table-title{background:#435d7d;color:#fff;border-radius:3px 3px 0 0;padding:0 12px;display:flex}.table-title .table-name{width:70%}.table-title .table-add{width:30%;display:flex;align-items:center;justify-content:flex-end}.table-title .table-add a{cursor:pointer}.table-title h2{font-size:24px}.table-title .btn-group{float:right}.table-title .btn{color:#fff;float:right;font-size:13px;min-width:50px;border-radius:2px;border:none;outline:none!important;margin-left:10px}.table-title .btn i{float:left;font-size:21px;margin-right:5px}.table-title .btn span{float:left;margin-top:2px}::ng-deep .table tr th,::ng-deep .table tr td{border-color:#e9e9e9;padding:12px 15px;vertical-align:middle}::ng-deep .table tr th:first-child{width:60px;display:flex}::ng-deep .table tr th:last-child{width:150px}table.table-striped tbody tr:nth-of-type(odd){background-color:#fcfcfc}table.table-striped.table-hover tbody tr:hover{background:#f5f5f5}::ng-deep .table th{text-align:left}::ng-deep .table th i{font-size:13px;margin:0 5px;cursor:pointer}::ng-deep .table td:last-child i{opacity:.9;font-size:22px;margin:0 5px}::ng-deep .table td a{font-weight:700;color:#566787;display:inline-block;text-decoration:none;outline:none!important}.hint-text{float:left;margin-top:10px;font-size:13px}.no-record-message{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}.excel{display:flex}.excel a{display:inline-flex;align-items:center}.loading-wrapper{height:calc(100vh - 220px);display:flex;flex-direction:column;width:100%;overflow-y:auto;overflow-x:hidden}.loading-wrapper::-webkit-scrollbar{width:12px}.loading-wrapper::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px;box-shadow:inset 0 0 5px #0000001a}.loading-wrapper::-webkit-scrollbar-thumb{background:#888;border-radius:10px;border:3px solid #f1f1f1;transition:background .3s}.loading-wrapper::-webkit-scrollbar-thumb:hover{background:#555}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { 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: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$1.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: LoadingComponent, selector: "app-loading", inputs: ["size", "imageSrc"] }, { kind: "component", type: PaginatorComponent, selector: "app-paginator", inputs: ["totalRecords"], outputs: ["paginator"] }] }); }
|
|
923
923
|
}
|
|
924
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
924
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: TableComponent, decorators: [{
|
|
925
925
|
type: Component,
|
|
926
|
-
args: [{ selector: 'app-table', standalone: true, imports: [CommonModule, TableModule, LoadingComponent, PaginatorComponent], template: "<div class=\"container-xl table-wrapper\">\n <div class=\"table-title\">\n <h2><b>{{tableName }}</b></h2>\n </div>\n <div class=\"loading-wrapper\">\n <ng-container *ngIf=\"!(loadingState | async); else loading; then table\">\n </ng-container>\n </div>\n <app-paginator [totalRecords] = \"totalRecords\" (paginator)=\"changePaginator($event)\"></app-paginator>\n</div>\n\n<ng-template #loading>\n <div class=\"loading-wrapper\">\n <app-loading></app-loading>\n </div>\n</ng-template>\n\n<ng-template #table>\n <ng-container *ngIf=\"totalRecords == 0; then emptyContent; else tableContent\">\n </ng-container>\n</ng-template>\n\n<ng-template #tableContent>\n <p-table [value]=\"items\" class=\"table table-striped table-hover\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th>\n <ng-content select=\"[selectAllCheckbox]\"></ng-content>\n </th>\n <ng-container *ngFor=\" let col of columns\">\n <th>{{col.name }}</th>\n </ng-container>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-item>\n <ng-container [ngTemplateOutlet]=\"bodyTemplate\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n </ng-template>\n </p-table>\n</ng-template>\n\n<ng-template #emptyContent>\n <div class=\"no-record-message\">\n <div>No records</div>\n </div>\n</ng-template>\n", styles: [":host{width:100%}body{color:#566787;background:#f5f5f5;font-family:Varela Round,sans-serif;font-size:13px}.table-responsive{margin:30px 0}.table-wrapper{background:#fff;border-radius:3px;box-shadow:0 1px 1px #0000000d}.table-title{background:#435d7d;color:#fff;border-radius:3px 3px 0 0;padding:0 12px;display:flex}.table-title .table-name{width:70%}.table-title .table-add{width:30%;display:flex;align-items:center;justify-content:flex-end}.table-title .table-add a{cursor:pointer}.table-title h2{font-size:24px}.table-title .btn-group{float:right}.table-title .btn{color:#fff;float:right;font-size:13px;min-width:50px;border-radius:2px;border:none;outline:none!important;margin-left:10px}.table-title .btn i{float:left;font-size:21px;margin-right:5px}.table-title .btn span{float:left;margin-top:2px}::ng-deep .table tr th,::ng-deep .table tr td{border-color:#e9e9e9;padding:12px 15px;vertical-align:middle}::ng-deep .table tr th:first-child{width:60px;display:flex}::ng-deep .table tr th:last-child{width:150px}table.table-striped tbody tr:nth-of-type(odd){background-color:#fcfcfc}table.table-striped.table-hover tbody tr:hover{background:#f5f5f5}::ng-deep .table th{text-align:left}::ng-deep .table th i{font-size:13px;margin:0 5px;cursor:pointer}::ng-deep .table td:last-child i{opacity:.9;font-size:22px;margin:0 5px}::ng-deep .table td a{font-weight:700;color:#566787;display:inline-block;text-decoration:none;outline:none!important}.hint-text{float:left;margin-top:10px;font-size:13px}.no-record-message{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}.excel{display:flex}.excel a{display:inline-flex;align-items:center}.loading-wrapper{height:calc(100vh - 220px);display:flex;flex-direction:column;width:100%;overflow-y:auto;overflow-x:hidden}.loading-wrapper::-webkit-scrollbar{width:12px}.loading-wrapper::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px;box-shadow:inset 0 0 5px #0000001a}.loading-wrapper::-webkit-scrollbar-thumb{background:#888;border-radius:10px;border:3px solid #f1f1f1
|
|
927
|
-
}], ctorParameters:
|
|
926
|
+
args: [{ selector: 'app-table', standalone: true, imports: [CommonModule, TableModule, LoadingComponent, PaginatorComponent], template: "<div class=\"container-xl table-wrapper\">\n <div class=\"table-title\">\n <h2><b>{{tableName }}</b></h2>\n </div>\n <div class=\"loading-wrapper\">\n <ng-container *ngIf=\"!(loadingState | async); else loading; then table\">\n </ng-container>\n </div>\n <app-paginator [totalRecords] = \"totalRecords\" (paginator)=\"changePaginator($event)\"></app-paginator>\n</div>\n\n<ng-template #loading>\n <div class=\"loading-wrapper\">\n <app-loading></app-loading>\n </div>\n</ng-template>\n\n<ng-template #table>\n <ng-container *ngIf=\"totalRecords == 0; then emptyContent; else tableContent\">\n </ng-container>\n</ng-template>\n\n<ng-template #tableContent>\n <p-table [value]=\"items\" class=\"table table-striped table-hover\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th>\n <ng-content select=\"[selectAllCheckbox]\"></ng-content>\n </th>\n <ng-container *ngFor=\" let col of columns\">\n <th>{{col.name }}</th>\n </ng-container>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-item>\n <ng-container [ngTemplateOutlet]=\"bodyTemplate\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n </ng-template>\n </p-table>\n</ng-template>\n\n<ng-template #emptyContent>\n <div class=\"no-record-message\">\n <div>No records</div>\n </div>\n</ng-template>\n", styles: [":host{width:100%}body{color:#566787;background:#f5f5f5;font-family:Varela Round,sans-serif;font-size:13px}.table-responsive{margin:30px 0}.table-wrapper{background:#fff;border-radius:3px;box-shadow:0 1px 1px #0000000d}.table-title{background:#435d7d;color:#fff;border-radius:3px 3px 0 0;padding:0 12px;display:flex}.table-title .table-name{width:70%}.table-title .table-add{width:30%;display:flex;align-items:center;justify-content:flex-end}.table-title .table-add a{cursor:pointer}.table-title h2{font-size:24px}.table-title .btn-group{float:right}.table-title .btn{color:#fff;float:right;font-size:13px;min-width:50px;border-radius:2px;border:none;outline:none!important;margin-left:10px}.table-title .btn i{float:left;font-size:21px;margin-right:5px}.table-title .btn span{float:left;margin-top:2px}::ng-deep .table tr th,::ng-deep .table tr td{border-color:#e9e9e9;padding:12px 15px;vertical-align:middle}::ng-deep .table tr th:first-child{width:60px;display:flex}::ng-deep .table tr th:last-child{width:150px}table.table-striped tbody tr:nth-of-type(odd){background-color:#fcfcfc}table.table-striped.table-hover tbody tr:hover{background:#f5f5f5}::ng-deep .table th{text-align:left}::ng-deep .table th i{font-size:13px;margin:0 5px;cursor:pointer}::ng-deep .table td:last-child i{opacity:.9;font-size:22px;margin:0 5px}::ng-deep .table td a{font-weight:700;color:#566787;display:inline-block;text-decoration:none;outline:none!important}.hint-text{float:left;margin-top:10px;font-size:13px}.no-record-message{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}.excel{display:flex}.excel a{display:inline-flex;align-items:center}.loading-wrapper{height:calc(100vh - 220px);display:flex;flex-direction:column;width:100%;overflow-y:auto;overflow-x:hidden}.loading-wrapper::-webkit-scrollbar{width:12px}.loading-wrapper::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px;box-shadow:inset 0 0 5px #0000001a}.loading-wrapper::-webkit-scrollbar-thumb{background:#888;border-radius:10px;border:3px solid #f1f1f1;transition:background .3s}.loading-wrapper::-webkit-scrollbar-thumb:hover{background:#555}\n"] }]
|
|
927
|
+
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { items: [{
|
|
928
928
|
type: Input
|
|
929
929
|
}], columns: [{
|
|
930
930
|
type: Input
|
|
@@ -966,13 +966,13 @@ class FormatedTextComponent {
|
|
|
966
966
|
}
|
|
967
967
|
}
|
|
968
968
|
ngOnInit() { }
|
|
969
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
970
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
969
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: FormatedTextComponent, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
970
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: FormatedTextComponent, isStandalone: true, selector: "app-formated-text", inputs: { content: "content" }, ngImport: i0, template: "<app-content-design [content] = \"content\"></app-content-design>\n<br/>\n<div [innerHTML]=\"safeContent\"></div>\n", styles: [""], dependencies: [{ kind: "component", type: ContentDesignComponent, selector: "app-content-design", inputs: ["content", "contentLength"], outputs: ["clickEvent"] }] }); }
|
|
971
971
|
}
|
|
972
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
972
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: FormatedTextComponent, decorators: [{
|
|
973
973
|
type: Component,
|
|
974
974
|
args: [{ selector: 'app-formated-text', standalone: true, imports: [ContentDesignComponent], template: "<app-content-design [content] = \"content\"></app-content-design>\n<br/>\n<div [innerHTML]=\"safeContent\"></div>\n" }]
|
|
975
|
-
}], ctorParameters:
|
|
975
|
+
}], ctorParameters: () => [{ type: i1$1.DomSanitizer }], propDecorators: { content: [{
|
|
976
976
|
type: Input
|
|
977
977
|
}] } });
|
|
978
978
|
|
|
@@ -980,13 +980,13 @@ class FooterComponent {
|
|
|
980
980
|
constructor() { }
|
|
981
981
|
ngOnInit() {
|
|
982
982
|
}
|
|
983
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
984
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
983
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
984
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: FooterComponent, isStandalone: true, selector: "app-footer", ngImport: i0, template: "<footer class=\"footer\">\n <div class=\"footer-container\">\n <div class=\"footer-section\">\n <h3>About Us</h3>\n <p>We are a company dedicated to providing excellent services and products to our customers.</p>\n </div>\n\n <div class=\"footer-section\">\n <h3>Quick Links</h3>\n <ul>\n <li><a href=\"#\">Home</a></li>\n <li><a href=\"#\">Services</a></li>\n <li><a href=\"#\">Contact</a></li>\n <li><a href=\"#\">Privacy Policy</a></li>\n </ul>\n </div>\n\n <div class=\"footer-section\">\n <h3>Follow Us</h3>\n <div class=\"social-icons\">\n <a href=\"#\" aria-label=\"Facebook\"><i class=\"fab fa-facebook-f\"></i></a>\n <a href=\"#\" aria-label=\"Twitter\"><i class=\"fab fa-twitter\"></i></a>\n <a href=\"#\" aria-label=\"Instagram\"><i class=\"fab fa-instagram\"></i></a>\n <a href=\"#\" aria-label=\"LinkedIn\"><i class=\"fab fa-linkedin-in\"></i></a>\n </div>\n </div>\n </div>\n\n <div class=\"footer-bottom\">\n <p>© 2024 Your Company. All Rights Reserved.</p>\n </div>\n</footer>\n", styles: [".footer{background-color:#333;color:#fff;padding:20px 0;text-align:center;font-family:Roboto,sans-serif}.footer-container{display:flex;justify-content:space-around;flex-wrap:wrap;max-width:1200px;margin:0 auto}.footer-section{flex:1;margin:15px;min-width:200px}.footer-section h3{margin-bottom:15px;font-size:18px}.footer-section p,.footer-section ul,.footer-section a{font-size:14px;color:#ccc;text-decoration:none}.footer-section ul{list-style:none;padding:0}.footer-section ul li{margin:5px 0}.footer-section ul li a:hover{color:#fff}.social-icons{margin-top:10px}.social-icons a{display:inline-block;color:#ccc;margin:0 10px;font-size:20px}.social-icons a:hover{color:#fff}.footer-bottom{margin-top:20px;border-top:1px solid #444;padding-top:10px;font-size:12px}\n"] }); }
|
|
985
985
|
}
|
|
986
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
986
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: FooterComponent, decorators: [{
|
|
987
987
|
type: Component,
|
|
988
988
|
args: [{ selector: 'app-footer', standalone: true, template: "<footer class=\"footer\">\n <div class=\"footer-container\">\n <div class=\"footer-section\">\n <h3>About Us</h3>\n <p>We are a company dedicated to providing excellent services and products to our customers.</p>\n </div>\n\n <div class=\"footer-section\">\n <h3>Quick Links</h3>\n <ul>\n <li><a href=\"#\">Home</a></li>\n <li><a href=\"#\">Services</a></li>\n <li><a href=\"#\">Contact</a></li>\n <li><a href=\"#\">Privacy Policy</a></li>\n </ul>\n </div>\n\n <div class=\"footer-section\">\n <h3>Follow Us</h3>\n <div class=\"social-icons\">\n <a href=\"#\" aria-label=\"Facebook\"><i class=\"fab fa-facebook-f\"></i></a>\n <a href=\"#\" aria-label=\"Twitter\"><i class=\"fab fa-twitter\"></i></a>\n <a href=\"#\" aria-label=\"Instagram\"><i class=\"fab fa-instagram\"></i></a>\n <a href=\"#\" aria-label=\"LinkedIn\"><i class=\"fab fa-linkedin-in\"></i></a>\n </div>\n </div>\n </div>\n\n <div class=\"footer-bottom\">\n <p>© 2024 Your Company. All Rights Reserved.</p>\n </div>\n</footer>\n", styles: [".footer{background-color:#333;color:#fff;padding:20px 0;text-align:center;font-family:Roboto,sans-serif}.footer-container{display:flex;justify-content:space-around;flex-wrap:wrap;max-width:1200px;margin:0 auto}.footer-section{flex:1;margin:15px;min-width:200px}.footer-section h3{margin-bottom:15px;font-size:18px}.footer-section p,.footer-section ul,.footer-section a{font-size:14px;color:#ccc;text-decoration:none}.footer-section ul{list-style:none;padding:0}.footer-section ul li{margin:5px 0}.footer-section ul li a:hover{color:#fff}.social-icons{margin-top:10px}.social-icons a{display:inline-block;color:#ccc;margin:0 10px;font-size:20px}.social-icons a:hover{color:#fff}.footer-bottom{margin-top:20px;border-top:1px solid #444;padding-top:10px;font-size:12px}\n"] }]
|
|
989
|
-
}], ctorParameters:
|
|
989
|
+
}], ctorParameters: () => [] });
|
|
990
990
|
|
|
991
991
|
class LoginComponent {
|
|
992
992
|
constructor() {
|
|
@@ -1000,13 +1000,13 @@ class LoginComponent {
|
|
|
1000
1000
|
this.buttonContainer.createEmbeddedView(this.buttonTemplate);
|
|
1001
1001
|
}
|
|
1002
1002
|
}
|
|
1003
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1004
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1003
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: LoginComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1004
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: LoginComponent, isStandalone: true, selector: "app-login", inputs: { buttonTemplate: "buttonTemplate" }, viewQueries: [{ propertyName: "buttonContainer", first: true, predicate: ["buttonContainer"], descendants: true }], ngImport: i0, template: "<div class=\"login-page\">\n <div class=\"icon-area\">\n <div class=\"icon\">\n <span>innocons</span>\n </div>\n </div>\n <div class=\"login-button\" id=\"buttonDiv\">\n <ng-template #buttonContainer></ng-template>\n </div>\n</div>\n", styles: [".login-button{width:100%;align-items:center;justify-content:center;display:flex}.login-page{height:100%;width:100%;flex-direction:row;display:flex}.icon-area{width:38%;background-color:#2a76d7;height:100%;display:flex}.icon{width:100%;align-items:center;justify-content:center;display:flex}.icon span{color:#fff;font-size:xxx-large;font-family:fantasy}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
1005
1005
|
}
|
|
1006
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1006
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: LoginComponent, decorators: [{
|
|
1007
1007
|
type: Component,
|
|
1008
1008
|
args: [{ selector: 'app-login', standalone: true, imports: [CommonModule], template: "<div class=\"login-page\">\n <div class=\"icon-area\">\n <div class=\"icon\">\n <span>innocons</span>\n </div>\n </div>\n <div class=\"login-button\" id=\"buttonDiv\">\n <ng-template #buttonContainer></ng-template>\n </div>\n</div>\n", styles: [".login-button{width:100%;align-items:center;justify-content:center;display:flex}.login-page{height:100%;width:100%;flex-direction:row;display:flex}.icon-area{width:38%;background-color:#2a76d7;height:100%;display:flex}.icon{width:100%;align-items:center;justify-content:center;display:flex}.icon span{color:#fff;font-size:xxx-large;font-family:fantasy}\n"] }]
|
|
1009
|
-
}], ctorParameters:
|
|
1009
|
+
}], ctorParameters: () => [], propDecorators: { buttonTemplate: [{
|
|
1010
1010
|
type: Input
|
|
1011
1011
|
}], buttonContainer: [{
|
|
1012
1012
|
type: ViewChild,
|
|
@@ -1030,10 +1030,10 @@ class MenuWidgetComponent {
|
|
|
1030
1030
|
}
|
|
1031
1031
|
}
|
|
1032
1032
|
}
|
|
1033
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1034
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1033
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: MenuWidgetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1034
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: MenuWidgetComponent, isStandalone: true, selector: "app-menu-widget", inputs: { items: "items", position: "position" }, outputs: { itemSelected: "itemSelected" }, ngImport: i0, template: "<div class=\"menu-widget\" [ngStyle]=\"{ top: position.top ?? 'auto', left: position.left, bottom: position.bottom ?? 'auto' }\">\n <ul>\n <li *ngFor=\"let item of items\"\n [class.disabled]=\"item.isToggled\"\n (click)=\"onItemClick(item)\">\n {{ item.label }}\n </li>\n </ul>\n</div>\n", styles: [".menu-widget{position:absolute;background-color:#fff;border:1px solid #ccc;padding:10px;list-style:none;box-shadow:0 2px 10px #0000001a;z-index:1000}.menu-widget ul{margin:0;padding:0;list-style:none}.menu-widget li{padding:8px 12px;cursor:pointer;transition:background-color .2s ease}.menu-widget li:hover{background-color:#f0f0f0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
1035
1035
|
}
|
|
1036
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1036
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: MenuWidgetComponent, decorators: [{
|
|
1037
1037
|
type: Component,
|
|
1038
1038
|
args: [{ selector: 'app-menu-widget', standalone: true, imports: [CommonModule], template: "<div class=\"menu-widget\" [ngStyle]=\"{ top: position.top ?? 'auto', left: position.left, bottom: position.bottom ?? 'auto' }\">\n <ul>\n <li *ngFor=\"let item of items\"\n [class.disabled]=\"item.isToggled\"\n (click)=\"onItemClick(item)\">\n {{ item.label }}\n </li>\n </ul>\n</div>\n", styles: [".menu-widget{position:absolute;background-color:#fff;border:1px solid #ccc;padding:10px;list-style:none;box-shadow:0 2px 10px #0000001a;z-index:1000}.menu-widget ul{margin:0;padding:0;list-style:none}.menu-widget li{padding:8px 12px;cursor:pointer;transition:background-color .2s ease}.menu-widget li:hover{background-color:#f0f0f0}\n"] }]
|
|
1039
1039
|
}], propDecorators: { items: [{
|
|
@@ -1131,13 +1131,13 @@ class MenuComponent {
|
|
|
1131
1131
|
logout() {
|
|
1132
1132
|
this.logoutSelected.emit();
|
|
1133
1133
|
}
|
|
1134
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1135
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1134
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: MenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1135
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: MenuComponent, isStandalone: true, selector: "app-menu", inputs: { menuItems: "menuItems", logoUrl: "logoUrl", logoRouter: "logoRouter", direction: "direction", languageMenuItems: "languageMenuItems", loginUser: "loginUser" }, outputs: { languageSelected: "languageSelected", loginSelected: "loginSelected", logoutSelected: "logoutSelected" }, host: { listeners: { "document:click": "handleClickOutside($event)" } }, ngImport: i0, template: "<nav class=\"menu\" [ngClass]=\"{ 'vertical': isVertical, 'horizontal': !isVertical }\">\n <div class=\"logo\">\n <a [routerLink]=\"logoRouter\">\n <img [src]=\"logoUrl\" alt=\"Logo\" />\n </a>\n </div>\n <ul>\n <li *ngFor=\"let item of menuItems\">\n <a [routerLink]=\"item.route\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: true }\">{{ item.label }}</a>\n </li>\n </ul>\n <div class=\"actions\">\n <!-- Language selector -->\n <div class=\"language\" (click)=\"toggleLanguageMenu($event)\">\n <span class=\"material-icons\" aria-hidden=\"true\">language</span>\n </div>\n <app-menu-widget *ngIf=\"isLanguageMenuVisible\"\n [items]=\"languageMenuItems\"\n (itemSelected)=\"onLanguageSelected($event)\"\n [position]=\"languageMenuPosition\">\n </app-menu-widget>\n\n <!-- Login menu -->\n <div class=\"login\" (click)=\"toggleLoginMenu($event)\">\n <ng-container *ngIf=\"loginUser?.picture; else defaultIcon\">\n <img [src]=\"loginUser?.picture\" alt=\"User Avatar\" class=\"user-avatar\" />\n </ng-container>\n <ng-template #defaultIcon>\n <span class=\"material-icons\" aria-hidden=\"true\">person</span>\n </ng-template>\n </div>\n <app-menu-widget *ngIf=\"isLoginMenuVisible && !loginUser\"\n [items]=\"loginItems\"\n (itemSelected)=\"onLoginMenuItemSelected($event)\"\n [position]=\"loginMenuPosition\">\n </app-menu-widget>\n <app-menu-widget *ngIf=\"isLoginMenuVisible && loginUser\"\n [items]=\"logoutItems\"\n (itemSelected)=\"onLogoutMenuItemSelected($event)\"\n [position]=\"loginMenuPosition\">\n </app-menu-widget>\n </div>\n</nav>\n", styles: [":host{display:flex}.menu{background-color:#f8f9fa;padding:10px;box-shadow:0 2px 5px #0000001a}.menu.vertical{display:flex;justify-content:space-between;flex-direction:column;width:200px}.menu.vertical ul{list-style-type:none;padding:0;height:100%}.menu.vertical ul li{padding:8px 0}.menu.vertical ul li:hover{background-color:#e9ecef;cursor:pointer}.menu.vertical .actions{display:flex;flex-direction:column;align-items:baseline}.menu.horizontal{display:flex;flex-direction:row;width:100%;height:80px}.menu.horizontal ul{display:flex;list-style-type:none;padding:0;margin:0;flex-grow:1;align-items:center}.menu.horizontal ul li a{padding:18px 26px}.menu.horizontal ul li a:hover{background-color:#e9ecef;cursor:pointer}.menu .logo img{width:100%;height:100%;max-height:60px}.menu .actions{display:flex;align-items:center}.menu .actions .language,.menu .actions .login{margin-left:10px}.menu .actions .language img,.menu .actions .login img{border-radius:50%}a{text-decoration:none;color:inherit;display:block;padding:10px;transition:background-color .3s ease}a.active{color:#f6ad15;font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2$2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: MenuWidgetComponent, selector: "app-menu-widget", inputs: ["items", "position"], outputs: ["itemSelected"] }] }); }
|
|
1136
1136
|
}
|
|
1137
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1137
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: MenuComponent, decorators: [{
|
|
1138
1138
|
type: Component,
|
|
1139
1139
|
args: [{ selector: 'app-menu', standalone: true, imports: [CommonModule, RouterModule, MenuWidgetComponent], template: "<nav class=\"menu\" [ngClass]=\"{ 'vertical': isVertical, 'horizontal': !isVertical }\">\n <div class=\"logo\">\n <a [routerLink]=\"logoRouter\">\n <img [src]=\"logoUrl\" alt=\"Logo\" />\n </a>\n </div>\n <ul>\n <li *ngFor=\"let item of menuItems\">\n <a [routerLink]=\"item.route\"\n routerLinkActive=\"active\"\n [routerLinkActiveOptions]=\"{ exact: true }\">{{ item.label }}</a>\n </li>\n </ul>\n <div class=\"actions\">\n <!-- Language selector -->\n <div class=\"language\" (click)=\"toggleLanguageMenu($event)\">\n <span class=\"material-icons\" aria-hidden=\"true\">language</span>\n </div>\n <app-menu-widget *ngIf=\"isLanguageMenuVisible\"\n [items]=\"languageMenuItems\"\n (itemSelected)=\"onLanguageSelected($event)\"\n [position]=\"languageMenuPosition\">\n </app-menu-widget>\n\n <!-- Login menu -->\n <div class=\"login\" (click)=\"toggleLoginMenu($event)\">\n <ng-container *ngIf=\"loginUser?.picture; else defaultIcon\">\n <img [src]=\"loginUser?.picture\" alt=\"User Avatar\" class=\"user-avatar\" />\n </ng-container>\n <ng-template #defaultIcon>\n <span class=\"material-icons\" aria-hidden=\"true\">person</span>\n </ng-template>\n </div>\n <app-menu-widget *ngIf=\"isLoginMenuVisible && !loginUser\"\n [items]=\"loginItems\"\n (itemSelected)=\"onLoginMenuItemSelected($event)\"\n [position]=\"loginMenuPosition\">\n </app-menu-widget>\n <app-menu-widget *ngIf=\"isLoginMenuVisible && loginUser\"\n [items]=\"logoutItems\"\n (itemSelected)=\"onLogoutMenuItemSelected($event)\"\n [position]=\"loginMenuPosition\">\n </app-menu-widget>\n </div>\n</nav>\n", styles: [":host{display:flex}.menu{background-color:#f8f9fa;padding:10px;box-shadow:0 2px 5px #0000001a}.menu.vertical{display:flex;justify-content:space-between;flex-direction:column;width:200px}.menu.vertical ul{list-style-type:none;padding:0;height:100%}.menu.vertical ul li{padding:8px 0}.menu.vertical ul li:hover{background-color:#e9ecef;cursor:pointer}.menu.vertical .actions{display:flex;flex-direction:column;align-items:baseline}.menu.horizontal{display:flex;flex-direction:row;width:100%;height:80px}.menu.horizontal ul{display:flex;list-style-type:none;padding:0;margin:0;flex-grow:1;align-items:center}.menu.horizontal ul li a{padding:18px 26px}.menu.horizontal ul li a:hover{background-color:#e9ecef;cursor:pointer}.menu .logo img{width:100%;height:100%;max-height:60px}.menu .actions{display:flex;align-items:center}.menu .actions .language,.menu .actions .login{margin-left:10px}.menu .actions .language img,.menu .actions .login img{border-radius:50%}a{text-decoration:none;color:inherit;display:block;padding:10px;transition:background-color .3s ease}a.active{color:#f6ad15;font-weight:700}\n"] }]
|
|
1140
|
-
}], ctorParameters:
|
|
1140
|
+
}], ctorParameters: () => [], propDecorators: { menuItems: [{
|
|
1141
1141
|
type: Input
|
|
1142
1142
|
}], logoUrl: [{
|
|
1143
1143
|
type: Input
|
|
@@ -1172,13 +1172,13 @@ class VersionComponent {
|
|
|
1172
1172
|
}
|
|
1173
1173
|
ngOnInit() {
|
|
1174
1174
|
}
|
|
1175
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1176
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1175
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: VersionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1176
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: VersionComponent, isStandalone: true, selector: "app-version", ngImport: i0, template: "<app-content-design\n[content] = \"content\">\n</app-content-design>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContentDesignComponent, selector: "app-content-design", inputs: ["content", "contentLength"], outputs: ["clickEvent"] }] }); }
|
|
1177
1177
|
}
|
|
1178
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1178
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: VersionComponent, decorators: [{
|
|
1179
1179
|
type: Component,
|
|
1180
1180
|
args: [{ selector: 'app-version', standalone: true, imports: [CommonModule, ContentDesignComponent], template: "<app-content-design\n[content] = \"content\">\n</app-content-design>\n" }]
|
|
1181
|
-
}], ctorParameters:
|
|
1181
|
+
}], ctorParameters: () => [] });
|
|
1182
1182
|
|
|
1183
1183
|
class DetailComponent {
|
|
1184
1184
|
constructor() { }
|
|
@@ -1187,13 +1187,13 @@ class DetailComponent {
|
|
|
1187
1187
|
get hasTemplate() {
|
|
1188
1188
|
return this.content && !!this.content.template;
|
|
1189
1189
|
}
|
|
1190
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1191
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1190
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: DetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1191
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.4", type: DetailComponent, isStandalone: true, selector: "app-detail", inputs: { content: "content" }, ngImport: i0, template: "<div class=\"modal-body\">\n <ng-container *ngIf=\"hasTemplate\">\n <ng-container *ngTemplateOutlet=\"content.template; context: content.params\"></ng-container>\n <br/>\n <div>Comment here</div>\n </ng-container>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
|
|
1192
1192
|
}
|
|
1193
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1193
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.4", ngImport: i0, type: DetailComponent, decorators: [{
|
|
1194
1194
|
type: Component,
|
|
1195
1195
|
args: [{ selector: 'app-detail', standalone: true, imports: [CommonModule], template: "<div class=\"modal-body\">\n <ng-container *ngIf=\"hasTemplate\">\n <ng-container *ngTemplateOutlet=\"content.template; context: content.params\"></ng-container>\n <br/>\n <div>Comment here</div>\n </ng-container>\n</div>\n" }]
|
|
1196
|
-
}], ctorParameters:
|
|
1196
|
+
}], ctorParameters: () => [], propDecorators: { content: [{
|
|
1197
1197
|
type: Input
|
|
1198
1198
|
}] } });
|
|
1199
1199
|
|