sf-loading 13.0.0 → 13.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/fesm2022/sf-loading.mjs
CHANGED
|
@@ -6,6 +6,10 @@ import * as i2 from 'primeng/progressbar';
|
|
|
6
6
|
import { ProgressBarModule } from 'primeng/progressbar';
|
|
7
7
|
import * as i3 from '@angular/common';
|
|
8
8
|
import { CommonModule } from '@angular/common';
|
|
9
|
+
import { Skeleton } from 'primeng/skeleton';
|
|
10
|
+
import * as i2$1 from 'primeng/table';
|
|
11
|
+
import { TableModule } from 'primeng/table';
|
|
12
|
+
import * as i3$1 from 'primeng/api';
|
|
9
13
|
import { BlockUIModule } from 'primeng/blockui';
|
|
10
14
|
|
|
11
15
|
class SfLoadingComponent {
|
|
@@ -36,10 +40,10 @@ class SfLoadingComponent {
|
|
|
36
40
|
}
|
|
37
41
|
}
|
|
38
42
|
}
|
|
39
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
40
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
43
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SfLoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
44
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: SfLoadingComponent, isStandalone: false, selector: "sf-loading", inputs: { target: "target", progress: "progress", texto: "texto", logo: "logo", enProceso: "enProceso" }, viewQueries: [{ propertyName: "block", first: true, predicate: ["block"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div #block [ngClass]=\"{'full-width': !this.target && enProceso}\">\r\n <div *ngIf=\"enProceso\" class=\"blocking-overlay\">\r\n <img *ngIf=\"logo\" [src]=\"logo\" class=\"icon-block\">\r\n <p-progressSpinner *ngIf=\"!logo\"></p-progressSpinner>\r\n <p *ngIf=\"texto\">{{texto}}</p>\r\n <p-progressBar *ngIf=\"progress !== undefined\" [value]=\"progress\" [style]=\"{'height': '20px', 'width': '50vw'}\"></p-progressBar>\r\n </div>\r\n <div *ngIf=\"!enProceso\"></div>\r\n</div>\r\n", styles: [".full-width{width:100%;height:100%;position:fixed;z-index:9999}.blocking-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#9e9797cc;z-index:9999;display:flex;flex-direction:column;justify-content:center;align-items:center}.blocking-overlay>p{font-size:1.5rem;text-align:center;max-width:80%}img.icon-block{width:10%;animation:rotation 1.3s infinite linear}@media screen and (max-width: 765px){img.icon-block{width:25vw}::ng-deep .p-dialog-mask .p-dialog{max-width:95vw}}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "component", type: i1.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i2.ProgressBar, selector: "p-progressBar, p-progressbar, p-progress-bar", inputs: ["value", "showValue", "styleClass", "valueStyleClass", "style", "unit", "mode", "color"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
41
45
|
}
|
|
42
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
46
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SfLoadingComponent, decorators: [{
|
|
43
47
|
type: Component,
|
|
44
48
|
args: [{ selector: 'sf-loading', standalone: false, template: "<div #block [ngClass]=\"{'full-width': !this.target && enProceso}\">\r\n <div *ngIf=\"enProceso\" class=\"blocking-overlay\">\r\n <img *ngIf=\"logo\" [src]=\"logo\" class=\"icon-block\">\r\n <p-progressSpinner *ngIf=\"!logo\"></p-progressSpinner>\r\n <p *ngIf=\"texto\">{{texto}}</p>\r\n <p-progressBar *ngIf=\"progress !== undefined\" [value]=\"progress\" [style]=\"{'height': '20px', 'width': '50vw'}\"></p-progressBar>\r\n </div>\r\n <div *ngIf=\"!enProceso\"></div>\r\n</div>\r\n", styles: [".full-width{width:100%;height:100%;position:fixed;z-index:9999}.blocking-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#9e9797cc;z-index:9999;display:flex;flex-direction:column;justify-content:center;align-items:center}.blocking-overlay>p{font-size:1.5rem;text-align:center;max-width:80%}img.icon-block{width:10%;animation:rotation 1.3s infinite linear}@media screen and (max-width: 765px){img.icon-block{width:25vw}::ng-deep .p-dialog-mask .p-dialog{max-width:95vw}}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
|
|
45
49
|
}], ctorParameters: () => [], propDecorators: { target: [{
|
|
@@ -57,18 +61,69 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
57
61
|
args: ['block']
|
|
58
62
|
}] } });
|
|
59
63
|
|
|
64
|
+
class TableLoadingComponent {
|
|
65
|
+
columns = 5;
|
|
66
|
+
rows = 10;
|
|
67
|
+
rowsWidth = [
|
|
68
|
+
{ width: '100%', height: '1.5rem' },
|
|
69
|
+
{ width: '100%', height: '1.5rem' },
|
|
70
|
+
{ width: '100%', height: '1.5rem' },
|
|
71
|
+
{ width: '100%', height: '1.5rem' },
|
|
72
|
+
{ width: '100%', height: '1.5rem' },
|
|
73
|
+
];
|
|
74
|
+
columnsWidth = [
|
|
75
|
+
{ width: '100%', height: '1.5rem' },
|
|
76
|
+
{ width: '100%', height: '1.5rem' },
|
|
77
|
+
{ width: '100%', height: '1.5rem' },
|
|
78
|
+
{ width: '100%', height: '1.5rem' },
|
|
79
|
+
{ width: '100%', height: '1.5rem' },
|
|
80
|
+
];
|
|
81
|
+
skeletonRows = [];
|
|
82
|
+
skeletonColumns = [];
|
|
83
|
+
loadingType = '';
|
|
84
|
+
ngOnInit() {
|
|
85
|
+
this.updateSkeletonColumns();
|
|
86
|
+
}
|
|
87
|
+
updateSkeletonColumns() {
|
|
88
|
+
this.skeletonRows = Array.from({ length: this.rows }, (_, i) => i);
|
|
89
|
+
this.skeletonColumns = Array.from({ length: this.columns }, (_, i) => i);
|
|
90
|
+
}
|
|
91
|
+
rowSize(index) {
|
|
92
|
+
return this.rowsWidth[index] || { width: '100%', height: '1.5rem' };
|
|
93
|
+
}
|
|
94
|
+
columnSize(index) {
|
|
95
|
+
return this.columnsWidth[index] || { width: '100%', height: '1.5rem' };
|
|
96
|
+
}
|
|
97
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TableLoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
98
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: TableLoadingComponent, isStandalone: true, selector: "lib-table-loading", inputs: { columns: "columns", rows: "rows", rowsWidth: "rowsWidth", columnsWidth: "columnsWidth", loadingType: "loadingType" }, ngImport: i0, template: "<div class=\"table-loading-container\">\r\n <p-table [value]=\"skeletonRows\" responsiveLayout=\"scroll\">\r\n <ng-template pTemplate=\"header\">\r\n <tr>\r\n <th *ngFor=\"let col of skeletonColumns\">\r\n <p-skeleton [width]=\"columnSize(col).width\" [height]=\"columnSize(col).height\"></p-skeleton>\r\n </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\">\r\n <tr>\r\n <td *ngFor=\"let col of skeletonColumns\">\r\n <p-skeleton [width]=\"rowSize(col).width\" [height]=\"rowSize(col).height\"></p-skeleton>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n</div>\r\n", styles: [".table-loading-container{width:100%;overflow-x:auto}:host ::ng-deep .p-datatable{min-width:600px}:host ::ng-deep .p-datatable-table{min-width:100%}:host ::ng-deep .p-datatable th,:host ::ng-deep .p-datatable td{min-width:100px;white-space:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }] });
|
|
99
|
+
}
|
|
100
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TableLoadingComponent, decorators: [{
|
|
101
|
+
type: Component,
|
|
102
|
+
args: [{ selector: 'lib-table-loading', imports: [CommonModule, TableModule, Skeleton], template: "<div class=\"table-loading-container\">\r\n <p-table [value]=\"skeletonRows\" responsiveLayout=\"scroll\">\r\n <ng-template pTemplate=\"header\">\r\n <tr>\r\n <th *ngFor=\"let col of skeletonColumns\">\r\n <p-skeleton [width]=\"columnSize(col).width\" [height]=\"columnSize(col).height\"></p-skeleton>\r\n </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\">\r\n <tr>\r\n <td *ngFor=\"let col of skeletonColumns\">\r\n <p-skeleton [width]=\"rowSize(col).width\" [height]=\"rowSize(col).height\"></p-skeleton>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n</div>\r\n", styles: [".table-loading-container{width:100%;overflow-x:auto}:host ::ng-deep .p-datatable{min-width:600px}:host ::ng-deep .p-datatable-table{min-width:100%}:host ::ng-deep .p-datatable th,:host ::ng-deep .p-datatable td{min-width:100px;white-space:nowrap}\n"] }]
|
|
103
|
+
}], propDecorators: { columns: [{
|
|
104
|
+
type: Input
|
|
105
|
+
}], rows: [{
|
|
106
|
+
type: Input
|
|
107
|
+
}], rowsWidth: [{
|
|
108
|
+
type: Input
|
|
109
|
+
}], columnsWidth: [{
|
|
110
|
+
type: Input
|
|
111
|
+
}], loadingType: [{
|
|
112
|
+
type: Input
|
|
113
|
+
}] } });
|
|
114
|
+
|
|
60
115
|
class SfLoadingModule {
|
|
61
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
62
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
116
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SfLoadingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
117
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: SfLoadingModule, declarations: [SfLoadingComponent], imports: [BlockUIModule,
|
|
63
118
|
ProgressSpinnerModule,
|
|
64
119
|
ProgressBarModule,
|
|
65
120
|
CommonModule], exports: [SfLoadingComponent] });
|
|
66
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
121
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SfLoadingModule, imports: [BlockUIModule,
|
|
67
122
|
ProgressSpinnerModule,
|
|
68
123
|
ProgressBarModule,
|
|
69
124
|
CommonModule] });
|
|
70
125
|
}
|
|
71
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
126
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SfLoadingModule, decorators: [{
|
|
72
127
|
type: NgModule,
|
|
73
128
|
args: [{
|
|
74
129
|
declarations: [
|
|
@@ -94,5 +149,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
94
149
|
* Generated bundle index. Do not edit.
|
|
95
150
|
*/
|
|
96
151
|
|
|
97
|
-
export { SfLoadingComponent, SfLoadingModule };
|
|
152
|
+
export { SfLoadingComponent, SfLoadingModule, TableLoadingComponent };
|
|
98
153
|
//# sourceMappingURL=sf-loading.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sf-loading.mjs","sources":["../../../projects/sf-loading/src/lib/sf-loading.component.ts","../../../projects/sf-loading/src/lib/sf-loading.compontent.html","../../../projects/sf-loading/src/lib/sf-loading.module.ts","../../../projects/sf-loading/src/public-api.ts","../../../projects/sf-loading/src/sf-loading.ts"],"sourcesContent":["import { AfterViewInit, Component, ElementRef, Input, OnChanges, ViewChild } from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sf-loading',\r\n templateUrl: 'sf-loading.compontent.html',\r\n styleUrls: ['sf-loading.component.css'],\r\n standalone: false\r\n})\r\nexport class SfLoadingComponent implements AfterViewInit, OnChanges{\r\n\r\n @Input() target:HTMLElement|undefined;\r\n @Input() progress?: number;\r\n @Input() texto: string | undefined;\r\n\r\n @Input() logo: string | undefined;\r\n\r\n @Input() enProceso = false;\r\n\r\n @ViewChild('block') block!: ElementRef<HTMLElement>;\r\n\r\n private prevPosition: string | undefined;\r\n\r\n\r\n constructor(){}\r\n\r\n ngOnChanges(): void {\r\n if (this.block) this.ngAfterViewInit()\r\n }\r\n\r\n ngAfterViewInit(): void {\r\n if (this.enProceso){\r\n if (this.target){\r\n this.target.style.position = \"relative\";\r\n (this.target as Node).appendChild(this.block.nativeElement)\r\n }\r\n }else {\r\n if (this.target) {\r\n const hasBlockChild = (this.target as Node).contains(this.block.nativeElement);\r\n if (hasBlockChild) (this.target as Node).removeChild(this.block.nativeElement)\r\n }\r\n }\r\n }\r\n}\r\n","<div #block [ngClass]=\"{'full-width': !this.target && enProceso}\">\r\n <div *ngIf=\"enProceso\" class=\"blocking-overlay\">\r\n <img *ngIf=\"logo\" [src]=\"logo\" class=\"icon-block\">\r\n <p-progressSpinner *ngIf=\"!logo\"></p-progressSpinner>\r\n <p *ngIf=\"texto\">{{texto}}</p>\r\n <p-progressBar *ngIf=\"progress !== undefined\" [value]=\"progress\" [style]=\"{'height': '20px', 'width': '50vw'}\"></p-progressBar>\r\n </div>\r\n <div *ngIf=\"!enProceso\"></div>\r\n</div>\r\n","import { NgModule } from '@angular/core';\r\nimport { SfLoadingComponent } from './sf-loading.component';\r\nimport { BlockUIModule } from 'primeng/blockui';\r\nimport { ProgressSpinnerModule } from 'primeng/progressspinner';\r\nimport { CommonModule } from '@angular/common';\r\nimport { ProgressBarModule } from 'primeng/progressbar';\r\n\r\n\r\n@NgModule({\r\n declarations: [\r\n SfLoadingComponent\r\n ],\r\n imports: [\r\n BlockUIModule\r\n ,ProgressSpinnerModule\r\n ,ProgressBarModule\r\n ,CommonModule\r\n ],\r\n exports: [\r\n SfLoadingComponent\r\n ]\r\n})\r\nexport class SfLoadingModule { }\r\n","/*\r\n * Public API Surface of sf-loading\r\n */\r\n\r\nexport * from './lib/sf-loading.component';\r\nexport * from './lib/sf-loading.module';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"sf-loading.mjs","sources":["../../../projects/sf-loading/src/lib/sf-loading.component.ts","../../../projects/sf-loading/src/lib/sf-loading.compontent.html","../../../projects/sf-loading/src/lib/components/skeletons/table-loading/table-loading.component.ts","../../../projects/sf-loading/src/lib/components/skeletons/table-loading/table-loading.component.html","../../../projects/sf-loading/src/lib/sf-loading.module.ts","../../../projects/sf-loading/src/public-api.ts","../../../projects/sf-loading/src/sf-loading.ts"],"sourcesContent":["import { AfterViewInit, Component, ElementRef, Input, OnChanges, ViewChild } from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sf-loading',\r\n templateUrl: 'sf-loading.compontent.html',\r\n styleUrls: ['sf-loading.component.css'],\r\n standalone: false\r\n})\r\nexport class SfLoadingComponent implements AfterViewInit, OnChanges{\r\n\r\n @Input() target:HTMLElement|undefined;\r\n @Input() progress?: number;\r\n @Input() texto: string | undefined;\r\n\r\n @Input() logo: string | undefined;\r\n\r\n @Input() enProceso = false;\r\n\r\n @ViewChild('block') block!: ElementRef<HTMLElement>;\r\n\r\n private prevPosition: string | undefined;\r\n\r\n\r\n constructor(){}\r\n\r\n ngOnChanges(): void {\r\n if (this.block) this.ngAfterViewInit()\r\n }\r\n\r\n ngAfterViewInit(): void {\r\n if (this.enProceso){\r\n if (this.target){\r\n this.target.style.position = \"relative\";\r\n (this.target as Node).appendChild(this.block.nativeElement)\r\n }\r\n }else {\r\n if (this.target) {\r\n const hasBlockChild = (this.target as Node).contains(this.block.nativeElement);\r\n if (hasBlockChild) (this.target as Node).removeChild(this.block.nativeElement)\r\n }\r\n }\r\n }\r\n}\r\n","<div #block [ngClass]=\"{'full-width': !this.target && enProceso}\">\r\n <div *ngIf=\"enProceso\" class=\"blocking-overlay\">\r\n <img *ngIf=\"logo\" [src]=\"logo\" class=\"icon-block\">\r\n <p-progressSpinner *ngIf=\"!logo\"></p-progressSpinner>\r\n <p *ngIf=\"texto\">{{texto}}</p>\r\n <p-progressBar *ngIf=\"progress !== undefined\" [value]=\"progress\" [style]=\"{'height': '20px', 'width': '50vw'}\"></p-progressBar>\r\n </div>\r\n <div *ngIf=\"!enProceso\"></div>\r\n</div>\r\n","import { CommonModule } from '@angular/common';\r\nimport { Component, Input, OnInit } from '@angular/core';\r\nimport { Skeleton } from 'primeng/skeleton';\r\nimport { TableModule } from 'primeng/table';\r\n\r\n@Component({\r\n selector: 'lib-table-loading',\r\n imports: [CommonModule, TableModule, Skeleton],\r\n templateUrl: './table-loading.component.html',\r\n styleUrl: './table-loading.component.css',\r\n})\r\nexport class TableLoadingComponent implements OnInit {\r\n @Input() columns: number = 5;\r\n @Input() rows: number = 10;\r\n @Input() rowsWidth: { width: string; height: string }[] = [\r\n { width: '100%', height: '1.5rem' },\r\n { width: '100%', height: '1.5rem' },\r\n { width: '100%', height: '1.5rem' },\r\n { width: '100%', height: '1.5rem' },\r\n { width: '100%', height: '1.5rem' },\r\n ];\r\n @Input() columnsWidth: { width: string; height: string }[] = [\r\n { width: '100%', height: '1.5rem' },\r\n { width: '100%', height: '1.5rem' },\r\n { width: '100%', height: '1.5rem' },\r\n { width: '100%', height: '1.5rem' },\r\n { width: '100%', height: '1.5rem' },\r\n ];\r\n skeletonRows: number[] = [];\r\n skeletonColumns: number[] = [];\r\n @Input() loadingType: string = '';\r\n\r\n ngOnInit() {\r\n this.updateSkeletonColumns();\r\n }\r\n\r\n updateSkeletonColumns() {\r\n this.skeletonRows = Array.from({ length: this.rows }, (_, i) => i);\r\n this.skeletonColumns = Array.from({ length: this.columns }, (_, i) => i);\r\n }\r\n\r\n rowSize(index: number): { width: string; height: string } {\r\n return this.rowsWidth[index] || { width: '100%', height: '1.5rem' };\r\n }\r\n\r\n columnSize(index: number): { width: string; height: string } {\r\n return this.columnsWidth[index] || { width: '100%', height: '1.5rem' };\r\n }\r\n}\r\n","<div class=\"table-loading-container\">\r\n <p-table [value]=\"skeletonRows\" responsiveLayout=\"scroll\">\r\n <ng-template pTemplate=\"header\">\r\n <tr>\r\n <th *ngFor=\"let col of skeletonColumns\">\r\n <p-skeleton [width]=\"columnSize(col).width\" [height]=\"columnSize(col).height\"></p-skeleton>\r\n </th>\r\n </tr>\r\n </ng-template>\r\n <ng-template pTemplate=\"body\">\r\n <tr>\r\n <td *ngFor=\"let col of skeletonColumns\">\r\n <p-skeleton [width]=\"rowSize(col).width\" [height]=\"rowSize(col).height\"></p-skeleton>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n</div>\r\n","import { NgModule } from '@angular/core';\r\nimport { SfLoadingComponent } from './sf-loading.component';\r\nimport { BlockUIModule } from 'primeng/blockui';\r\nimport { ProgressSpinnerModule } from 'primeng/progressspinner';\r\nimport { CommonModule } from '@angular/common';\r\nimport { ProgressBarModule } from 'primeng/progressbar';\r\n\r\n\r\n@NgModule({\r\n declarations: [\r\n SfLoadingComponent\r\n ],\r\n imports: [\r\n BlockUIModule\r\n ,ProgressSpinnerModule\r\n ,ProgressBarModule\r\n ,CommonModule\r\n ],\r\n exports: [\r\n SfLoadingComponent\r\n ]\r\n})\r\nexport class SfLoadingModule { }\r\n","/*\r\n * Public API Surface of sf-loading\r\n */\r\n\r\nexport * from './lib/sf-loading.component';\r\nexport * from './lib/components/skeletons/table-loading/table-loading.component';\r\nexport * from './lib/sf-loading.module';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1"],"mappings":";;;;;;;;;;;;;;MAQa,kBAAkB,CAAA;AAEpB,IAAA,MAAM;AACN,IAAA,QAAQ;AACR,IAAA,KAAK;AAEL,IAAA,IAAI;IAEJ,SAAS,GAAG,KAAK;AAEN,IAAA,KAAK;AAEjB,IAAA,YAAY;AAGpB,IAAA,WAAA,GAAA;IAEA,WAAW,GAAA;QACT,IAAI,IAAI,CAAC,KAAK;YAAE,IAAI,CAAC,eAAe,EAAE;;IAGxC,eAAe,GAAA;AACb,QAAA,IAAI,IAAI,CAAC,SAAS,EAAC;AACjB,YAAA,IAAI,IAAI,CAAC,MAAM,EAAC;gBACd,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU;gBACtC,IAAI,CAAC,MAAe,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC;;;aAEzD;AACJ,YAAA,IAAI,IAAI,CAAC,MAAM,EAAE;AACf,gBAAA,MAAM,aAAa,GAAI,IAAI,CAAC,MAAe,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC;AAC9E,gBAAA,IAAI,aAAa;oBAAG,IAAI,CAAC,MAAe,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC;;;;wGA9BzE,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,kBAAkB,sSCR/B,0gBASA,EAAA,MAAA,EAAA,CAAA,6jBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,0DAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,OAAA,EAAA,aAAA,EAAA,MAAA,EAAA,mBAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,WAAA,EAAA,QAAA,EAAA,8CAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,WAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,MAAA,EAAA,MAAA,EAAA,OAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;4FDDa,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAN9B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,YAAY,cAGV,KAAK,EAAA,QAAA,EAAA,0gBAAA,EAAA,MAAA,EAAA,CAAA,6jBAAA,CAAA,EAAA;wDAIR,MAAM,EAAA,CAAA;sBAAd;gBACQ,QAAQ,EAAA,CAAA;sBAAhB;gBACQ,KAAK,EAAA,CAAA;sBAAb;gBAEQ,IAAI,EAAA,CAAA;sBAAZ;gBAEQ,SAAS,EAAA,CAAA;sBAAjB;gBAEmB,KAAK,EAAA,CAAA;sBAAxB,SAAS;uBAAC,OAAO;;;MEPP,qBAAqB,CAAA;IACvB,OAAO,GAAW,CAAC;IACnB,IAAI,GAAW,EAAE;AACjB,IAAA,SAAS,GAAwC;AACxD,QAAA,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;AACnC,QAAA,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;AACnC,QAAA,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;AACnC,QAAA,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;AACnC,QAAA,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;KACpC;AACQ,IAAA,YAAY,GAAwC;AAC3D,QAAA,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;AACnC,QAAA,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;AACnC,QAAA,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;AACnC,QAAA,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;AACnC,QAAA,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;KACpC;IACD,YAAY,GAAa,EAAE;IAC3B,eAAe,GAAa,EAAE;IACrB,WAAW,GAAW,EAAE;IAEjC,QAAQ,GAAA;QACN,IAAI,CAAC,qBAAqB,EAAE;;IAG9B,qBAAqB,GAAA;QACnB,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;QAClE,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;;AAG1E,IAAA,OAAO,CAAC,KAAa,EAAA;AACnB,QAAA,OAAO,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;;AAGrE,IAAA,UAAU,CAAC,KAAa,EAAA;AACtB,QAAA,OAAO,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;;wGAnC7D,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAArB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,qBAAqB,6MCXlC,qwBAkBA,EAAA,MAAA,EAAA,CAAA,0PAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDXY,YAAY,EAAE,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,WAAW,ulEAAE,QAAQ,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,OAAA,EAAA,OAAA,EAAA,WAAA,EAAA,cAAA,EAAA,MAAA,EAAA,OAAA,EAAA,QAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;4FAIlC,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBANjC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,mBAAmB,WACpB,CAAC,YAAY,EAAE,WAAW,EAAE,QAAQ,CAAC,EAAA,QAAA,EAAA,qwBAAA,EAAA,MAAA,EAAA,CAAA,0PAAA,CAAA,EAAA;8BAKrC,OAAO,EAAA,CAAA;sBAAf;gBACQ,IAAI,EAAA,CAAA;sBAAZ;gBACQ,SAAS,EAAA,CAAA;sBAAjB;gBAOQ,YAAY,EAAA,CAAA;sBAApB;gBASQ,WAAW,EAAA,CAAA;sBAAnB;;;MERU,eAAe,CAAA;wGAAf,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;yGAAf,eAAe,EAAA,YAAA,EAAA,CAZxB,kBAAkB,CAAA,EAAA,OAAA,EAAA,CAGlB,aAAa;YACZ,qBAAqB;YACrB,iBAAiB;AACjB,YAAA,YAAY,aAGb,kBAAkB,CAAA,EAAA,CAAA;AAGT,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,eAAe,YATxB,aAAa;YACZ,qBAAqB;YACrB,iBAAiB;YACjB,YAAY,CAAA,EAAA,CAAA;;4FAMJ,eAAe,EAAA,UAAA,EAAA,CAAA;kBAd3B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE;wBACZ;AACD,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,aAAa;wBACZ,qBAAqB;wBACrB,iBAAiB;wBACjB;AACF,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP;AACD;AACF,iBAAA;;;ACrBD;;AAEG;;ACFH;;AAEG;;;;"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { OnInit } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare class TableLoadingComponent implements OnInit {
|
|
4
|
+
columns: number;
|
|
5
|
+
rows: number;
|
|
6
|
+
rowsWidth: {
|
|
7
|
+
width: string;
|
|
8
|
+
height: string;
|
|
9
|
+
}[];
|
|
10
|
+
columnsWidth: {
|
|
11
|
+
width: string;
|
|
12
|
+
height: string;
|
|
13
|
+
}[];
|
|
14
|
+
skeletonRows: number[];
|
|
15
|
+
skeletonColumns: number[];
|
|
16
|
+
loadingType: string;
|
|
17
|
+
ngOnInit(): void;
|
|
18
|
+
updateSkeletonColumns(): void;
|
|
19
|
+
rowSize(index: number): {
|
|
20
|
+
width: string;
|
|
21
|
+
height: string;
|
|
22
|
+
};
|
|
23
|
+
columnSize(index: number): {
|
|
24
|
+
width: string;
|
|
25
|
+
height: string;
|
|
26
|
+
};
|
|
27
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TableLoadingComponent, never>;
|
|
28
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TableLoadingComponent, "lib-table-loading", never, { "columns": { "alias": "columns"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "rowsWidth": { "alias": "rowsWidth"; "required": false; }; "columnsWidth": { "alias": "columnsWidth"; "required": false; }; "loadingType": { "alias": "loadingType"; "required": false; }; }, {}, never, never, true, never>;
|
|
29
|
+
}
|
package/package.json
CHANGED
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "sf-loading",
|
|
3
|
-
"version": "13.0.
|
|
3
|
+
"version": "13.0.2",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@angular/common": "^19.2.0",
|
|
6
|
-
"@angular/core": "^19.2.0"
|
|
6
|
+
"@angular/core": "^19.2.0",
|
|
7
|
+
"primeflex": "^4.0.0",
|
|
8
|
+
"primeng": "^19.1.4",
|
|
9
|
+
"primeicons": "^7.0.0"
|
|
7
10
|
},
|
|
8
11
|
"dependencies": {
|
|
9
12
|
"tslib": "^2.3.0"
|
package/public-api.d.ts
CHANGED