@decaf-ts/for-angular 0.0.70 → 0.0.71
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.
|
@@ -5446,8 +5446,9 @@ class NgxSvgDirective {
|
|
|
5446
5446
|
}
|
|
5447
5447
|
ngOnInit() {
|
|
5448
5448
|
this.path = this.path?.trim() || this.element?.nativeElement?.getAttribute('src')?.trim() || '';
|
|
5449
|
-
if (this.path)
|
|
5449
|
+
if (this.path) {
|
|
5450
5450
|
this.mediaService.loadSvgObserver(this.http, this.path, this.element.nativeElement);
|
|
5451
|
+
}
|
|
5451
5452
|
}
|
|
5452
5453
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: NgxSvgDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
5453
5454
|
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: NgxSvgDirective, isStandalone: true, selector: "[ngx-decaf-svg]", inputs: { path: ["ngx-decaf-svg", "path"] }, ngImport: i0 }); }
|
|
@@ -5496,7 +5497,7 @@ let IconComponent = class IconComponent {
|
|
|
5496
5497
|
this.initialized = true;
|
|
5497
5498
|
}
|
|
5498
5499
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5499
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: IconComponent, isStandalone: true, selector: "ngx-decaf-icon", inputs: { name: "name", color: "color", slot: "slot", button: "button", buttonFill: "buttonFill", buttonShape: "buttonShape", width: "width", size: "size", inline: "inline" }, host: { properties: { "attr.id": "uid", "attr.aria-hidden": "!button" } }, viewQueries: [{ propertyName: "component", first: true, predicate: ["component"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"dcf-icon-component\" #component>\n @if (initialized) {\n @if (button) {\n <ion-button [fill]=\"buttonFill\" [shape]=\"buttonShape\" [color]=\"isDarkMode ? 'light' : color\" [size]=\"size\">\n @if (type === \"image\") {\n @if (isSvg) {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"color ? 'dcf-color-' + color : ''\"\n [style.width]=\"width\"\n [ngx-decaf-svg]=\"name\"\n ></span>\n } @else {\n <img\n aria-hidden=\"true\"\n [alt]=\"name\"\n [title]=\"name\"\n [slot]=\"slot\"\n [src]=\"name\"\n [style.width]=\"width\"\n title=\"icon\"\n />\n }\n }\n @if(type === 'ionic') {\n <ion-icon\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [ios]=\"name\"\n [md]=\"name\"\n [color]=\"isDarkMode ? 'light' : color\"\n [name]=\"name\"\n />\n }\n @if(type === 'icon') {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"'dcf-icon-button ti ' +name + ' ' + size + ' dcf-color-' + color\">\n </span>\n }\n </ion-button>\n } @else {\n @if (type === \"image\") {\n @if (isSvg) {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"color ? 'dcf-color-' + color : ''\"\n [style.width]=\"width\"\n [ngx-decaf-svg]=\"name\"\n >\n </span>\n } @else {\n <img\n aria-hidden=\"true\"\n [alt]=\"name\"\n [title]=\"name\"\n [slot]=\"slot\"\n [src]=\"name\"\n [style.width]=\"width\"\n title=\"icon\"\n />\n }\n }\n @if (type === \"ionic\") {\n <ion-icon\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [ios]=\"name\"\n [md]=\"name\"\n [size]=\"size\"\n [color]=\"isDarkMode ? 'light' : color\"\n [name]=\"name\"\n />\n }\n @if(type === 'icon') {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"'ti ' + name + ' ' + size + ' dcf-color-' + color\">\n </span>\n }\n }\n }\n</div>\n", styles: [":host{overflow:hidden!important}.dcf-icon-component{overflow:hidden!important}::ng-deep .dcf-icon.dcf-palette-dark ion-icon{color:var(--dcf-text-color)!important}::ng-deep .dcf-icon.dcf-palette-dark svg{fill:var(--dcf-text-color);fill-opacity:.25!important;stroke:var(--dcf-text-color)!important}::ng-deep .dcf-icon.dcf-palette-dark svg *{fill:var(--dcf-color-primary)!important;stroke:var(--dcf-color-gray-1)!important}ion-button{cursor:pointer!important}.dcf-icon-component ion-icon:not([size]){font-size:1.35rem!important}[class*=\"ti ti-\"]{font-size:1.4rem;line-height:1.4rem;position:relative}[class*=\"ti ti-\"]:not(.dcf-icon-button){margin-right:.125rem}[class*=\"ti ti-\"].large,[class*=\"ti ti-\"][size=large]{font-size:2.2rem!important;top:2.5px!important}[class*=\"ti ti-\"].small,[class*=\"ti ti-\"][size=small]{font-size:1rem;top:1px!important}[class*=\"ti ti-\"][color=primary],[class*=\"ti ti-\"][class*=color-primary]{color:var(--dcf-color-primary)}[class*=\"ti ti-\"][color=danger],[class*=\"ti ti-\"][class*=color-danger]{color:var(--dcf-color-danger)}[class*=\"ti ti-\"][color=warning],[class*=\"ti ti-\"][class*=color-warning]{color:var(--dcf-color-warning)}[class*=\"ti ti-\"][color=success],[class*=\"ti ti-\"][class*=color-success]{color:var(--dcf-color-success)}[class*=\"ti ti-\"][color=secondary],[class*=\"ti ti-\"][class*=color-secondary]{color:var(--dcf-color-secondary)}[class*=\"ti ti-\"][color=tertiary],[class*=\"ti ti-\"][class*=color-tertiary]{color:var(--dcf-color-tertiary)}[class*=\"ti ti-\"][color=light],[class*=\"ti ti-\"][class*=color-light]{color:var(--dcf-color-light)}[class*=\"ti ti-\"][color=medium],[class*=\"ti ti-\"][class*=color-medium]{color:var(--dcf-color-medium-tint)}[class*=\"ti ti-\"][color=dark],[class*=\"ti ti-\"][class*=color-dark]{color:var(--dcf-color-dark)}\n"], dependencies: [{ kind: "directive", type: NgxSvgDirective, selector: "[ngx-decaf-svg]", inputs: ["ngx-decaf-svg"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }] }); }
|
|
5500
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: IconComponent, isStandalone: true, selector: "ngx-decaf-icon", inputs: { name: "name", color: "color", slot: "slot", button: "button", buttonFill: "buttonFill", buttonShape: "buttonShape", width: "width", size: "size", inline: "inline" }, host: { properties: { "attr.id": "uid", "attr.aria-hidden": "!button" } }, viewQueries: [{ propertyName: "component", first: true, predicate: ["component"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"dcf-icon-component\" #component>\n @if (initialized) {\n @if (button) {\n <ion-button [fill]=\"buttonFill\" [shape]=\"buttonShape\" [color]=\"isDarkMode ? 'light' : color\" [size]=\"size\">\n @if (type === \"image\") {\n @if (isSvg) {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"color ? 'dcf-color-' + color : ''\"\n [style.width]=\"width\"\n [ngx-decaf-svg]=\"name\"\n ></span>\n } @else {\n <img\n aria-hidden=\"true\"\n [alt]=\"name\"\n [title]=\"name\"\n [slot]=\"slot\"\n [src]=\"name\"\n [style.width]=\"width\"\n title=\"icon\"\n />\n }\n }\n @if(type === 'ionic') {\n <ion-icon\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [ios]=\"name\"\n [md]=\"name\"\n [color]=\"isDarkMode ? 'light' : color\"\n [name]=\"name\"\n />\n }\n @if(type === 'icon') {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"'dcf-icon-button ti ' +name + ' ' + size + ' dcf-color-' + color\">\n </span>\n }\n </ion-button>\n } @else {\n @if (type === \"image\") {\n @if (isSvg) {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"color ? 'dcf-color-' + color : ''\"\n [style.width]=\"width\"\n [ngx-decaf-svg]=\"name\"\n >\n </span>\n } @else {\n <img\n aria-hidden=\"true\"\n [alt]=\"name\"\n [title]=\"name\"\n [slot]=\"slot\"\n [src]=\"name\"\n [style.width]=\"width\"\n title=\"icon\"\n />\n }\n }\n @if (type === \"ionic\") {\n <ion-icon\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [ios]=\"name\"\n [md]=\"name\"\n [size]=\"size\"\n [color]=\"isDarkMode ? 'light' : color\"\n [name]=\"name\"\n />\n }\n @if(type === 'icon') {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"'ti ' + name + ' ' + size + ' dcf-color-' + color\">\n </span>\n }\n }\n }\n</div>\n", styles: [":host{overflow:hidden!important}.dcf-icon-component{overflow:hidden!important}::ng-deep .dcf-icon.dcf-palette-dark ion-icon{color:var(--dcf-text-color)!important}::ng-deep .dcf-icon.dcf-palette-dark svg{fill:var(--dcf-text-color);fill-opacity:.25!important;stroke:var(--dcf-text-color)!important}::ng-deep .dcf-icon.dcf-palette-dark svg *{fill:var(--dcf-color-primary)!important;stroke:var(--dcf-color-gray-1)!important}ion-button{cursor:pointer!important}.dcf-icon-component ion-icon:not([size]){font-size:1.35rem!important}[class*=\"ti ti-\"]{font-size:1.4rem;line-height:1.4rem;position:relative}[class*=\"ti ti-\"]:not(.dcf-icon-button){margin-right:.125rem}[class*=\"ti ti-\"].large,[class*=\"ti ti-\"][size=large]{font-size:2.2rem!important;top:2.5px!important}[class*=\"ti ti-\"].small,[class*=\"ti ti-\"][size=small]{font-size:1rem;top:1px!important}[class*=\"ti ti-\"][color=primary],[class*=\"ti ti-\"][class*=color-primary]{color:var(--dcf-color-primary)}[class*=\"ti ti-\"][color=danger],[class*=\"ti ti-\"][class*=color-danger]{color:var(--dcf-color-danger)}[class*=\"ti ti-\"][color=warning],[class*=\"ti ti-\"][class*=color-warning]{color:var(--dcf-color-warning)}[class*=\"ti ti-\"][color=success],[class*=\"ti ti-\"][class*=color-success]{color:var(--dcf-color-success)}[class*=\"ti ti-\"][color=secondary],[class*=\"ti ti-\"][class*=color-secondary]{color:var(--dcf-color-secondary)}[class*=\"ti ti-\"][color=tertiary],[class*=\"ti ti-\"][class*=color-tertiary]{color:var(--dcf-color-tertiary)}[class*=\"ti ti-\"][color=light],[class*=\"ti ti-\"][class*=color-light]{color:var(--dcf-color-light)}[class*=\"ti ti-\"][color=medium],[class*=\"ti ti-\"][class*=color-medium]{color:var(--dcf-color-medium-tint)}[class*=\"ti ti-\"][color=dark],[class*=\"ti ti-\"][class*=color-dark]{color:var(--dcf-color-dark)!important}\n"], dependencies: [{ kind: "directive", type: NgxSvgDirective, selector: "[ngx-decaf-svg]", inputs: ["ngx-decaf-svg"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }] }); }
|
|
5500
5501
|
};
|
|
5501
5502
|
IconComponent = __decorate([
|
|
5502
5503
|
Dynamic(),
|
|
@@ -5504,7 +5505,7 @@ IconComponent = __decorate([
|
|
|
5504
5505
|
], IconComponent);
|
|
5505
5506
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IconComponent, decorators: [{
|
|
5506
5507
|
type: Component,
|
|
5507
|
-
args: [{ selector: 'ngx-decaf-icon', imports: [NgxSvgDirective, IonIcon, IonButton], standalone: true, host: { '[attr.id]': 'uid', '[attr.aria-hidden]': '!button' }, template: "<div class=\"dcf-icon-component\" #component>\n @if (initialized) {\n @if (button) {\n <ion-button [fill]=\"buttonFill\" [shape]=\"buttonShape\" [color]=\"isDarkMode ? 'light' : color\" [size]=\"size\">\n @if (type === \"image\") {\n @if (isSvg) {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"color ? 'dcf-color-' + color : ''\"\n [style.width]=\"width\"\n [ngx-decaf-svg]=\"name\"\n ></span>\n } @else {\n <img\n aria-hidden=\"true\"\n [alt]=\"name\"\n [title]=\"name\"\n [slot]=\"slot\"\n [src]=\"name\"\n [style.width]=\"width\"\n title=\"icon\"\n />\n }\n }\n @if(type === 'ionic') {\n <ion-icon\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [ios]=\"name\"\n [md]=\"name\"\n [color]=\"isDarkMode ? 'light' : color\"\n [name]=\"name\"\n />\n }\n @if(type === 'icon') {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"'dcf-icon-button ti ' +name + ' ' + size + ' dcf-color-' + color\">\n </span>\n }\n </ion-button>\n } @else {\n @if (type === \"image\") {\n @if (isSvg) {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"color ? 'dcf-color-' + color : ''\"\n [style.width]=\"width\"\n [ngx-decaf-svg]=\"name\"\n >\n </span>\n } @else {\n <img\n aria-hidden=\"true\"\n [alt]=\"name\"\n [title]=\"name\"\n [slot]=\"slot\"\n [src]=\"name\"\n [style.width]=\"width\"\n title=\"icon\"\n />\n }\n }\n @if (type === \"ionic\") {\n <ion-icon\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [ios]=\"name\"\n [md]=\"name\"\n [size]=\"size\"\n [color]=\"isDarkMode ? 'light' : color\"\n [name]=\"name\"\n />\n }\n @if(type === 'icon') {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"'ti ' + name + ' ' + size + ' dcf-color-' + color\">\n </span>\n }\n }\n }\n</div>\n", styles: [":host{overflow:hidden!important}.dcf-icon-component{overflow:hidden!important}::ng-deep .dcf-icon.dcf-palette-dark ion-icon{color:var(--dcf-text-color)!important}::ng-deep .dcf-icon.dcf-palette-dark svg{fill:var(--dcf-text-color);fill-opacity:.25!important;stroke:var(--dcf-text-color)!important}::ng-deep .dcf-icon.dcf-palette-dark svg *{fill:var(--dcf-color-primary)!important;stroke:var(--dcf-color-gray-1)!important}ion-button{cursor:pointer!important}.dcf-icon-component ion-icon:not([size]){font-size:1.35rem!important}[class*=\"ti ti-\"]{font-size:1.4rem;line-height:1.4rem;position:relative}[class*=\"ti ti-\"]:not(.dcf-icon-button){margin-right:.125rem}[class*=\"ti ti-\"].large,[class*=\"ti ti-\"][size=large]{font-size:2.2rem!important;top:2.5px!important}[class*=\"ti ti-\"].small,[class*=\"ti ti-\"][size=small]{font-size:1rem;top:1px!important}[class*=\"ti ti-\"][color=primary],[class*=\"ti ti-\"][class*=color-primary]{color:var(--dcf-color-primary)}[class*=\"ti ti-\"][color=danger],[class*=\"ti ti-\"][class*=color-danger]{color:var(--dcf-color-danger)}[class*=\"ti ti-\"][color=warning],[class*=\"ti ti-\"][class*=color-warning]{color:var(--dcf-color-warning)}[class*=\"ti ti-\"][color=success],[class*=\"ti ti-\"][class*=color-success]{color:var(--dcf-color-success)}[class*=\"ti ti-\"][color=secondary],[class*=\"ti ti-\"][class*=color-secondary]{color:var(--dcf-color-secondary)}[class*=\"ti ti-\"][color=tertiary],[class*=\"ti ti-\"][class*=color-tertiary]{color:var(--dcf-color-tertiary)}[class*=\"ti ti-\"][color=light],[class*=\"ti ti-\"][class*=color-light]{color:var(--dcf-color-light)}[class*=\"ti ti-\"][color=medium],[class*=\"ti ti-\"][class*=color-medium]{color:var(--dcf-color-medium-tint)}[class*=\"ti ti-\"][color=dark],[class*=\"ti ti-\"][class*=color-dark]{color:var(--dcf-color-dark)}\n"] }]
|
|
5508
|
+
args: [{ selector: 'ngx-decaf-icon', imports: [NgxSvgDirective, IonIcon, IonButton], standalone: true, host: { '[attr.id]': 'uid', '[attr.aria-hidden]': '!button' }, template: "<div class=\"dcf-icon-component\" #component>\n @if (initialized) {\n @if (button) {\n <ion-button [fill]=\"buttonFill\" [shape]=\"buttonShape\" [color]=\"isDarkMode ? 'light' : color\" [size]=\"size\">\n @if (type === \"image\") {\n @if (isSvg) {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"color ? 'dcf-color-' + color : ''\"\n [style.width]=\"width\"\n [ngx-decaf-svg]=\"name\"\n ></span>\n } @else {\n <img\n aria-hidden=\"true\"\n [alt]=\"name\"\n [title]=\"name\"\n [slot]=\"slot\"\n [src]=\"name\"\n [style.width]=\"width\"\n title=\"icon\"\n />\n }\n }\n @if(type === 'ionic') {\n <ion-icon\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [ios]=\"name\"\n [md]=\"name\"\n [color]=\"isDarkMode ? 'light' : color\"\n [name]=\"name\"\n />\n }\n @if(type === 'icon') {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"'dcf-icon-button ti ' +name + ' ' + size + ' dcf-color-' + color\">\n </span>\n }\n </ion-button>\n } @else {\n @if (type === \"image\") {\n @if (isSvg) {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"color ? 'dcf-color-' + color : ''\"\n [style.width]=\"width\"\n [ngx-decaf-svg]=\"name\"\n >\n </span>\n } @else {\n <img\n aria-hidden=\"true\"\n [alt]=\"name\"\n [title]=\"name\"\n [slot]=\"slot\"\n [src]=\"name\"\n [style.width]=\"width\"\n title=\"icon\"\n />\n }\n }\n @if (type === \"ionic\") {\n <ion-icon\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [ios]=\"name\"\n [md]=\"name\"\n [size]=\"size\"\n [color]=\"isDarkMode ? 'light' : color\"\n [name]=\"name\"\n />\n }\n @if(type === 'icon') {\n <span\n aria-hidden=\"true\"\n [slot]=\"slot\"\n [class]=\"'ti ' + name + ' ' + size + ' dcf-color-' + color\">\n </span>\n }\n }\n }\n</div>\n", styles: [":host{overflow:hidden!important}.dcf-icon-component{overflow:hidden!important}::ng-deep .dcf-icon.dcf-palette-dark ion-icon{color:var(--dcf-text-color)!important}::ng-deep .dcf-icon.dcf-palette-dark svg{fill:var(--dcf-text-color);fill-opacity:.25!important;stroke:var(--dcf-text-color)!important}::ng-deep .dcf-icon.dcf-palette-dark svg *{fill:var(--dcf-color-primary)!important;stroke:var(--dcf-color-gray-1)!important}ion-button{cursor:pointer!important}.dcf-icon-component ion-icon:not([size]){font-size:1.35rem!important}[class*=\"ti ti-\"]{font-size:1.4rem;line-height:1.4rem;position:relative}[class*=\"ti ti-\"]:not(.dcf-icon-button){margin-right:.125rem}[class*=\"ti ti-\"].large,[class*=\"ti ti-\"][size=large]{font-size:2.2rem!important;top:2.5px!important}[class*=\"ti ti-\"].small,[class*=\"ti ti-\"][size=small]{font-size:1rem;top:1px!important}[class*=\"ti ti-\"][color=primary],[class*=\"ti ti-\"][class*=color-primary]{color:var(--dcf-color-primary)}[class*=\"ti ti-\"][color=danger],[class*=\"ti ti-\"][class*=color-danger]{color:var(--dcf-color-danger)}[class*=\"ti ti-\"][color=warning],[class*=\"ti ti-\"][class*=color-warning]{color:var(--dcf-color-warning)}[class*=\"ti ti-\"][color=success],[class*=\"ti ti-\"][class*=color-success]{color:var(--dcf-color-success)}[class*=\"ti ti-\"][color=secondary],[class*=\"ti ti-\"][class*=color-secondary]{color:var(--dcf-color-secondary)}[class*=\"ti ti-\"][color=tertiary],[class*=\"ti ti-\"][class*=color-tertiary]{color:var(--dcf-color-tertiary)}[class*=\"ti ti-\"][color=light],[class*=\"ti ti-\"][class*=color-light]{color:var(--dcf-color-light)}[class*=\"ti ti-\"][color=medium],[class*=\"ti ti-\"][class*=color-medium]{color:var(--dcf-color-medium-tint)}[class*=\"ti ti-\"][color=dark],[class*=\"ti ti-\"][class*=color-dark]{color:var(--dcf-color-dark)!important}\n"] }]
|
|
5508
5509
|
}], ctorParameters: () => [], propDecorators: { component: [{
|
|
5509
5510
|
type: ViewChild,
|
|
5510
5511
|
args: ['component', { read: ElementRef, static: false }]
|
|
@@ -8934,7 +8935,6 @@ let FilterComponent = class FilterComponent extends NgxComponentDirective {
|
|
|
8934
8935
|
getIndexes() {
|
|
8935
8936
|
if (this.model)
|
|
8936
8937
|
this.indexes = Object.keys(Model.indexes(this.model) || {});
|
|
8937
|
-
console.log(this);
|
|
8938
8938
|
if (!this.disableSort) {
|
|
8939
8939
|
this.sortBy = [...this.sortBy, ...this.indexes];
|
|
8940
8940
|
if (this.repository) {
|
|
@@ -10101,6 +10101,20 @@ let ListComponent = class ListComponent extends NgxComponentDirective {
|
|
|
10101
10101
|
async ngOnDestroy() {
|
|
10102
10102
|
await this.destroy();
|
|
10103
10103
|
}
|
|
10104
|
+
/**
|
|
10105
|
+
* @description Releases component resources and unregisters repository observers.
|
|
10106
|
+
* @summary Invoked by Angular teardown logic to ensure the base directive and any
|
|
10107
|
+
* attached repositories stop emitting events, preventing memory leaks when the
|
|
10108
|
+
* list component leaves the DOM.
|
|
10109
|
+
*
|
|
10110
|
+
* The method performs the following actions:
|
|
10111
|
+
* - Delegates to the parent directive's `ngOnDestroy` for shared cleanup
|
|
10112
|
+
* - Detaches the repository observer when one is registered
|
|
10113
|
+
* - Catches and logs repository errors to avoid bubbling failures
|
|
10114
|
+
* - Clears internal references to large objects so they can be garbage collected
|
|
10115
|
+
*
|
|
10116
|
+
* @returns {Promise<void>} Resolves when every teardown step completes.
|
|
10117
|
+
*/
|
|
10104
10118
|
async destroy() {
|
|
10105
10119
|
await super.ngOnDestroy();
|
|
10106
10120
|
if (this._repository && this.repositoryObserver) {
|
|
@@ -10118,6 +10132,24 @@ let ListComponent = class ListComponent extends NgxComponentDirective {
|
|
|
10118
10132
|
}
|
|
10119
10133
|
this.data = this.model = this._repository = this.paginator = undefined;
|
|
10120
10134
|
}
|
|
10135
|
+
/**
|
|
10136
|
+
* @description Produces the sanitized mapper configuration.
|
|
10137
|
+
* @summary Merges the component mapper with the primary key metadata and filters
|
|
10138
|
+
* non-string entries so downstream rendering logic only receives valid bindings.
|
|
10139
|
+
*
|
|
10140
|
+
* @protected
|
|
10141
|
+
* @returns {KeyValue} A mapper object that contains string values mapped to the
|
|
10142
|
+
* component's public keys.
|
|
10143
|
+
*/
|
|
10144
|
+
get _mapper() {
|
|
10145
|
+
this.mapper = { ...this.mapper, ...{ uid: this.pk } };
|
|
10146
|
+
return Object.keys(this.mapper).reduce((accum, curr) => {
|
|
10147
|
+
const mapper = this.mapper[curr];
|
|
10148
|
+
if (typeof mapper === 'string')
|
|
10149
|
+
accum[curr] = mapper;
|
|
10150
|
+
return accum;
|
|
10151
|
+
}, {});
|
|
10152
|
+
}
|
|
10121
10153
|
/**
|
|
10122
10154
|
* @description Refreshes the list data from the configured source.
|
|
10123
10155
|
* @summary This method handles both initial data loading and subsequent refresh operations,
|
|
@@ -10841,7 +10873,7 @@ let ListComponent = class ListComponent extends NgxComponentDirective {
|
|
|
10841
10873
|
if (!data || !data.length)
|
|
10842
10874
|
return [];
|
|
10843
10875
|
// passing uid as prop to mapper
|
|
10844
|
-
this.mapper =
|
|
10876
|
+
this.mapper = this._mapper;
|
|
10845
10877
|
const props = Object.assign({
|
|
10846
10878
|
operations: this.operations,
|
|
10847
10879
|
route: this.route,
|
|
@@ -10870,7 +10902,7 @@ let ListComponent = class ListComponent extends NgxComponentDirective {
|
|
|
10870
10902
|
.join(', ');
|
|
10871
10903
|
}
|
|
10872
10904
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10873
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ListComponent, isStandalone: true, selector: "ngx-decaf-list", inputs: { type: "type", showSearchbar: "showSearchbar", searchbarPlaceholder: "searchbarPlaceholder", data: "data", source: "source", start: "start", limit: "limit", loadMoreData: "loadMoreData", lines: "lines", inset: "inset", scrollThreshold: "scrollThreshold", scrollPosition: "scrollPosition", loadingText: "loadingText", showRefresher: "showRefresher", createButton: "createButton", loadingSpinner: "loadingSpinner", enableFilter: "enableFilter", sortBy: "sortBy", sortDirection: "sortDirection", disableSort: "disableSort", empty: "empty" }, outputs: { clickEvent: "clickEvent" }, host: { listeners: { "window:ListItemClickEvent": "handleClick($event)", "window:searchbarEvent": "handleSearch($event)" }, properties: { "attr.id": "uid" } }, usesInheritance: true, ngImport: i0, template: "\n@if (showRefresher) {\n <ion-refresher slot=\"fixed\" [pullFactor]=\"1\" [pullMin]=\"100\" [pullMax]=\"200\" (ionRefresh)=\"handleRefresh($event)\">\n <ion-refresher-content />\n </ion-refresher>\n}\n\n@if (showSearchbar) {\n <div [hidden]=\"!data?.length && !searching\">\n <div class=\"dcf-grid dcf-grid-small dcf-grid-actions\">\n <div class=\"dcf-width-expand@m dcf-width-1-1\">\n @if (model && enableFilter) {\n @if (data?.length || searching) {\n <ngx-decaf-filter\n [model]=\"model\"\n [indexes]=\"indexes ?? []\"\n [sortDirection]=\"sortDirection\"\n [disableSort]=\"disableSort\"\n (filterEvent)=\"handleFilter($event)\"\n (searchEvent)=\"handleSearch($event)\"\n />\n }\n } @else {\n <ngx-decaf-searchbar [placeholder]=\"searchbarPlaceholder\" [emitEventToWindow]=\"false\" [debounce]=\"500\" (searchEvent)=\"handleSearch($event)\" />\n }\n </div>\n @if(createButton) {\n <div class=\"dcf-width-auto@m dcf-button-container dcf-width-1-1 dcf-flex-middle dcf-flex dcf-flex-center dcf-flex-right@m\">\n <div>\n <ion-button expand=\"block\" (click)=\"changeOperation(OperationKeys.CREATE)\">Create</ion-button>\n </div>\n </div>\n }\n </div>\n </div>\n}\n@if (initialized && data?.length) {\n <ion-list [id]=\"uid\" [inset]=\"inset\" [lines]=\"lines\">\n @if (item?.tag) {\n @for(child of items; track trackItemFn($index, child)) {\n <ngx-decaf-component-renderer\n [tag]=\"item.tag\"\n (listenEvent)=\"handleEvent($event)\"\n [globals]='{\n item: child,\n mapper: mapper,\n route: route,\n model: child\n }'>\n </ngx-decaf-component-renderer>\n }\n } @else {\n <ng-content></ng-content>\n }\n </ion-list>\n\n @if (loadMoreData) {\n @if (pages > 0 && type === 'paginated' && !searchValue?.length) {\n <ngx-decaf-pagination\n [totalPages]=\"pages\"\n [current]=\"page\"\n (clickEvent)=\"handlePaginate($event)\"\n />\n\n } @else {\n <ion-infinite-scroll\n [class]=\"searchValue?.length ? 'dcf-hidden' : ''\"\n\n [position]=\"scrollPosition\"\n [threshold]=\"scrollThreshold\"\n (ionInfinite)=\"handleRefresh($event)\">\n <ion-infinite-scroll-content [loadingSpinner]=\"loadingSpinner\" [loadingText]=\"loadingText\" />\n </ion-infinite-scroll>\n }\n }\n} @else {\n @if (refreshing) {\n @for(skl of skeletonData; track $index) {\n <ion-item>\n <ion-thumbnail slot=\"start\">\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n </ion-thumbnail>\n <ion-label>\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n <ion-text class=\"date\" style=\"width: 20%;\"
|
|
10905
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ListComponent, isStandalone: true, selector: "ngx-decaf-list", inputs: { type: "type", showSearchbar: "showSearchbar", searchbarPlaceholder: "searchbarPlaceholder", data: "data", source: "source", start: "start", limit: "limit", loadMoreData: "loadMoreData", lines: "lines", inset: "inset", scrollThreshold: "scrollThreshold", scrollPosition: "scrollPosition", loadingText: "loadingText", showRefresher: "showRefresher", createButton: "createButton", loadingSpinner: "loadingSpinner", enableFilter: "enableFilter", sortBy: "sortBy", sortDirection: "sortDirection", disableSort: "disableSort", empty: "empty" }, outputs: { clickEvent: "clickEvent" }, host: { listeners: { "window:ListItemClickEvent": "handleClick($event)", "window:searchbarEvent": "handleSearch($event)" }, properties: { "attr.id": "uid" } }, usesInheritance: true, ngImport: i0, template: "\n@if (showRefresher) {\n <ion-refresher slot=\"fixed\" [pullFactor]=\"1\" [pullMin]=\"100\" [pullMax]=\"200\" (ionRefresh)=\"handleRefresh($event)\">\n <ion-refresher-content />\n </ion-refresher>\n}\n\n@if (showSearchbar) {\n <div [hidden]=\"!data?.length && !searching\">\n <div class=\"dcf-grid dcf-grid-small dcf-grid-actions\">\n <div class=\"dcf-width-expand@m dcf-width-1-1\">\n @if (model && enableFilter) {\n @if (data?.length || searching) {\n <ngx-decaf-filter\n [model]=\"model\"\n [indexes]=\"indexes ?? []\"\n [sortDirection]=\"sortDirection\"\n [disableSort]=\"disableSort\"\n (filterEvent)=\"handleFilter($event)\"\n (searchEvent)=\"handleSearch($event)\"\n />\n }\n } @else {\n <ngx-decaf-searchbar [placeholder]=\"searchbarPlaceholder\" [emitEventToWindow]=\"false\" [debounce]=\"500\" (searchEvent)=\"handleSearch($event)\" />\n }\n </div>\n @if(createButton) {\n <div class=\"dcf-width-auto@m dcf-button-container dcf-width-1-1 dcf-flex-middle dcf-flex dcf-flex-center dcf-flex-right@m\">\n <div>\n <ion-button expand=\"block\" (click)=\"changeOperation(OperationKeys.CREATE)\">Create</ion-button>\n </div>\n </div>\n }\n </div>\n </div>\n}\n@if (initialized && data?.length) {\n <ion-list [id]=\"uid\" [inset]=\"inset\" [lines]=\"lines\">\n @if (item?.tag) {\n @for(child of items; track trackItemFn($index, child)) {\n <ngx-decaf-component-renderer\n [tag]=\"item.tag\"\n (listenEvent)=\"handleEvent($event)\"\n [globals]='{\n item: child,\n mapper: mapper,\n route: route,\n model: child\n }'>\n </ngx-decaf-component-renderer>\n }\n } @else {\n <ng-content></ng-content>\n }\n </ion-list>\n\n @if (loadMoreData) {\n @if (pages > 0 && type === 'paginated' && !searchValue?.length) {\n <ngx-decaf-pagination\n [totalPages]=\"pages\"\n [current]=\"page\"\n (clickEvent)=\"handlePaginate($event)\"\n />\n\n } @else {\n <ion-infinite-scroll\n [class]=\"searchValue?.length ? 'dcf-hidden' : ''\"\n\n [position]=\"scrollPosition\"\n [threshold]=\"scrollThreshold\"\n (ionInfinite)=\"handleRefresh($event)\">\n <ion-infinite-scroll-content [loadingSpinner]=\"loadingSpinner\" [loadingText]=\"loadingText\" />\n </ion-infinite-scroll>\n }\n }\n} @else {\n @if (refreshing) {\n @for(skl of skeletonData; track $index) {\n <ion-item>\n <ion-thumbnail slot=\"start\">\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n </ion-thumbnail>\n <ion-label>\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n <ion-text class=\"date\" style=\"width: 20%;\">\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n </ion-text>\n </ion-label>\n </ion-item>\n }]\n\n } @else {\n @if (!searching) {\n <ngx-decaf-empty-state\n [title]=\"empty.title ? ((locale + '.'+ empty.title) | translate) : ''\"\n [model]=\"empty?.showButton ? model : undefined\"\n [route]=\"route\"\n [modelId]=\"modelId\"\n [buttonLink]=\"empty?.link ?? undefined\"\n [borders]=\"borders\"\n [icon]=\"(item?.icon ?? 'folder-open-outline') || empty.icon\"\n className=\"dcf-empty-data\"\n [subtitle]=\"empty.subtitle ? ((locale + '.'+ empty.subtitle) | translate) : ''\" />\n } @else {\n\n <ngx-decaf-empty-state\n icon=\"search-outline\"\n [model]=\"empty?.showButton ? model : undefined\"\n [route]=\"route\"\n [modelId]=\"modelId\"\n [borders]=\"borders\"\n [operations]=\"operations\"\n [body]=\"'small'\"\n [translatable]=\"true\"\n [title]=\"locale + '.search.title' | translate\"\n [subtitle]=\"locale + '.search.subtitle' | translate: {'0': parseSearchValue()}\"\n [searchValue]=\"searchValue\"\n />\n }\n }\n}\n\n", styles: ["ion-infinite-scroll{max-height:50px}ion-infinite-scroll:not(.infinite-scroll-loading) ::ng-deep{max-height:1.5rem}ion-infinite-scroll ::ng-deep ion-spinner{--color: var(--dcf-color-primary);padding-top:1rem}@media (max-width: 768px){#end,[slot=end]{display:none!important}}.dcf-grid-actions{padding:0px var(--dcf-padding-small);padding-bottom:0}.dcf-grid-actions .dcf-button-container{margin-top:var(--dcf-margin-small)}@media (max-width: 768px){.dcf-grid-actions .dcf-button-container{width:100%!important}.dcf-grid-actions .dcf-button-container *{width:calc(100% - 5px)!important;display:inline-block;margin-top:0!important;margin-bottom:var(--dcf-margin-xsmall)!important}}.dcf-grid-actions>div:only-child{width:100%}\n"], dependencies: [{ kind: "component", type: IonRefresher, selector: "ion-refresher", inputs: ["closeDuration", "disabled", "mode", "pullFactor", "pullMax", "pullMin", "snapbackDuration"] }, { kind: "component", type: IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: PaginationComponent, selector: "ngx-decaf-pagination", inputs: ["totalPages", "current"], outputs: ["clickEvent"] }, { kind: "component", type: IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: IonThumbnail, selector: "ion-thumbnail" }, { kind: "component", type: IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "component", type: IonRefresherContent, selector: "ion-refresher-content", inputs: ["pullingIcon", "pullingText", "refreshingSpinner", "refreshingText"] }, { kind: "component", type: IonInfiniteScroll, selector: "ion-infinite-scroll", inputs: ["disabled", "position", "threshold"] }, { kind: "component", type: IonInfiniteScrollContent, selector: "ion-infinite-scroll-content", inputs: ["loadingSpinner", "loadingText"] }, { kind: "component", type: SearchbarComponent, selector: "ngx-decaf-searchbar", inputs: ["autocomplete", "autocorrect", "animated", "buttonCancelText", "clearIcon", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "placeholder", "searchIcon", "showCancelButton", "showClearButton", "spellcheck", "type", "value", "queryKeys", "isVisible", "wrapper", "wrapperColor", "emitEventToWindow"], outputs: ["searchEvent"] }, { kind: "component", type: EmptyStateComponent, selector: "ngx-decaf-empty-state", inputs: ["title", "titleColor", "subtitle", "subtitleColor", "showIcon", "icon", "iconSize", "iconColor", "buttonLink", "buttonText", "buttonFill", "buttonColor", "buttonSize", "searchValue"] }, { kind: "component", type: FilterComponent, selector: "ngx-decaf-filter", inputs: ["indexes", "multiple", "conditions", "sortBy", "disableSort"], outputs: ["filterEvent", "searchEvent"] }, { kind: "component", type: ComponentRendererComponent, selector: "ngx-decaf-component-renderer", inputs: ["tag", "children", "projectable", "parent"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
|
|
10874
10906
|
};
|
|
10875
10907
|
ListComponent = __decorate([
|
|
10876
10908
|
Dynamic(),
|
|
@@ -10898,7 +10930,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
10898
10930
|
EmptyStateComponent,
|
|
10899
10931
|
FilterComponent,
|
|
10900
10932
|
ComponentRendererComponent,
|
|
10901
|
-
], host: { '[attr.id]': 'uid' }, template: "\n@if (showRefresher) {\n <ion-refresher slot=\"fixed\" [pullFactor]=\"1\" [pullMin]=\"100\" [pullMax]=\"200\" (ionRefresh)=\"handleRefresh($event)\">\n <ion-refresher-content />\n </ion-refresher>\n}\n\n@if (showSearchbar) {\n <div [hidden]=\"!data?.length && !searching\">\n <div class=\"dcf-grid dcf-grid-small dcf-grid-actions\">\n <div class=\"dcf-width-expand@m dcf-width-1-1\">\n @if (model && enableFilter) {\n @if (data?.length || searching) {\n <ngx-decaf-filter\n [model]=\"model\"\n [indexes]=\"indexes ?? []\"\n [sortDirection]=\"sortDirection\"\n [disableSort]=\"disableSort\"\n (filterEvent)=\"handleFilter($event)\"\n (searchEvent)=\"handleSearch($event)\"\n />\n }\n } @else {\n <ngx-decaf-searchbar [placeholder]=\"searchbarPlaceholder\" [emitEventToWindow]=\"false\" [debounce]=\"500\" (searchEvent)=\"handleSearch($event)\" />\n }\n </div>\n @if(createButton) {\n <div class=\"dcf-width-auto@m dcf-button-container dcf-width-1-1 dcf-flex-middle dcf-flex dcf-flex-center dcf-flex-right@m\">\n <div>\n <ion-button expand=\"block\" (click)=\"changeOperation(OperationKeys.CREATE)\">Create</ion-button>\n </div>\n </div>\n }\n </div>\n </div>\n}\n@if (initialized && data?.length) {\n <ion-list [id]=\"uid\" [inset]=\"inset\" [lines]=\"lines\">\n @if (item?.tag) {\n @for(child of items; track trackItemFn($index, child)) {\n <ngx-decaf-component-renderer\n [tag]=\"item.tag\"\n (listenEvent)=\"handleEvent($event)\"\n [globals]='{\n item: child,\n mapper: mapper,\n route: route,\n model: child\n }'>\n </ngx-decaf-component-renderer>\n }\n } @else {\n <ng-content></ng-content>\n }\n </ion-list>\n\n @if (loadMoreData) {\n @if (pages > 0 && type === 'paginated' && !searchValue?.length) {\n <ngx-decaf-pagination\n [totalPages]=\"pages\"\n [current]=\"page\"\n (clickEvent)=\"handlePaginate($event)\"\n />\n\n } @else {\n <ion-infinite-scroll\n [class]=\"searchValue?.length ? 'dcf-hidden' : ''\"\n\n [position]=\"scrollPosition\"\n [threshold]=\"scrollThreshold\"\n (ionInfinite)=\"handleRefresh($event)\">\n <ion-infinite-scroll-content [loadingSpinner]=\"loadingSpinner\" [loadingText]=\"loadingText\" />\n </ion-infinite-scroll>\n }\n }\n} @else {\n @if (refreshing) {\n @for(skl of skeletonData; track $index) {\n <ion-item>\n <ion-thumbnail slot=\"start\">\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n </ion-thumbnail>\n <ion-label>\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n <ion-text class=\"date\" style=\"width: 20%;\"
|
|
10933
|
+
], host: { '[attr.id]': 'uid' }, template: "\n@if (showRefresher) {\n <ion-refresher slot=\"fixed\" [pullFactor]=\"1\" [pullMin]=\"100\" [pullMax]=\"200\" (ionRefresh)=\"handleRefresh($event)\">\n <ion-refresher-content />\n </ion-refresher>\n}\n\n@if (showSearchbar) {\n <div [hidden]=\"!data?.length && !searching\">\n <div class=\"dcf-grid dcf-grid-small dcf-grid-actions\">\n <div class=\"dcf-width-expand@m dcf-width-1-1\">\n @if (model && enableFilter) {\n @if (data?.length || searching) {\n <ngx-decaf-filter\n [model]=\"model\"\n [indexes]=\"indexes ?? []\"\n [sortDirection]=\"sortDirection\"\n [disableSort]=\"disableSort\"\n (filterEvent)=\"handleFilter($event)\"\n (searchEvent)=\"handleSearch($event)\"\n />\n }\n } @else {\n <ngx-decaf-searchbar [placeholder]=\"searchbarPlaceholder\" [emitEventToWindow]=\"false\" [debounce]=\"500\" (searchEvent)=\"handleSearch($event)\" />\n }\n </div>\n @if(createButton) {\n <div class=\"dcf-width-auto@m dcf-button-container dcf-width-1-1 dcf-flex-middle dcf-flex dcf-flex-center dcf-flex-right@m\">\n <div>\n <ion-button expand=\"block\" (click)=\"changeOperation(OperationKeys.CREATE)\">Create</ion-button>\n </div>\n </div>\n }\n </div>\n </div>\n}\n@if (initialized && data?.length) {\n <ion-list [id]=\"uid\" [inset]=\"inset\" [lines]=\"lines\">\n @if (item?.tag) {\n @for(child of items; track trackItemFn($index, child)) {\n <ngx-decaf-component-renderer\n [tag]=\"item.tag\"\n (listenEvent)=\"handleEvent($event)\"\n [globals]='{\n item: child,\n mapper: mapper,\n route: route,\n model: child\n }'>\n </ngx-decaf-component-renderer>\n }\n } @else {\n <ng-content></ng-content>\n }\n </ion-list>\n\n @if (loadMoreData) {\n @if (pages > 0 && type === 'paginated' && !searchValue?.length) {\n <ngx-decaf-pagination\n [totalPages]=\"pages\"\n [current]=\"page\"\n (clickEvent)=\"handlePaginate($event)\"\n />\n\n } @else {\n <ion-infinite-scroll\n [class]=\"searchValue?.length ? 'dcf-hidden' : ''\"\n\n [position]=\"scrollPosition\"\n [threshold]=\"scrollThreshold\"\n (ionInfinite)=\"handleRefresh($event)\">\n <ion-infinite-scroll-content [loadingSpinner]=\"loadingSpinner\" [loadingText]=\"loadingText\" />\n </ion-infinite-scroll>\n }\n }\n} @else {\n @if (refreshing) {\n @for(skl of skeletonData; track $index) {\n <ion-item>\n <ion-thumbnail slot=\"start\">\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n </ion-thumbnail>\n <ion-label>\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n <ion-text class=\"date\" style=\"width: 20%;\">\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n </ion-text>\n </ion-label>\n </ion-item>\n }]\n\n } @else {\n @if (!searching) {\n <ngx-decaf-empty-state\n [title]=\"empty.title ? ((locale + '.'+ empty.title) | translate) : ''\"\n [model]=\"empty?.showButton ? model : undefined\"\n [route]=\"route\"\n [modelId]=\"modelId\"\n [buttonLink]=\"empty?.link ?? undefined\"\n [borders]=\"borders\"\n [icon]=\"(item?.icon ?? 'folder-open-outline') || empty.icon\"\n className=\"dcf-empty-data\"\n [subtitle]=\"empty.subtitle ? ((locale + '.'+ empty.subtitle) | translate) : ''\" />\n } @else {\n\n <ngx-decaf-empty-state\n icon=\"search-outline\"\n [model]=\"empty?.showButton ? model : undefined\"\n [route]=\"route\"\n [modelId]=\"modelId\"\n [borders]=\"borders\"\n [operations]=\"operations\"\n [body]=\"'small'\"\n [translatable]=\"true\"\n [title]=\"locale + '.search.title' | translate\"\n [subtitle]=\"locale + '.search.subtitle' | translate: {'0': parseSearchValue()}\"\n [searchValue]=\"searchValue\"\n />\n }\n }\n}\n\n", styles: ["ion-infinite-scroll{max-height:50px}ion-infinite-scroll:not(.infinite-scroll-loading) ::ng-deep{max-height:1.5rem}ion-infinite-scroll ::ng-deep ion-spinner{--color: var(--dcf-color-primary);padding-top:1rem}@media (max-width: 768px){#end,[slot=end]{display:none!important}}.dcf-grid-actions{padding:0px var(--dcf-padding-small);padding-bottom:0}.dcf-grid-actions .dcf-button-container{margin-top:var(--dcf-margin-small)}@media (max-width: 768px){.dcf-grid-actions .dcf-button-container{width:100%!important}.dcf-grid-actions .dcf-button-container *{width:calc(100% - 5px)!important;display:inline-block;margin-top:0!important;margin-bottom:var(--dcf-margin-xsmall)!important}}.dcf-grid-actions>div:only-child{width:100%}\n"] }]
|
|
10902
10934
|
}], ctorParameters: () => [], propDecorators: { type: [{
|
|
10903
10935
|
type: Input
|
|
10904
10936
|
}], showSearchbar: [{
|
|
@@ -12591,22 +12623,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
12591
12623
|
let TableComponent = class TableComponent extends ListComponent {
|
|
12592
12624
|
constructor() {
|
|
12593
12625
|
super(...arguments);
|
|
12626
|
+
this.headers = [];
|
|
12594
12627
|
this.allowOperations = true;
|
|
12595
12628
|
this.routerService = inject(NgxRouterService);
|
|
12596
12629
|
this.injector = inject(EnvironmentInjector);
|
|
12597
12630
|
}
|
|
12598
12631
|
get _cols() {
|
|
12632
|
+
this.mapper = this._mapper;
|
|
12599
12633
|
return Object.entries(this.mapper)
|
|
12600
12634
|
.sort(([, a], [, b]) => Number(a?.['sequence'] ?? 0) - Number(b?.['sequence'] ?? 0))
|
|
12601
12635
|
.map(([key]) => key);
|
|
12602
12636
|
}
|
|
12637
|
+
get _headers() {
|
|
12638
|
+
return this.cols.map(col => col);
|
|
12639
|
+
}
|
|
12640
|
+
get _mapper() {
|
|
12641
|
+
return Object.keys(this.mapper).reduce((accum, curr) => {
|
|
12642
|
+
const mapper = this.mapper[curr];
|
|
12643
|
+
if (typeof mapper === 'object' && 'sequence' in mapper)
|
|
12644
|
+
accum[curr] = mapper;
|
|
12645
|
+
return accum;
|
|
12646
|
+
}, {});
|
|
12647
|
+
}
|
|
12603
12648
|
async ngOnInit() {
|
|
12649
|
+
this.initialized = false;
|
|
12604
12650
|
this.type = ListComponentsTypes.PAGINATED;
|
|
12651
|
+
this.empty = Object.assign({}, DefaultListEmptyOptions, this.empty);
|
|
12652
|
+
if (!this.initialized)
|
|
12653
|
+
this.parseProps(this);
|
|
12605
12654
|
this.cols = this._cols;
|
|
12606
12655
|
this.allowOperations = this.isAllowed(OperationKeys.UPDATE) || this.isAllowed(OperationKeys.DELETE);
|
|
12607
12656
|
this.searchValue = undefined;
|
|
12608
12657
|
if (this.allowOperations)
|
|
12609
12658
|
this.cols.push('actions');
|
|
12659
|
+
this.headers = this._headers;
|
|
12610
12660
|
const filter = this.routerService.getQueryParamValue('filter');
|
|
12611
12661
|
if (filter) {
|
|
12612
12662
|
const value = this.routerService.getQueryParamValue('value');
|
|
@@ -12626,6 +12676,7 @@ let TableComponent = class TableComponent extends ListComponent {
|
|
|
12626
12676
|
}
|
|
12627
12677
|
if (this.filterModel)
|
|
12628
12678
|
await this.getFilterOptions();
|
|
12679
|
+
this.initialized = true;
|
|
12629
12680
|
await this.refresh();
|
|
12630
12681
|
}
|
|
12631
12682
|
async getFilterOptions() {
|
|
@@ -12646,10 +12697,29 @@ let TableComponent = class TableComponent extends ListComponent {
|
|
|
12646
12697
|
}
|
|
12647
12698
|
}
|
|
12648
12699
|
itemMapper(item, mapper, props = {}) {
|
|
12649
|
-
|
|
12650
|
-
|
|
12700
|
+
this.model = item;
|
|
12701
|
+
const mapped = super.itemMapper(item, this.cols.filter(c => c !== 'actions'), props);
|
|
12702
|
+
const { children } = this.props || [];
|
|
12703
|
+
return Object.keys(mapped).reduce((accum, curr, index) => {
|
|
12704
|
+
const child = children?.[index];
|
|
12705
|
+
if (child) {
|
|
12706
|
+
const { events } = child?.['props'] || {};
|
|
12707
|
+
if (events) {
|
|
12708
|
+
const { render } = events || undefined;
|
|
12709
|
+
if (render) {
|
|
12710
|
+
const clazz = new (events.render())();
|
|
12711
|
+
const renderFn = clazz.render.bind(this);
|
|
12712
|
+
if (renderFn instanceof Promise) {
|
|
12713
|
+
(async () => await renderFn)();
|
|
12714
|
+
}
|
|
12715
|
+
else {
|
|
12716
|
+
renderFn();
|
|
12717
|
+
}
|
|
12718
|
+
}
|
|
12719
|
+
}
|
|
12720
|
+
}
|
|
12651
12721
|
const parserFn = mapper[this.cols[index]]?.valueParserFn || undefined;
|
|
12652
|
-
return { ...accum, [curr]: parserFn ? parserFn(
|
|
12722
|
+
return { ...accum, [curr]: parserFn ? parserFn(mapped[curr], item, this) : mapped[curr] };
|
|
12653
12723
|
}, { ...props });
|
|
12654
12724
|
}
|
|
12655
12725
|
mapResults(data) {
|
|
@@ -12690,7 +12760,7 @@ let TableComponent = class TableComponent extends ListComponent {
|
|
|
12690
12760
|
}
|
|
12691
12761
|
}
|
|
12692
12762
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: TableComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
12693
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: TableComponent, isStandalone: true, selector: "ngx-decaf-table", inputs: { filterModel: "filterModel", filterOptions: "filterOptions", filterBy: "filterBy", filterLabel: "filterLabel", filterOptionsMapper: "filterOptionsMapper" }, usesInheritance: true, ngImport: i0, template: "\n@if (showSearchbar && (data?.length || searching)) {\n <div class=\"dcf-grid-actions\">\n <div class=\"dcf-grid dcf-grid-small\">\n <div class=\"dcf-width-expand@s\">\n <ngx-decaf-searchbar\n [emitEventToWindow]=\"false\"\n [debounce]=\"500\"\n (searchEvent)=\"handleSearch($event)\"\n />\n </div>\n @if(filterOptions?.length) {\n <div class=\"dcf-width-1-3@s dcf-width-1-4@m dcf-select-filter-container dcf-flex dcf-flex-middle\">\n <ion-select\n [id]=\"name\"\n toggleIcon=\"chevron-down-outline\"\n expandedIcon=\"chevron-up-outline\"\n [mode]=\"'md'\"\n fill=\"outline\"\n [value]=\"filterValue ?? '' \"\n [labelPlacement]=\"'floating'\"\n [label]=\" locale + '.filter.label' | translate\"\n (click)=\"openFilterSelectOptions($event)\"\n [placeholder]=\" locale + '.filter.label' | translate\"\n interface=\"popover\"\n >\n <ion-select-option value=\"\">{{ locale + '.filter.all' | translate }}</ion-select-option>\n @for(option of filterOptions; track $index) {\n <ion-select-option value=\"{{ option.value }}\">{{ option.text }}</ion-select-option>\n }\n <ion-button fill=\"clear\" (click)=\"handleFilterSelectClear($event)\" slot=\"end\" size=\"small\" [disabled]=\"!filterValue\">\n <ngx-decaf-icon fill=\"clear\" slot=\"icon-only\" [name]=\"'ti-input-x'\" />\n </ion-button>\n </ion-select>\n </div>\n }\n </div>\n </div>\n}\n\n<div class=\"dcf-table-container\">\n @if(initialized && data?.length) {\n <table class=\"dcf-table\">\n <thead>\n <tr>\n @for(
|
|
12763
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: TableComponent, isStandalone: true, selector: "ngx-decaf-table", inputs: { filterModel: "filterModel", filterOptions: "filterOptions", filterBy: "filterBy", filterLabel: "filterLabel", filterOptionsMapper: "filterOptionsMapper" }, usesInheritance: true, ngImport: i0, template: "\n@if (showSearchbar && (data?.length || searching)) {\n <div class=\"dcf-grid-actions\">\n <div class=\"dcf-grid dcf-grid-small\">\n <div class=\"dcf-width-expand@s\">\n <ngx-decaf-searchbar\n [emitEventToWindow]=\"false\"\n [debounce]=\"500\"\n (searchEvent)=\"handleSearch($event)\"\n />\n </div>\n @if(filterOptions?.length) {\n <div class=\"dcf-width-1-3@s dcf-width-1-4@m dcf-select-filter-container dcf-flex dcf-flex-middle\">\n <ion-select\n [id]=\"name\"\n toggleIcon=\"chevron-down-outline\"\n expandedIcon=\"chevron-up-outline\"\n [mode]=\"'md'\"\n fill=\"outline\"\n [value]=\"filterValue ?? '' \"\n [labelPlacement]=\"'floating'\"\n [label]=\" locale + '.filter.label' | translate\"\n (click)=\"openFilterSelectOptions($event)\"\n [placeholder]=\" locale + '.filter.label' | translate\"\n interface=\"popover\"\n >\n <ion-select-option value=\"\">{{ locale + '.filter.all' | translate }}</ion-select-option>\n @for(option of filterOptions; track $index) {\n <ion-select-option value=\"{{ option.value }}\">{{ option.text }}</ion-select-option>\n }\n <ion-button fill=\"clear\" (click)=\"handleFilterSelectClear($event)\" slot=\"end\" size=\"small\" [disabled]=\"!filterValue\">\n <ngx-decaf-icon fill=\"clear\" slot=\"icon-only\" [name]=\"'ti-input-x'\" />\n </ion-button>\n </ion-select>\n </div>\n }\n </div>\n </div>\n}\n\n<div class=\"dcf-table-container\">\n @if(initialized && data?.length) {\n <table class=\"dcf-table\">\n <thead>\n <tr>\n @for(header of headers; track $index) {\n <th>{{ locale + '.' + header + '.label' | translate}}</th>\n }\n </tr>\n </thead>\n <tbody>\n @for(item of items; track trackItemFn($index, item)) {\n <tr (click)=\"handleAction($event, OperationKeys.READ, item.uid)\">\n @for(col of item | keyvalue; track $index) {\n @if(!['actions', 'uid'].includes(col.key)) {\n <td>{{ typeof col.value === 'string' ? col.value : (col.value | async) }}</td>\n } @else {\n @if(allowOperations) {\n <td class=\"dcf-col-actions\">\n <div class=\"dcf-flex dcf-flex-center\">\n <ngx-decaf-icon\n [button]=\"true\"\n (click)=\"handleAction($event, OperationKeys.UPDATE, item.uid)\"\n fill=\"clear\"\n slot=\"icon-only\"\n color=\"primary\"\n name=\"ti-pencil\"\n />\n <ngx-decaf-icon\n [button]=\"true\"\n (click)=\"handleAction($event,OperationKeys.DELETE, item.uid)\"\n fill=\"clear\"\n slot=\"icon-only\"\n color=\"danger\"\n name=\"ti-trash\"\n />\n </div>\n </td>\n }\n }\n }\n </tr>\n }\n </tbody>\n </table>\n } @else {\n @if (!searching) {\n <ngx-decaf-empty-state\n [title]=\"'component.list.empty.title' | translate\"\n [subtitle]=\"'component.list.empty.subtitle' | translate\"\n [model]=\"empty?.showButton ? model : undefined\"\n [route]=\"route\"\n [modelId]=\"modelId\"\n [buttonLink]=\"empty?.link ?? undefined\"\n [borders]=\"borders\"\n [icon]=\"(item?.icon ?? 'folder-open-outline') || empty.icon\"\n className=\"dcf-empty-data\"\n />\n } @else {\n\n <ngx-decaf-empty-state\n icon=\"search-outline\"\n [model]=\"empty?.showButton ? model : undefined\"\n [route]=\"route\"\n [modelId]=\"modelId\"\n [borders]=\"borders\"\n [operations]=\"operations\"\n [body]=\"'small'\"\n [translatable]=\"true\"\n [title]=\"'component.list.search.title' | translate\"\n [subtitle]=\"'component.list.search.subtitle' | translate: {'0': parseSearchValue()}\"\n [searchValue]=\"searchValue\"\n />\n }\n }\n</div>\n @if (loadMoreData) {\n <div class=\"dcf-table-pagination\">\n @if (pages > 0 && !searchValue?.length) {\n <ngx-decaf-pagination\n [totalPages]=\"pages\"\n [current]=\"page\"\n (clickEvent)=\"handlePaginate($event)\"\n />\n\n }\n </div>\n}\n\n", styles: [".dcf-table-container{display:block;overflow-x:auto!important;box-sizing:border-box;overflow-y:hidden;scrollbar-width:thin;box-shadow:var(--dcf-box-shadow-small);border:1px solid var(--dcf-color-gray-2);border-radius:var(--dcf-border-radius-small)}.dcf-table-container::-webkit-scrollbar{width:5px}.dcf-table-container table{min-width:680px}.dcf-table{width:100%;border-collapse:collapse;border-radius:var(--dcf-border-radius-xsmall);overflow:hidden;background:var(--dcf-card-background);color:var(--dcf-text-color);font-size:.8rem}.dcf-table thead{background:rgba(var(--dcf-color-primary-rgb),.075);text-transform:uppercase;color:var(--dcf-color-dark);letter-spacing:.06em;font-size:.825rem;white-space:nowrap;width:auto}.dcf-table thead th{text-align:left;padding:.875rem 1rem;font-weight:600;max-width:max-content}.dcf-table tbody tr{transition:background .12s ease,box-shadow .12s ease}.dcf-table tbody tr:hover{background:rgba(var(--dcf-color-primary-rgb),.05);cursor:pointer}.dcf-table tbody tr:not(:last-child){border-bottom:1px solid var(--dcf-color-gray-2)}.dcf-table tbody td{padding:1rem 1.125rem;font-size:.875rem}.dcf-table tbody td:first-child{font-weight:600}.dcf-table tbody td.dcf-col-actions{padding-top:0!important;padding-bottom:0!important}.dcf-table tfoot{font-size:.85rem}.dcf-table tfoot td{padding:.875rem 1.125rem;border-top:1px solid 1px solid var(--dcf-color-gray-2)}.dcf-select-filter-container{min-width:200px}.dcf-buttons-grid{margin-top:var(--dcf-margin-medium);margin-bottom:var(--dcf-margin)}@media (max-width: 480px){.dcf-buttons-grid{flex-direction:row-reverse!important}.dcf-buttons-grid>div{width:100%}.dcf-buttons-grid>div+div{margin-top:1rem}.dcf-buttons-grid ion-button{width:100%}}ion-select{margin-top:.5rem;max-height:40px!important}ion-select ion-button{transform:scale(.75)!important;margin:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: IonSelect, selector: "ion-select", inputs: ["cancelText", "color", "compareWith", "disabled", "errorText", "expandedIcon", "fill", "helperText", "interface", "interfaceOptions", "justify", "label", "labelPlacement", "mode", "multiple", "name", "okText", "placeholder", "selectedText", "shape", "toggleIcon", "value"] }, { kind: "component", type: IonSelectOption, selector: "ion-select-option", inputs: ["disabled", "value"] }, { kind: "component", type: SearchbarComponent, selector: "ngx-decaf-searchbar", inputs: ["autocomplete", "autocorrect", "animated", "buttonCancelText", "clearIcon", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "placeholder", "searchIcon", "showCancelButton", "showClearButton", "spellcheck", "type", "value", "queryKeys", "isVisible", "wrapper", "wrapperColor", "emitEventToWindow"], outputs: ["searchEvent"] }, { kind: "component", type: EmptyStateComponent, selector: "ngx-decaf-empty-state", inputs: ["title", "titleColor", "subtitle", "subtitleColor", "showIcon", "icon", "iconSize", "iconColor", "buttonLink", "buttonText", "buttonFill", "buttonColor", "buttonSize", "searchValue"] }, { kind: "component", type: IconComponent, selector: "ngx-decaf-icon", inputs: ["name", "color", "slot", "button", "buttonFill", "buttonShape", "width", "size", "inline"] }, { kind: "component", type: PaginationComponent, selector: "ngx-decaf-pagination", inputs: ["totalPages", "current"], outputs: ["clickEvent"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
|
|
12694
12764
|
};
|
|
12695
12765
|
TableComponent = __decorate([
|
|
12696
12766
|
Dynamic()
|
|
@@ -12706,7 +12776,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
12706
12776
|
EmptyStateComponent,
|
|
12707
12777
|
IconComponent,
|
|
12708
12778
|
PaginationComponent
|
|
12709
|
-
], template: "\n@if (showSearchbar && (data?.length || searching)) {\n <div class=\"dcf-grid-actions\">\n <div class=\"dcf-grid dcf-grid-small\">\n <div class=\"dcf-width-expand@s\">\n <ngx-decaf-searchbar\n [emitEventToWindow]=\"false\"\n [debounce]=\"500\"\n (searchEvent)=\"handleSearch($event)\"\n />\n </div>\n @if(filterOptions?.length) {\n <div class=\"dcf-width-1-3@s dcf-width-1-4@m dcf-select-filter-container dcf-flex dcf-flex-middle\">\n <ion-select\n [id]=\"name\"\n toggleIcon=\"chevron-down-outline\"\n expandedIcon=\"chevron-up-outline\"\n [mode]=\"'md'\"\n fill=\"outline\"\n [value]=\"filterValue ?? '' \"\n [labelPlacement]=\"'floating'\"\n [label]=\" locale + '.filter.label' | translate\"\n (click)=\"openFilterSelectOptions($event)\"\n [placeholder]=\" locale + '.filter.label' | translate\"\n interface=\"popover\"\n >\n <ion-select-option value=\"\">{{ locale + '.filter.all' | translate }}</ion-select-option>\n @for(option of filterOptions; track $index) {\n <ion-select-option value=\"{{ option.value }}\">{{ option.text }}</ion-select-option>\n }\n <ion-button fill=\"clear\" (click)=\"handleFilterSelectClear($event)\" slot=\"end\" size=\"small\" [disabled]=\"!filterValue\">\n <ngx-decaf-icon fill=\"clear\" slot=\"icon-only\" [name]=\"'ti-input-x'\" />\n </ion-button>\n </ion-select>\n </div>\n }\n </div>\n </div>\n}\n\n<div class=\"dcf-table-container\">\n @if(initialized && data?.length) {\n <table class=\"dcf-table\">\n <thead>\n <tr>\n @for(
|
|
12779
|
+
], template: "\n@if (showSearchbar && (data?.length || searching)) {\n <div class=\"dcf-grid-actions\">\n <div class=\"dcf-grid dcf-grid-small\">\n <div class=\"dcf-width-expand@s\">\n <ngx-decaf-searchbar\n [emitEventToWindow]=\"false\"\n [debounce]=\"500\"\n (searchEvent)=\"handleSearch($event)\"\n />\n </div>\n @if(filterOptions?.length) {\n <div class=\"dcf-width-1-3@s dcf-width-1-4@m dcf-select-filter-container dcf-flex dcf-flex-middle\">\n <ion-select\n [id]=\"name\"\n toggleIcon=\"chevron-down-outline\"\n expandedIcon=\"chevron-up-outline\"\n [mode]=\"'md'\"\n fill=\"outline\"\n [value]=\"filterValue ?? '' \"\n [labelPlacement]=\"'floating'\"\n [label]=\" locale + '.filter.label' | translate\"\n (click)=\"openFilterSelectOptions($event)\"\n [placeholder]=\" locale + '.filter.label' | translate\"\n interface=\"popover\"\n >\n <ion-select-option value=\"\">{{ locale + '.filter.all' | translate }}</ion-select-option>\n @for(option of filterOptions; track $index) {\n <ion-select-option value=\"{{ option.value }}\">{{ option.text }}</ion-select-option>\n }\n <ion-button fill=\"clear\" (click)=\"handleFilterSelectClear($event)\" slot=\"end\" size=\"small\" [disabled]=\"!filterValue\">\n <ngx-decaf-icon fill=\"clear\" slot=\"icon-only\" [name]=\"'ti-input-x'\" />\n </ion-button>\n </ion-select>\n </div>\n }\n </div>\n </div>\n}\n\n<div class=\"dcf-table-container\">\n @if(initialized && data?.length) {\n <table class=\"dcf-table\">\n <thead>\n <tr>\n @for(header of headers; track $index) {\n <th>{{ locale + '.' + header + '.label' | translate}}</th>\n }\n </tr>\n </thead>\n <tbody>\n @for(item of items; track trackItemFn($index, item)) {\n <tr (click)=\"handleAction($event, OperationKeys.READ, item.uid)\">\n @for(col of item | keyvalue; track $index) {\n @if(!['actions', 'uid'].includes(col.key)) {\n <td>{{ typeof col.value === 'string' ? col.value : (col.value | async) }}</td>\n } @else {\n @if(allowOperations) {\n <td class=\"dcf-col-actions\">\n <div class=\"dcf-flex dcf-flex-center\">\n <ngx-decaf-icon\n [button]=\"true\"\n (click)=\"handleAction($event, OperationKeys.UPDATE, item.uid)\"\n fill=\"clear\"\n slot=\"icon-only\"\n color=\"primary\"\n name=\"ti-pencil\"\n />\n <ngx-decaf-icon\n [button]=\"true\"\n (click)=\"handleAction($event,OperationKeys.DELETE, item.uid)\"\n fill=\"clear\"\n slot=\"icon-only\"\n color=\"danger\"\n name=\"ti-trash\"\n />\n </div>\n </td>\n }\n }\n }\n </tr>\n }\n </tbody>\n </table>\n } @else {\n @if (!searching) {\n <ngx-decaf-empty-state\n [title]=\"'component.list.empty.title' | translate\"\n [subtitle]=\"'component.list.empty.subtitle' | translate\"\n [model]=\"empty?.showButton ? model : undefined\"\n [route]=\"route\"\n [modelId]=\"modelId\"\n [buttonLink]=\"empty?.link ?? undefined\"\n [borders]=\"borders\"\n [icon]=\"(item?.icon ?? 'folder-open-outline') || empty.icon\"\n className=\"dcf-empty-data\"\n />\n } @else {\n\n <ngx-decaf-empty-state\n icon=\"search-outline\"\n [model]=\"empty?.showButton ? model : undefined\"\n [route]=\"route\"\n [modelId]=\"modelId\"\n [borders]=\"borders\"\n [operations]=\"operations\"\n [body]=\"'small'\"\n [translatable]=\"true\"\n [title]=\"'component.list.search.title' | translate\"\n [subtitle]=\"'component.list.search.subtitle' | translate: {'0': parseSearchValue()}\"\n [searchValue]=\"searchValue\"\n />\n }\n }\n</div>\n @if (loadMoreData) {\n <div class=\"dcf-table-pagination\">\n @if (pages > 0 && !searchValue?.length) {\n <ngx-decaf-pagination\n [totalPages]=\"pages\"\n [current]=\"page\"\n (clickEvent)=\"handlePaginate($event)\"\n />\n\n }\n </div>\n}\n\n", styles: [".dcf-table-container{display:block;overflow-x:auto!important;box-sizing:border-box;overflow-y:hidden;scrollbar-width:thin;box-shadow:var(--dcf-box-shadow-small);border:1px solid var(--dcf-color-gray-2);border-radius:var(--dcf-border-radius-small)}.dcf-table-container::-webkit-scrollbar{width:5px}.dcf-table-container table{min-width:680px}.dcf-table{width:100%;border-collapse:collapse;border-radius:var(--dcf-border-radius-xsmall);overflow:hidden;background:var(--dcf-card-background);color:var(--dcf-text-color);font-size:.8rem}.dcf-table thead{background:rgba(var(--dcf-color-primary-rgb),.075);text-transform:uppercase;color:var(--dcf-color-dark);letter-spacing:.06em;font-size:.825rem;white-space:nowrap;width:auto}.dcf-table thead th{text-align:left;padding:.875rem 1rem;font-weight:600;max-width:max-content}.dcf-table tbody tr{transition:background .12s ease,box-shadow .12s ease}.dcf-table tbody tr:hover{background:rgba(var(--dcf-color-primary-rgb),.05);cursor:pointer}.dcf-table tbody tr:not(:last-child){border-bottom:1px solid var(--dcf-color-gray-2)}.dcf-table tbody td{padding:1rem 1.125rem;font-size:.875rem}.dcf-table tbody td:first-child{font-weight:600}.dcf-table tbody td.dcf-col-actions{padding-top:0!important;padding-bottom:0!important}.dcf-table tfoot{font-size:.85rem}.dcf-table tfoot td{padding:.875rem 1.125rem;border-top:1px solid 1px solid var(--dcf-color-gray-2)}.dcf-select-filter-container{min-width:200px}.dcf-buttons-grid{margin-top:var(--dcf-margin-medium);margin-bottom:var(--dcf-margin)}@media (max-width: 480px){.dcf-buttons-grid{flex-direction:row-reverse!important}.dcf-buttons-grid>div{width:100%}.dcf-buttons-grid>div+div{margin-top:1rem}.dcf-buttons-grid ion-button{width:100%}}ion-select{margin-top:.5rem;max-height:40px!important}ion-select ion-button{transform:scale(.75)!important;margin:0!important}\n"] }]
|
|
12710
12780
|
}], propDecorators: { filterModel: [{
|
|
12711
12781
|
type: Input
|
|
12712
12782
|
}], filterOptions: [{
|
|
@@ -12851,6 +12921,7 @@ class NgxEventHandler extends DecafEventHandler {
|
|
|
12851
12921
|
// eslint-disable-next-line @typescript-eslint/no-useless-constructor
|
|
12852
12922
|
constructor() {
|
|
12853
12923
|
super();
|
|
12924
|
+
//TODO: pass to ui decorator decaf componnet
|
|
12854
12925
|
this.readonly = false;
|
|
12855
12926
|
}
|
|
12856
12927
|
async refresh(...args) {
|
|
@@ -13107,9 +13178,10 @@ class NgxModelPageDirective extends NgxPageDirective {
|
|
|
13107
13178
|
* @throws {InternalError} When the model is not found in the registry
|
|
13108
13179
|
*/
|
|
13109
13180
|
get repository() {
|
|
13181
|
+
const modelName = this.modelName || this.model?.constructor?.name;
|
|
13110
13182
|
try {
|
|
13111
|
-
if (!this._repository) {
|
|
13112
|
-
const constructor = Model.get(
|
|
13183
|
+
if (!this._repository && modelName) {
|
|
13184
|
+
const constructor = Model.get(modelName);
|
|
13113
13185
|
if (!constructor)
|
|
13114
13186
|
throw new InternalError('Cannot find model. was it registered with @model?');
|
|
13115
13187
|
this._repository = Repository.forModel(constructor);
|
|
@@ -13119,7 +13191,7 @@ class NgxModelPageDirective extends NgxPageDirective {
|
|
|
13119
13191
|
}
|
|
13120
13192
|
}
|
|
13121
13193
|
catch (error) {
|
|
13122
|
-
this.log.warn(`Error getting repository for model: ${
|
|
13194
|
+
this.log.warn(`Error getting repository for model: ${modelName}. ${error.message}`);
|
|
13123
13195
|
this._repository = undefined;
|
|
13124
13196
|
// throw new InternalError((error as Error)?.message || (error as string));
|
|
13125
13197
|
}
|